ホームページ作成－HTMLの基本とメインのタグ一覧－

ホームページ作成				アクセスアップとSEO対策　メインコンテンツ ★アクセスアップの基本 ★SEO対策 ★ホームページ作成 ★アフィリエイトの基本 ★アクセスアップ支援

ホームページの基本はHTML ホームページやブログは、ＨＴＭＬ（HyperText Markup Language）というマークアップ言語で記述されています。そういうと何だか難しいことのように思いますが、簡単にいうと、テキストで書かれた文書を、HTMLの決まりごとを使って、装飾やレイアウトを変えて見栄え良くしたものです。 HTMLの基本は、文書をどのような表示の仕方で見せるか……というようなことです。このページのタイトルは○○で、一番大きな見出しが▲▲で、ここにはアンダーラインを引いて……というようなことを、書いていきます。しかし、HTMLを知らなくても、ホームページを作ることは可能です。最近では無料でブログやホームページを作成できるサービスや無料のレンタルサーバーもありますので、そのようなツールを使えば、何も知らない初心者の方でも５分で作成できてしまいます。（オリジナル性はありませんけど……）個性的なブログやホームページを作ろうと思ったら、多少の知識は必要ですが、これもホームページ作成ソフトを使うことで、普通のワープロソフトで文書を作る感覚で作ることが可能です。文書を装飾する為の、様々なHTMLタグを覚えている必要がなくなってしまいました。 HTMLそのものは、テキスト文書ですから、テキストエディタ（WINDOWSでは、【メモ帳】がそれに当たります）があれば、作ることができます。このテキスト文書に、他の文書へのハイパーリンクや画像、動画などを埋め込むことが出来るのがＨＴＭＬです。テキストエディタを用いて、HTMLタグを直接記述していくことを【タグ打ち】や【手打ち】と言ったりしますが、初心者には難しく、途中で挫折してしまいます。まずは無料のサービスや作成ソフトを使って、チャレンジすることをお勧めします。

**サイト（ブログ・ホームページ）を作成するコンテンツ**
ホームページ作成	レンタルサーバーとは	レンタルサーバーを選ぶ	独自ドメインのメリット・デメリット	無料ブログ・ホームページ
広告のないブログ


