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の上位規格とするやり方もあります。
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つの文書型定義(DTD)を規定しています。同じバージョンでもサポートする要素が異なっています。自分の事情に合わせて次の3つの何れかの文書型宣言をすることになっています。
これは、推奨しないこととなった要素や属性を含まず、またフレーム設定用の要素・属性をも含みません。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
これは、厳密型DTDのすべての要素・属性に加えて、推奨しない要素や属性も含む(推奨しないもののほとんどは視覚的プレゼンテーションに関わるもの)。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
これは、移行型DTDのすべてに加えて、フレーム用の内容を加えたものです。フレームの記述のあるページにはこれをつけます。(授業で作ったページでは frame01.html だけです)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
HTML 4.01 を XML に適合するように定義し直したものです。3種類はHTML 4.01 と同じです。文書型の宣言の前に XML に準拠した文書であることを示す宣言が必要になります。また html タグの中にいくつかの記述が必要ですので、合わせてここに書いてあります。
<?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">
<?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">
<?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">
<?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" /> ………
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> ………