HTML イントロ
HTML とは？
HTML とは、web 文書（web ページ）を記述するためのマークアップ言語です。
- HTML は、Hyper Text Markup Language の略です
- マークアップ言語は、マークアップタグの集合です
- HTML ドキュメントは、HTML タグで記述されます
- 各 HTML タグは、いろいろな文書の内容を記述します
HTML 例
小さな HTML 文書：
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
Try it Yourself »
例の説明
- DOCTYPE 宣言は、HTML の文書の型を定義します
- <html> と </html> との間のテキストは、HTML 文書を記述します
- <head> と </head> との間のテキストは、文書に関する情報を提供します
- <title> と </title> との間のテキストは、文書のタイトルを提供します
- <body> と </body> との間のテキストは、表示するページ内容を記述します
- <h1> と </h1> との間のテキストは、見出しを記述します
- <p> と </p> との間のテキストは、段落を記述します
この記述を使用することにより、Web ブラウザは見出しと段落を持つ文書を表示することができます。
HTML タグ
HTML タグとは、キーワード (タグ名) を山括弧で囲んだものです：
<tagname>content</tagname>
- HTML タグは、通常 <p> と </p> のように ペアで 使用します
- ペアの最初のタグは 開始タグ で、２番目のタグは 終了タグ です
- 終了タグは、開始タグと同じように書きますが、タグ名の前にスラッシュを付けます
開始タグは開きタグ、終了タグは閉じタグと呼ぶ場合もあります。
Web ブラウザ
web ブラウザ（Chrome、IE、Firefox、Safari）の目的は、HTML 文書を読み、それを表示することです。
ブラウザは HTML タグを表示しませんが、文書を表示する方法を決定するためにそれらを使用します：
HTML ページの構造
下は、HTML ページの構造を図式化したものです：
<html>
<head>
<title>ページのタイトル</title>
</head>
<body>
</html>
<h1>これは見出しです</h1>
<p>これは段落です。</p>
<p>これは別な段落です。</p>
</body>
<body> エリア (白い領域の部分) だけが、ブラウザに表示されます。
<!DOCTYPE> 宣言
<!DOCTYPE> 宣言は、web ページを正しく表示するようにブラウザを支援します。
web には、色々な文書タイプがあります。
文書を正しく表示するには、ブラウザはタイプとバージョンの両方を知っておく必要があります。
doctype 宣言は、大文字と小文字を区別しません。どちらの文字でも使用できます：
<!DOCTYPE html>
<!DOCTYPE HTML>
<!doctype html>
<!Doctype Html>
一般的な宣言
HTML5
<!DOCTYPE html>
HTML 4.01
<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
XHTML 1.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
W3Schools のチュートリアルと例は、HTML5 を使用しています。
HTML バージョン
web の初期の頃から、HTML には多数のバージョンがありました：
| バージョン | 年 |
|---|---|
| HTML | 1991 |
| HTML 2.0 | 1995 |
| HTML 3.2 | 1997 |
| HTML 4.01 | 1999 |
| XHTML | 2000 |
| HTML5 | 2014 |