HTMLタグとは

ブログをカスタマイズするには、HTMLやCSS（スタイルシート）を編集する必要があります。

そこで、今回と次回に分けて、「HTMLタグ」と「CSS（スタイルシート）」について説明します。ブログを思い通りにカスタマイズするためにも、必要な知識ですので、しっかりと学んでいってくださいね。


HTMLとは、Hyper Text Markup Languageの略で、Webページを作成するための言語です。見出しや段落、リンクなどの要素を組み合わせ、Webページの構造を作成するために使用されます。

タグとは、見出しや段落、リンクなどの要素を"<"と" >"で囲んだもので、<h1>、<p>などのように記述したものです。通常は、「<p>～</p>」のように開始タグと終了タグの２つ１組で使用されます。

ブログの場合も、下記のテンプレートなどはHTMLで作成されています。

・メインページ（トップページ）
・カテゴリー・アーカイブ
・個別エントリーアーカイブ（個別記事）
・日付アーカイブ（月別アーカイブ）

タグを理解しておけば、カスタマイズもスムーズにできますので、もう少し詳しくタグについて説明していきます。


タグの記述方法には、下記のようなパターンがあります。

■ <タグ名>～</タグ名>
例えば、段落を示すタグは、

<p>よく使うタグは覚えておこう！</p>

のように記述します。開始タグと終了タグが「対」になっており、終了タグの前には、「/（スラッシュ）」を付けます。
HTMLでは、タグ名は大文字でも小文字でも構いませんが、XHTMLでは、小文字で記述しなければならないので、今のうちから小文字で書くようにしましょう。。

■ <タグ名>のみ
例えば、改行や画像表示タグなどは、

<br /> <img src="sample.gif" alt="サンプル" />

のように記述し、終了タグがないものもあります。

■ <タグ名 属性>～</タグ名>
タグ内に属性を記述することで、より細かな指定を行うことができます。
例えば、

<font size="+1">文字サイズを一段階大きくする</font>

と記述すると、下記のように表示されます。

文字サイズを一段階大きくする

ただし、属性は、タグ名の後に半角スペースをあけて、記述することができますが、上記の例のように、装飾を指定するものは、できるだけスタイルシートで記述するように推奨されています。

■ URL
タグ内にURLを記述する場合、ディレクトリ（フォルダ）は「/」で区切って記述します。

<a href="index.html">リンク</a> <a href="./find.html">リンク</a> <a href="../top.html">リンク</a> <a href="../../menu.html">リンク</a>

同ディレクトリ 現在のディレクトリ 一つ上のディレクトリ 二つ上のディレクトリ

<a href="http://ドメイン名/ディレクトリ名/ファイル名">リンク</a>

インターネット上のページ

ファイル名などは大文字、小文字の区別がありますので、注意してください。


HTMLタグの基本的な記述方法について説明しました。より詳しいHTMLタグの説明は、下記のサイトを利用すると便利ですので、是非、参考にしてください。

お役立ちリンク集（HTMLタグ解説サイト編）
HTMLクリックリファレンス	HTMLタグ・スタイルシート・特殊文字等の早見表。
CYBER@GARDEN	ホームページ作成・Web作成学習/支援サイト。Web作成講座、Webデザイン講座、CSS講座、XHTML講座、HTML辞典、CSS辞典、JavaScript Tipsなど。
みんなのタグ辞典	HTMLタグを解りやすく説明されているHTMLタグリファレンス。HTML小技・雑学など。
とほほのWWW入門	HTML、CGI、JavaScript等のリファレンス、ホームページ作成に関する各種情報。

以上、「HTMLタグ」について説明しました。次回は、「CSS」について説明します。「CSS」も、ブログをカスタマイズする上で必要ですので、頑張って受講してくださいね。

[次回の講義へ] → CSSとは

1クリックの応援で講義内容が濃くなります＾＾