Ext JS is now Sencha

HTML5の策定とともに進められている機能に「Microdata」がある。2009年末ごろにHTML5本体から分離し、今はHTML5関連技術として5 Microdata - HTML 5にそのドラフトが公開されている。MicrodataはHTMLコンテンツに特定のメタデータを追加するためのもの。類似の技術にはMicroformatsやRDFaなどがある。

Microdataは名前と値をひとつの組みとする。Microdataでは名前と値の組みをアイテムと読んでいる。5 Microdata - HTML 5に掲載されているサンプルによれば、次のように記述する。

<div itemscope>
 <p>My name is <span itemprop="name">Elizabeth</span>.</p>
</div>

itemscope属性でアイテムを指定。いわゆる入れ物を最初に指定している。この中に名前と値を組みを作っていく。名前を指定する属性はitemprop。前述したサンプルならnameの値として"Elizabeth"が指定されていることになる。name=Elizabethというわけだ。しかし表示そのものにはまったく影響せず、Microdata指定を追加する前も後も同じように「My name is Elizabeth.」と表示されるだけだ。メタデータのみを追加しているわけだ。Microdataは次のように入れ子でも指定できる。このサンプルも5 Microdata - HTML 5に掲載されている。

<div itemscope>
 <p>Name: <span itemprop="name">Amanda</span></p>
 <p>Band: <span itemprop="band" itemscope> <span itemprop="name">Jazz Band</span> (<span itemprop="size">12</span> players)</span></p>
</div>

The HTML5 Family: Microdata Overview - Sencha - BlogにこのMicrodataに関する簡単なまとめが掲載されている。まず、Microdataで実現されるシーンの例を次のように紹介。

• イベントデータをマークアップしておけば、ブラウザが自動的にビジタのカレンダに登録するといったことができる。
• 連絡先データをマークアップしておけば、ブラウザが自動的にビジタのアドレス帳に追加するといったことができる。
• レストランのレビューをマークアップしておけば、検索エンジンがその情報を活用してほかのユーザの検索に活かす、といったことができる。
• 履歴書をマークアップしておけば、LinkedInのような職業系ソーシャルネットワークを使うときにそのページを指定するだけで必要な情報がすべて入力される、といったことができる。
• レシピをマークアップしておけば、ショッピングリストアプリケーションはレシピから材料を探し出して週末に買うべきものをリストアップする、といったことができる。

temprop属性の対象となるデータは要素ごとに異なる。どの要素でどのデータが対象となるのか、その違いもわかりやすくまとめられている。紹介されている内容は次の通り。

• href属性、src属性、data属性に指定されているURLが値として扱われる要素: a、area、audio、embed、iframe、img、link、object、source、video
• datetime属性に指定されている時刻が値として扱われる要素: time
• content属性に指定した内容が値として扱われる要素: meta
• その他の要素では要素内のテキストが値として扱われる

The HTML5 Family: Microdata OverviewではMicrodataをJSON形式へ展開した場合のサンプルも紹介されており、プログラムによる処理が本質的に実施しやすいデータ形式であることを示唆している。

{
  "items": [
    {
      "properties": {
        "product": [
          "A Great Product"
        ],
        "rating": [
          "5/5"
        ],
        "review": [
          "This product is very nice. I especially love feature X and Y."
        ]
      }
    }
  ]
}

コンテンツにメタデータを追加する取り組みは新しいものではないが、登場した当初の期待ほどは普及していないというのが現実。しかし、WebアプリケーションやWebサービスへの依存度が高くなっていること、HTML5という次世代規格の一部として策定が進められていること、仕組みがシンプルで、かつ、強力であることなど、Microdataは興味深い立ち位置にある。WebデベロッパやWebデザイナは注目しておきたい技術。