もくじ

html5へ

ウェブページの次の標準

2012年を目標にあたらしい標準であるHTML5ができようとしています。今回は主要ブラウザメーカーが対応したブラウザを間に合わせるということですので、標準ができるころには使える状態になるということです。授業でもできるだけ早い時期に取り入れようと考えています。

HTML HTML 4.01
厳密型
HTML 4.01
移行型
HTML 4.01
フレーム型
XHTML XHTML 1.0
厳密型
XHTML 1.0
移行型
XHTML 1.0
フレーム型
XHTML 1.1 × ×
HTML5 HTML5

名前の上からはXHTMLを飛ばして4.01から5になったように見えます。XHTMLの上位規格とするやり方もあります。

html5になると

DOCTYPE宣言が極めて簡単になります。文字コードもUTF-8が推奨されていますから、UTF-8なら不要ということになるかもしれません。

以下はW3Cの Working Draft (策定途中の文書)に掲載されていた例にcharsetの記述を加えたものです。

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Sample page</title>
 </head>
 <body>
  <h1>Sample page</h1>
  <p>This is a <a href="demo.html">simple</a> sample.</p>
  <!-- this is a comment -->
 </body>
</html>

2007年ごろに授業で作るページのタイプをHTMLからXHTML1.1へ換えました。その時、現在はHTMLからXHTMLへの移行途中にあると説明しています。XHTMLにすれば数式をページの中に書き込むなど出きることが増えていくはずでした。しかし、世の中はそのようには進まずHTMLのままだったり、間違ったままのXHTMLが放置されたりしました。厳密にXHTMLに従うと表示できなくなるブラウザがあるなど一般人が作りながら覚えていくことができなかったという問題も原因のひとつだったと思います。

HTML 4.01の3つの文書型定義

実は HTML 4.01仕様は、3つの文書型定義(DTD)を規定しています。同じバージョンでもサポートする要素が異なっています。自分の事情に合わせて次の3つの何れかの文書型宣言をすることになっています。

HTML 4.01厳密型DTD

これは、推奨しないこととなった要素や属性を含まず、またフレーム設定用の要素・属性をも含みません。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">

HTML 4.01移行型DTD

これは、厳密型DTDのすべての要素・属性に加えて、推奨しない要素や属性も含む(推奨しないもののほとんどは視覚的プレゼンテーションに関わるもの)。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">

HTML 4.01フレーム設定型DTD

これは、移行型DTDのすべてに加えて、フレーム用の内容を加えたものです。フレームの記述のあるページにはこれをつけます。(授業で作ったページでは frame01.html だけです)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
        "http://www.w3.org/TR/html4/frameset.dtd">

XHTML1.0 厳密型の文書型定義

HTML 4.01 を XML に適合するように定義し直したものです。3種類はHTML 4.01 と同じです。文書型の宣言の前に XML に準拠した文書であることを示す宣言が必要になります。また html タグの中にいくつかの記述が必要ですので、合わせてここに書いてあります。

XHTML 1.0厳密型DTD

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">

XHTML 1.0移行型DTD

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">

XHTML 1.0フレーム設定型DTD

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">

XHTML1.1 の文書型定義

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">

  ↓ インターネットエクスプローラ対策

書換後
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
………

HTML5 の文書型定義

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
………

ウェブページ(Mar.2009)
聖愛中学高等学校
http://www.seiai.ed.jp/
Apr.2006 改訂