ＨＴＭＬとＸＭＬＨＴＭＬの他にウェブページとして同じように表示させられるものにＸＭＬやＸＨＴＭＬもあります。ＸＭＬやＸＨＴＭＬは、ＨＴＭＬのように要素の固定がなされていないもので、用途に応じて構造化できるというもの。ＨＴＭＬで言うと　<B>～</B>　というタグは　太字にする　と言う風に、すべてが決まっているわけですが、ＸＭＬになると、この決まり事を、自分で作ることが可能です。ただし、こちらは記述が厳密になっていて、なれないとエラーになりやすいです。（初心者には不向きです）高度な表現やアプリケーションを自分で作成することの無い人なら、ＨＴＭＬで十分です。個人のホームページなら、ＨＴＭＬで不自由さを感じることは、ほとんどありませんので。ＨＴＭＬの記述の仕方ＨＴＭＬの詳しい説明はいろんなサイトに載っているので、ここでは基本的なもののみ説明します。これを知っていれば、とりあえずホームページが作れるというものです。１、まずは先頭の記述 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" > この文書がＨＴＭＬで記述されているということを宣言します。ＨＴＭＬのバージョンは４．０１。２、次にＨＴＭＬの始まりと終わりを定義します。先頭のすぐ後に入れて、全体を<HTML>～</HTML>で括ります。３、ＨＴＭＬの中は大きく２つに分かれていて、<HEAD>～</HEAD>と<BODY>～</BODY>でそれぞれ括ります。 <HEAD>～</HEAD>は、そのウェブページが、誰が書いたものなのか、どういうソフトで作られたとか、そのページの紹介文などの情報を書いておきます。ウェブブラウザで閲覧しても、表示されない部分です。ウェブブラウザで表示されて、皆さんの目に入るのは、<BODY>～</BODY>の間に記述されたものだけです。一般的な記述は下記のようになります。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META name="robots" content="index,follow"> <META name="keywords" content="該当するキーワードを書いておきます"> <META name="description" content="紹介文はここに書きます"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE>ここにタイトルを書きます</TITLE> </HEAD> <BODY>ここに本文を書きます。ブラウザに表示される部分です。</BODY> </HTML> ウェブページ（ＨＴＭＬ）のソースを見る百聞は一見に如かず…なので、実際にウェブページがどのような記述になっているかを見ながら覚えた方が確実です。皆さんが良く使われているウェブブラウザといえば、インターネットエクスプローラーだと思います。ツールバーの【ページ（Ｐ）】をクリック　　↓　　↓　　↓ 【ソースの表示（Ｓ）】をクリック　　↓　　↓　　↓ ウェブページのＨＴＭＬが表示されますこれで、どういう風に書かれているかがわかりますので、興味のあるサイトのＨＴＭLを見るとかなり参考になるはずです。スタイルシートとは見栄えを細かく設定する為のタグです。 <HEAD>～</HEAD>の中に以下のタグを記述します。 <STYLE type="text/css"> <!-- ここに定義するものが入ります --> </STYLE> すると、文章の中の指定されたものが、定義通りに表示されるわけです。見出しタグだけに色をつけたり、リンクの色を変えたり…… ｉｄ属性を用いて、部分的に適用することもできます。慣れないとちょっと使いにくい感があると思いますが、慣れると便利です。でも知らなくても、困ることはありませんので。興味がある方は、いろんなサイトのスタイルシートをみてみてください。いろんな方法があるのに感心するのではないでしょうか。
				ＨＴＭＬタグ一覧タグ A 　---　　リンク　　　属性　　　　　意味　　　name 　　　　ラベル　　　href 　　　　URL (ファイル名) 　　　hreflang 　　言語　　　target 　　　　ターゲット　　　rel 　　　　　　リンク先のタイプ　　　rev 　　　　　リンク元のタイプ B 　---　　太字 BODY 　---　本文　　　background 　　背景画像　　　bgcolor 　　　　　背景色　　　text 　　　　　　　文字色　　　link 　　　　　　　リンク色　　　vlink 　　　　　　既読リンク色　　　alink 　　　　　　選択リンク色 BR 　--- 　改行 CENTER 　---　中央揃え COL 　---　　表の桁　　　span 　　　　桁数　　　width 　　　幅　　　align 　left, center, right, justify, char 水平位置揃え　　　char 　　　水平位置揃え文字　　　charoff 　水平位置揃えのオフセット　　　valign 　top, middle, bottom, baseline 垂直位置揃え FONT 　　---　　フォント　　　size 　　　サイズ　　　color 　　　色　　　face 　　　　書体 H1 　　---　　見出し 1 　　align left, center, right, justify 位置揃え H2 　　---　　見出し 2 　　align left, center, right, justify 位置揃え H3 　　---　　見出し 3 　　align left, center, right, justify 位置揃え H4 　　---　　見出し 4 　　align left, center, right, justify 位置揃え H5 　　---　　見出し 5 　　align left, center, right, justify 位置揃え H6 　　---　　見出し 6 　　align left, center, right, justify 位置揃え I 　　---　　斜体 IMG 　　---　　画像　　　src 　　　ファイル名　　　alt 　　　　代替テキスト　　　longdesc　　詳細説明　　　height 　　　高さ　　　width 　　　　幅　　　align 　top, middle, bottom, left, right 位置揃え　　　border 　　　枠の幅　　　hspace 　　　水平余白　　　vspace 　　　垂直余白　　　name 　　　名前 META 　　---　　メタ情報　　　http - equiv 　　　HTTP - EQUIV 項目　　　name 　　　　NAME項目　　　content 　　　　値　　　scheme 　　　　スキーム P 　　---　　標準段落　　　align 　　left, center, right, justify 位置揃え S 　　---　　取り消し線 STRONG 　　---　　ストロング

ホームページ作成	レンタルサーバーとは	レンタルサーバーを選ぶ	独自ドメインのメリット・デメリット	無料ブログ・ホームページ
広告のないブログ

Copyright (C) 2009-2011 アクセスアップとSEO対策. All Rights Reserved