3.文法上の注意点

■HTML構文とXHTML構文

HTML5では、「HTML構文」と「XHTML(XML)構文」という2通りの文書形式が規定されています。

・HTML構文
HTML構文は、これまで使われてきたHTML4.01と、HTML4.01をXMLの文法で定義しなおしたXHTML1.0の両方に互換性のある構文です。
基本的にはHTML4.01の文法規則に従って記述しますが、XHTML1.0の文法規則で記述することも認められています。

<!DOCTYPE html>
<html>
<head>
<meta charset=”UTF-8”>
<title>HTML5文書サンプル</title>
</head>
<body>
<p>段落サンプル</p>
</body>
</html>

・XHTML構文
XHTML(XML)構文は、これまで使われてきたXHTML1.0と互換性があり、XHTML1.0の文法規則に従って記述します。

<?xml version=”1.0” encoding=”UTF-8”?>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta charset=”UTF-8”>
<title>HTML5文書サンプル</title>
</head>
<body>
<p>段落サンプル</p>
</body>
</html>

なお、通常、HTML文書のMIMEタイプには「text/html」を指定しますが、XHTML(XML) 構文で文書を作成した場合には、MIMEタイプを「application/xhtml+xml」として配信しなけれはなりません。
XHTML構文のページとして正しくブラウザに解釈させるには、サーバー側での設定が必要になることもあります。
また、ブラウザによってはこの「application/xhtml+xml」に対応していないこともあるため注意が必要です。





■DOCTYPE宣言

HTML4.01やXHTML1.0では、その文書がどのバージョンのDTD(Document Type Definition/文書型定義:使用できる要素や属性の特色、用法などを記したもの)に基づいて作成されているのかを示す、長いDOCTYPE宣言を文書の冒頭に記述していました。

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/htm14/strict.dtd”>
(HTML4.01の最も厳密な仕様で文書を作成する場合のDOCTYPE宣言。)

HTML5のDOCTYPE宣言は、次のように非常にシンプルで書きやすいものになっています。

<!DOCTYPE html>

HTML5にはDTDが存在しないため、DOCTYPE宣言でHTMLのバージョンやDTDを示す必要はなくなりました。
HTML5のDOCTYPE宣言は、ブラウザの表示モードを標準モードにするという目的でのみ利用されるものです。

HTML構文で文書を作成する場合は、DOCTYPE宣言は必須です。
大文字と小文字は区別されませんので、上記のように大文字と小文字で記述することも、大文字だけ、または小文字だけに統一して記述することもできます。


■文字工ンコーディングの指定方法

HTML5では、文書の文字工ンコーディングに「UTF-8」が強く推奨されています。
文字工ンコーディングの指定方法としては、meta要素にcharset属性が追加されました。
次の一文を、文書の先頭から1024バイト以内に記述します。

HTML5の文字工ンコーディングの指定方法(UTF-8の場合)

<meta charset=”UTF-8”>

これは従来の文字工ンコーディングの指定方法に置き換わるものですが、HTML5では従来の指定方法を利用することもできます。

従来の文字工ンコーディングの指定方法

<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8”>

ただし、両方の指定方法を混在させることはできません。
また、meta要素で指定する文字工ンコーディング名と、文書の実際の文字工ンコーディングが同じになるように注意してください。


■ブラウジング・コンテキストの導入

文法とは意味合いが異なりますが、仕様書ではこれまでのウィンドウ、フレームに代わって「ブラウジング・コンテキスト(browsing context)」という概念が導入されました。
これは、文書がユーザーに表示される環境を表します。
例えば、タブブラウザであれは個々のタブ、タブに対応していないブラウザであればウィンドウがブラウジング・コンテキストになります。
インラインフレームの場合は「入れ子にされたブラウジング・コンテキスト(nested browsing context)」と呼はれます。