ブログ内検索

by Futomi Hatano

W3C HTML5 草案アップデートされる。新要素も追加。

W3C HTML5 仕様の草案が、2010年6月24日版としてアップデートされました。前回の2010年3月4日版の公開から約4ヶ月ぶりの更新となります。いくつかの仕様の更新がありますので、ここで詳しく見ていきましょう。

アップデートされた仕様書

今回のアップデートでは、HTML5 仕様だけではなく、それに関連する仕様も、2010年6月24日版としてアップデートされました。

以上の 6 つの仕様書は、以前から存在していた仕様書で、今回はアップデートという位置づけになります。しかし、今回は、上記の仕様書に加え、以下の 2 つの仕様書が新たに加えられました。

これらの新たに追加された仕様について、概要を見てみましょう

HTML5: Techniques for providing useful text alternatives

HTML5: Techniques for providing useful text alternatives は、alt コンテンツ属性の書き方を規定した仕様書です。alt コンテンツ属性とは、img 要素や、type コンテンツ属性が image となっている input 要素に使うコンテンツ属性です。

もともとは、alt コンテンツ属性の書き方に関する規定は、HTML5 仕様書4.8.1.1 Requirements for providing text to act as an alternative for images に書かれています。HTML5: Techniques for providing useful text alternatives が扱う範囲は、正確には、HTML5 仕様書の 4.8.1.1.1 A link or button containing nothing but the image4.8.1.1.11 An image in an e-mail or private document intended for a specific person who is known to be able to view images までの範囲を置き換えた仕様となります。

現時点では、同じ内容が重複して、異なる仕様書で規定されていることになりますが、将来的には、HTML5 仕様から、alt コンテンツ属性の仕様が削除され、HTML5: Techniques for providing useful text alternatives に一本化することを想定しているようです。とはいえ、現時点でも、両仕様が全く同じというわけではなく、HTML5: Techniques for providing useful text alternatives の方が alt コンテンツ属性の使い方について、より詳細に書かれています。挿絵も数多く盛り込まれましたので、HTML5: Techniques for providing useful text alternatives の方が、理解しやすいといえるでしょう。

Polyglot Markup: HTML-Compatible XHTML Documents

Polyglot Markup: HTML-Compatible XHTML Documents は、HTML5 の HTML シリアライゼーションで公開するドキュメントを、XML としても文法エラーとならないように書く方法が書かれた仕様書です。つまり、HTML そして XML のどちらも valid となるハイブリッドのドキュメントの作り方が書かれています。このようにハイブリッド対応のマークアップのことを、この仕様書では "Polyglot Markup"(ポリグロット・マークアップ)と呼びます。

通常のウェブ・ブラウザー向けには Content-Typetext/html としてサーバーから送信し、HTML として表示させつつ、同じドキュメントを別のソフトウェアなどで XML として処理したい場合を想定しています。このようなシーンで、同じ内容のドキュメントを 2 つ別々に用意するのは効率的ではありません。1 つのドキュメントで、両方を満たせるのであれば、当然、こちらの方が良いでしょう。

