今回はHTMLのタグについて解説していきます。ゼロから始める方はまず「ゼロから始めるホームページ制作~基礎知識編~」の記事を読んでくださいね。それでは早速解説していきましょう。前回の記事の復習になりますが、おさらいしておきましょう。基本は「挟む」タグは「開始タグ」と「終了タグ」で挟んで記述していきます。見出しをつけたい場合は<h1>見出しテキスト</h1>という感じです。次に、HTML文書の基本構成です。</body></html><body>~</body>間にタグを追加していきながらホームページを制作していきます。一部例外あり中には終了タグを必要としない物もあります。画像表示のタグは、終了タグを必要とせずに一つで完結します。「画像」』を参考にしてください。例外なので、基本は開始タグと終了タグで挟むと覚えておきましょう。使う基本的なタグHTML文書を作る上で、ほぼ確実に使用するであろうタグをご紹介します。このタグの意味と使い方を覚えておけば、最低限のホームページは制作できます。<h>~</h>「見出し」<h>タグは<h1>から<h6>までの6段階の見出しを定義します。<h1>が最上位の大見出し、<h6>が最下位の小見出しを意味します。<h>タグで囲まれた部分は文字サイズが変化し、太文字で表示されて前後に改行がはいります。この<h>タグは、コンピュータがその文書の見出しを判別する非常に重要なタグで、SEO対策の観点でも重要視されています。そのため、フォントサイズの変更を目的で使用することはおススメしません。フォントサイズを変更する場合は<font>タグやCSSを使って変更するようにしましょう。<h>タグのフォントサイズの目安は次の通りです。<h1>見出しテキスト</h1><h2>見出しテキスト</h2><h3>見出しテキスト</h3><h4>見出しテキスト</h4><h5>見出しテキスト</h5><h6>見出しテキスト</h6>見出しテキスト見出しテキスト見出しテキスト見出しテキスト見出しテキスト見出しテキスト※大きさはあくまでも目安です。ブラウザによっては若干大きさが変わります。<p>~</p>「段落」<p>~</p>間に記述された内容を一つの段落として定義するタグです。小説などでは一文字下げて段落をつけていますが、ホームページでは<p>タグを使って表します。ホームページではただ文字を打っても1文字分下げて段落は付けられません。そのため、長い文章になればなるほど読みにくくなってしまいます。読みやすくするために、段落付けや背景色、文字色をつけてることも効果的です。<p>タグはコンピュータに一文字下げの「段落」を理解してもらうためのタグです。レイアウト調整で文章の途中に<p>タグを入れてしまうと、不自然なところから段落が始まってしまう為、コンピュータから「適切な文章」と認識されなくなってしまいます。このような段落をコンピューターに定義するのが<p>タグです。タグの前後に1行分改行されますが、単純な改行では<br>タグを使用しましょう。適切な文章はSEO対策にも関わる要素の一つだと言われているので、改行を<p>タグで行うのは避けましょう。<div>~</div>「ブロック要素」<div>タグ自身に特に意味は持っていませんが、<div>~</div>間で挟んだ内容を一つのブロック(グループ)として定義することができます。このようにブロック要素を定義することで、ブロック全体に同じCSSを簡単に適用する事ができます。<div>タグの前後には改行が入ります。<div>タグと同じように、CSSを適用させるために使う<span>というタグがあります。<span>タグは文章の一部にCSSを適用させたい場合に使う、インライン要素のタグです。インライン要素は、文章の一部として扱われるため改行はされません。<div>タグと<span>タグは、「CSSの記述を簡素化させるためのタグ」と覚えておきましょう。<a>~</a>「リンク」<a>タグはリンクの出発点と到達点を指定するタグで、<a>~</a>間に記述された内容にリンクが設置されます。文字列であれば文字に、画像であれば画像にリンクが設置されます。<a>ここへの記述がリンクになります。「ここへの記述がリンクになります。」の文字列にリンクが設置。image.jpgの画像にリンクが設置。これではリンクの設置はできません。<a>タグは属性を設定して使用します。属性はいくつもありますが、まずは3つだけ覚えておけば大丈夫です。文書内にリンク先を指定するための名前(アンカー)を付ける。リンク先を表示させる場所の指定。上のhref属性から順番に解説していきましょう。href属性href属性には何通りかの指定方法があります。