ホントの初心者でも絶対分かる!HTMLタグ<html><head><body>の意味とは -ホームページビルダーを使ったWebサイトの作り方-
こんにちは。PCインストラクターの良知敏子です。
第2回目のコラムでは、HTMLソースを読んでいく上での基本事項を解説していきました。
今回のコラムでは、HTMLソースの構造やタグの解説を行っていきます。
少しだけソースの修正も行ってまいります。

まずは、前回作成した、ごく簡単なホームページのソースを見ていきましょう。
このソースは「ページ編集」タブでホームページを作成すると、ホームページビルダーが自動で記述を行うものでしたね。

まずは、おおまかに見ていきましょう。
「」「」「」という3つのタグに注目しましょう。
HTML文書は「」「」「」の3つのタグで文書の構造を表します。
- :この文書がHTML文書である事の宣言
- :文書のヘッダー情報の記述
- :文書の本体
それぞれのタグは終了タグと共に使用し、以下のように使っていきます。
- 「 ~ 」:HTML文書を記述する部分
- 「 ~ 」:文書のヘッダー情報を記述する部分
- 「 ~ 」:実際にブラウザ上で見える内容を記述する部分
それでは1行ずつ見ていきます。
まずは1行目の「」。
こちらは、どの規格に準じたHTML文書を記述しているのかを定義する部分なのですが、今の段階では難しい事は考えず、おまじないのようなものだと認識して下さい。
この部分が無くても問題はありません。
ブラウザはHTML文書を解釈して表示してくれます。
次に2行目。
「」ですが、こちらはhtml文書内でどのような言語を使っているのかを定義している部分です。
日本語を使っているので「ja」と指定しています。
つまり「これから日本語でHTML文書を記述します」と読み替えることが出来ます。
ここで少し前回のおさらいです。
要素を「<>」で囲んだものが「タグ」と呼ばれるものでした。
2行目の「」という部分を見ると「html」という要素の後ろに「lang="ja"」と記述されていますが、この「lang」の事を属性といいます。
「lang」は「language」の事で「言語を指定して下さい」という意味になります。
要素ごとに定義が出来る属性が決まっており、要素が「概要」だとしたら、属性は「詳細」と考えることが出来ます。
次に「」の部分です。
ここは、文書のヘッダー情報が記述される場所です。
ヘッダー情報にはどのような種類があるかというと、文書のタイトルや作成者情報、文書のキーワードや説明文、文字エンコーディング情報などになります。
今回のHTMLソースでは3つのヘッダー情報が記述されており、以下のように読み替えることが出来ます。
- :
文字エンコーディングは、UTF-8を使用します。
(UTF-8とは、日本語文字エンコーディングの値の一つ)
- :
JustSysytem社のホームページビルダー18で作成しました。
(メモ帳などのテキストエディタで作成する場合は記述しないこと)
:
この文書のタイトルは○○です。
まずは「」タグですが、これは文書に関する様々な属性を定義するタグです。
今回は文字エンコーディングの指定と、文書をホームページビルダーにて作成したことが定義されています。
また、文字エンコーディングについてですが、指定は必須ではありません。
しかし、指定を行わないとブラウザによっては文字化けが起きる場合もあります。
出来れば指定しておいた方が良いでしょう。