この仕様書に書かれているルールのいくつかをここで紹介しましょう。

  • 文書型宣言は厳密に <!DOCTYPE html> とする(大文字・小文字を区別する)。html の部分は必ず小文字とすること。
  • table 要素では、tbody 要素をマークアップする。
  • 要素や属性は、一部の例外を除き、小文字で表記する。
  • 空要素には終端スラッシュを入れる。(例: <br/>
  • コンテンツ属性の値は引用符で囲む
  • エンティティ参照は amp, lt, gt, apos, quot のみ。それ以外は、例えば &nbsp; であれば &#160; といった表記を使うこと。

上記ですべてではありませんので、もしポリグロット・マークアップが必要な場合は、仕様書をご覧ください。

HTML5 仕様の変更点

HTML5 仕様では、いくつかの変更点がありました。変更点の概要は、HTML5 differences from HTML4 に記載されています。当サイトでその日本語訳を公開しておりますので、参考にしてください。

ここでは、前回の2010年3月4日版からの変更点のいくつか見ていきましょう。

新たに wbr 要素が追加

wbr 要素(日本語訳)は、全く新たに考案された要素ではありません。Netscape に以前から独自に実装されていた要素を、標準として HTML5 で初めて導入されることになりました。今でも、多くのブラウザーに wbr 要素が実装されています。

仕様では、wbr 要素は、改行の機会を表します。 と書かれています。機会(opportunity)というと分かりにくいのですが、ブラウザーに対して、折り返し表示しても構わない位置を指し示すための要素だと考えるのが良いでしょう。

実は、ひらがな、カタカナ、漢字といった日本語においては、あまり役に立つ要素ではありません。なぜかというと、日本語の文字の場合は、ブラウザーは、テキストを囲む要素の幅にあわせて、どの位置でも自動的に折り返してくれるからです。しかし、アルファベットの場合は、半角スペースなどの区切りを表せるような文字がない限り、折り返してくれません。つまり、例えば、150px の幅でテキストを収めたい場合、もし折り返し可能な文字がない連続したアルファベットで構成されたテキストは折り返されず、150px の幅に収まらなくなります。例えば、長い URL などが該当するでしょう。

<div style="width:150px;">

http://www.html5.jp/abcdefg/hijklmn/opqrstu/vwxyz.html#abcdefg

<div>
レンダリング結果

http://www.html5.jp/abcdefg/hijklmn/opqrstu/vwxyz.html#abcdefg

恐らく、これは、Internet Explorer, Safari, Chrome では、150px の幅をはみ出して、折り返されずに URL がレンダリングされているはずです(赤色の罫線の幅が 150px です)。では、wbr 要素を使って、折り返しても構わない箇所を指定してみましょう。

<div style="width:150px;">

http://<wbr/>www.html5.jp/<wbr/>abcdefg/<wbr/>hijklmn/<wbr/>opqrstu/<wbr/>vwxyz.html<wbr/>#abcdefg

<div>
レンダリング結果

http://www.html5.jp/abcdefg/hijklmn/opqrstu/vwxyz.html#abcdefg

これで、ちゃんと 150px を超えないよう、wbr 要素を入れた箇所で折り返されていることが分かるでしょう。近年のブラウザーであれば、どのブラウザーでも機能しているはずです。

meta 要素の keywords が標準メタデータ名に

ページの関連語句を meta 要素を使ってマークアップすることは、みなさん良くご存じのことでしょう。しかし、これまでの HTML5 仕様では、関連語句をマークアップするために使ってきた keywords キーワードが規定されていませんでした。

<meta name="keywords" content="HTML5,マークアップ,W3C" />

今回の HTML5 仕様の草案では、その keywords キーワードが標準メタデータ名として規定されました。

link 要素の rel コンテンツ属性に alternate キーワードを使ってフィードを指定できるように

以前の HTML5 草案では、link 要素の rel コンテンツ属性に alternate キーワードが規定されていました。しかし、該当のドキュメントの代替となるリソースを指定しなければいけませんでした。つまり、該当のドキュメントと全く同じ内容のフィードであれば問題ないのですが、現在、よく使われているような、個々の記事ページに、サイト全体のフィードの URL を指定することはできませんでした。

<link title="HTML5.JP RSS Feed" href="http://www.html5.jp/index.rdf" type="application/rss+xml" rel="alternate" />

しかし、今回のアップデートで、該当のページと全く同じ内容のフィードでなければいけないという制約が無くなりました

iframe 要素の sandbox コンテンツ属性に allow-top-navigation キーワードが追加

すでに iframe 要素の sandbox コンテンツ属性には、いくつかのキーワードが規定されていましたが、今回のアップデートでは新たに allow-top-navigation キーワードが追加されました。

これまでの仕様では、iframe 要素に sandobx コンテンツ属性が指定されると、リンク・ターゲットは無効になりました。しかし、新たに追加された allow-top-navigation キーワードを指定すると、iframe 要素で組み込まれたコンテンツから、トップレベル・ブラウジング・コンテキストのナビゲートだけ許可されます。つまり、組み込まれたコンテンツ側で、例えば、a 要素の target コンテンツ属性に _top を指定したら、それが機能するようになります。

title 要素を入れなくても良い場合が規定

title 要素は、基本的には必須の要素です。しかし、シーンによっては必要がないと考えられる場合もあります。今回のアップデートでは、上位プロトコルでタイトルに相当する情報が与えられる場合に限り、title 要素を入れなくても良くなりました。メールで HTML が使われる場合などです(この場合は、Subject ヘッダーの値がタイトルに相当する情報になります)。とはいえ、通常のウェブページでは、今もなお、必須ですので、注意してください。

まとめ

今回の HTML5 仕様の草案のアップデートは、新たな機能が追加されたというよりは、現状の HTML の利用実態により近づけ、使いやすくしたという印象を受けました。ただ、WHATWG の仕様では、さらなる進化が見受けられます。たとえば、最近、track 要素が新たに追加されました。これは、ビデオに字幕を与える要素です。また、JavaScript から字幕データを扱うための API も規定されています。

しかし、残念ながら、この要素は W3C HTML5 仕様には含められませんでした。個人的には、track 要素を W3C HTML5 仕様に含めて欲しいと願っていましたが、際限なく、新たに機能を追加し続けると、いつまで経っても勧告にできないという問題もありますから、悩ましいところでしょう。

この投稿は 2010年6月27日 日曜日 1:16 PM に W3C カテゴリーに公開されました。 この投稿へのコメントは RSS 2.0 フィードで購読することができます。 現在コメント、トラックバックともに受け付けておりません。