Web: HTML5とXHTML
このところ、SVGなどの(私にとって)新しい技術について調べることが増え、自然とHTML5への興味も高まってきた。 これまでは各ブラウザの対応状況をhtml5test.comで見るくらいで、Safariの対応の遅さに意味もなく歯がゆい思いをしてきた程度だった。 ちなみにSafari 9でもスコアは555点満点のうち400と、ChromeやFirefoxに大きく引き離されているし、Internet Explorer後継のMicrosoft Edgeにも(ほぼ同じスコアだが)追い抜かされている。
現在このサイトはXMLベースであるXHTML 1.0 Strictを使ってマークアップしている。 HTML5は従来のHTMLのように、タグを省略するなど、ある程度「ゆるく」マークアップできる言語のようだ。 しかし個人的にはきちんと要素の範囲を指定して、文書構造がはっきりするXHTMLの方が好みだ。 HTML5では、XMLをベースとしてXHTML式にマークアップすることも可能なようで、XHTML5と呼ばれているようだ。 Google検索で調べてみるとすでに5年以上前からこの違いについて解説しているサイトがあり、自分の不勉強が恥ずかしい限りだ。
HTML5では文書構造を示すための要素としてsection, article, nav, aside, header, footer
が追加されていて、文書の意味づけがより明確に行えるようだ。
この辺りを厳密にやろうとすると、Movable TypeのテンプレートをCSSも含めて相当書き換えないといけなくなりそうだ。
また、現在のテンプレートはMovable Typeのテーマ機能を使うためと思われるが、div要素の入れ子構造が深くて、あまり好きではなかった。
これを機会に、よりシンプルなマークアップになるようにしてみたい。
それに伴って、個別記事のマークアップも変更しなければならないかもしれない。
ただ、XHTML5でマークアップするには、サーバー側のHTTP応答ヘッダを変える必要もあるなど、やや敷居が高い。 しかし従来のHTMLの延長で、限りなくXHTML5準拠に近いというような方法は可能なのではないかと思う。 HTML5への移行を、今後のサイト更新の目標の一つとしていきたい。
参考情報へのリンク
- W3C HTML5
公式サイトとも言えるW3Cの勧告。2014年10月に勧告となったようだ。
- HTML5日本語版
上記W3C勧告の日本語訳。今後よく読むことになりそうだ。
- WHATWG
こちらこそ公式サイトというべきなのかもしれない、WHATWGのサイト。
- HTML5の登場で、XHTMLは結局どうなったの?
2010年に書かれた@ITのHTML5などに関する連載記事の一部で、XHTMLが今後どうなるかを説明している。HTML5でもXHTMLが使えることが書かれていて一安心。
- XHTMLとHTML5の組み方を見比べてみる
実際に、DOCTYPEやxmlnsなどをどう記述すれば良いのかが説明されている。
- html5.jp
HTML5の使用に関する記事がある。html5doctorの翻訳記事なども役に立ちそう。
- HTML5リファレンス
タグの解説サイト。W3C勧告はその性格上、通常マークアップする必要以上の情報が書かれているので、絞り込んだ情報が日本語で書かれたリファレンスはありがたい。
- XHTML 5 について。
HTML 5 を XHTML 5 文書としても利用出来るようにするには
など、私の知りたかった情報がほぼ全て網羅・解説されている。- Another HTML-lint 5
HTML5対応版のAnother HTML-lint。本家Another HTML-lintには私も大変お世話になったし、HTML5対応版があるのは心強い。