HTML


HTMLの役割

 HTML(Hyper Text Markup Language)とは、Webページを作成するためのマークアップ言語です。「マークアップ」とは[タグ]*(下記参照)を使用し、その部分に意味けをすることを指します。


[タグ]

 HTMLは、タグというしるしを使用し書くことができます。タグはすべて半角で記述し、<>で囲まれたなかに決められた文字を入力することで意味を持たせることができます。またHTMLで使用するタグには開始タグと終了タグの対になるタグが存在し、終了タグには前述のタグに【/(スラッシュ)】を足して書きます。


[要素]

 開始タグと終了タグに囲まれた範囲のことを【要素】と言います。これはHTMLを構成する最も基本的な単位です。HTMLを書いていくうえで必ず使用しなければならない要素が要素でありこれはこの分がHTML文であることを表す要素になります。


[属性]

要素にはそれだけでは完全な効果を表せないものもあります。その場合要素に対応する設定をしなければならず、その役割を持つものを【属性】と呼び、属性の種類を表す【属性名】とその属性の値を表す【属性値】があります。属性が必要とする要素として例に挙げられるものにハイパーリンクがあり、要素としてはのみで記述することができますが、リンク先を指定するためには属性を書かなければならないため不完全な形となってしまいます。


[DOCTYPE宣言]

 まずHTMLにはバージョンがあり、その違いにより使用できない要素が存在します。
DOCTYPE宣言とは、HTMLのバージョンを宣言するために使用します。DOCTYPE宣言は使用しない場合でもHTMLは問題なく書くことができますが、宣言しない場合HTMLのバージョンがブラウザー基準になってしまうため使用ユーザーのバージョンの違いにより要素の解釈が違ってしまうことがあるのでインターネット上にアップロードする場合にはひっすとなります。(練習内容に限ってはアップロードの必要がないので使用しません)
HTML企画DOCTYPE宣言
HTML4.01strict‹!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"›
transitional‹!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"›
XHTML1.0strict‹!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"›
transitional‹!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"›
HTML5‹!DOCTYPE html›

以降DOCTYPE宣言は基本2014から標準化されているHTML5を基準とします。


HTMLの基本構造

 HTMLの基本は、HTML要素・HEAD要素・BODY要素の3つから成り立ちます。それぞれHTML要素は囲まれた範囲全体がHTML文章であることを表し、HEAD要素はタイトル・コード等の文章の基本情報の内容、BODY要素はブラウザ画面に表示する内容を表しています。
基本構造を図にすると下のようになります。


ドキュメントツリー

 HTML文章の要素の入れ子による関係を表として表したものをドキュメントツリーと呼びます。ある要素の上位(外側)にある要素を親要素、下位(内側)にある要素を子要素、平行にあるものを兄弟要素と呼びます。HTML文章を書くときにはこの形になぞって書くことで見やすくすることができます。


HTMLの基本まとめ

 ここまでの内容をまとめた基本のプログラムを書くと下に表示してあるようなものになります。この構造はPHPの内容に進んで行っても使用することになるのでしっかりと覚えておきましょう。


←第1章目次へ
HTML練習問題へ→

↑総目次に戻る