HTML5 とメタデータ

今回は覚え書きのみでお送ります。イマイチ理解してない気がするので，おかしいところは遠慮なくツッコんで下さい。

Atom feed と ccREL

Atom feed は XML なので ccREL を使って著作権情報を入れることは可能。

Atom - CC Wiki

まず ccREL の名前空間を追加する。

<feed xmlns="http://www.w3.org/2005/Atom" xmlns:cc="http://web.resource.org/cc/">

これで <feed> 要素，またはその子要素の <entry> 要素内に cc:license, cc:morePermissions 等の記述を追加すればいいだけ。

<link rel="cc:license" type="application/rdf+xml" href="http://creativecommons.org/licenses/by/4.0/rdf" />
<link rel="cc:morePermissions" type="text/html" href="/cc-license.shtml#morePermissions" />

この例では cc-license の Commos Deed ではなく RDF/XML に直接リンクしている。これでいいらしい。タイトル，著者，日付情報については Atom の property でまかなえる。

cc:license, cc:morePermissions, cc:useGuidelines といった property については拙文の ccREL の節を参照のこと。

head 要素内の標準的なメタ情報

HTML5 の <head> 要素内には <meta> 要素や <link> 要素などでメタデータを記述できる。値がリテラルの場合は <meta> 要素を， URL 等のリソースの場合には <link> 要素を使う。

<link> は void 要素で有効な属性は（グローバル属性以外では）以下のとおり。

href
crossorigin
rel (MUST)
media
hreflang
type
sizes (for rel="icon" property)
title

メタデータは rel-href のセットで記述される。 rel 属性にセットする標準のタイプは以下のとおり。

author
help
icon
license
next
prefetch
prev
search
stylesheet

icon と prefetch 以外は href 要素にハイパーリンクを指定する。 bookmark, nofollow, noreferrer, tag は <link> 要素では使用できない。

（tag は <a> 要素等では使えるとあり，確かに HTML5 validator では問題ないが RDFa Validator ではガッツリ怒られる（nofollow は怒られないのに）。この場合は xhv: 接頭辞をつけるとよい。でもこれで parser が正しく認識してくれるかは不明）

<meta> は void 要素で， <title>, <base>, <link>, <style>, <script> 要素で表現できない情報を記述する。有効な属性は（グローバル属性以外では）以下のとおり。

charset
content
http-equiv
name

ひとつの要素内では name, http-equiv, charset 属性のうちひとつのみを記述する（グローバル属性を含め property 名を指示する属性は要素内にひとつしか記述できないようだ）。

（http-equiv 属性の content-type は charset 属性で代替できるため HTML5 では不要。また content-language もグローバル属性の lang で代替できるため，同様に不要）

name-content のセットでメタデータを記述する際の標準メタデータ名は以下のとおり（なのでこれらのメタデータを <head> 要素で指示する場合はなるべく標準の名前を使うべき？）。

author
description
generator
keywords

参考：

Microdata の基本知識

Microdata で利用可能な属性は以下のとおり。

itemscope
itemtype
itemid
itemprop
itemref

これらはグローバル属性として扱われる。基本的には itemscope 属性を指定した要素で囲まれた部分で itemprop 属性を使ってメタデータを記述していく。

<div itemscope itemtype="http://schema.org/Person">
  私の名前は <span itemprop="name">Spiegel</span> です。
</div>

itemscope 属性の範囲を item と呼ぶ。 item のタイプを itemtype 属性で記述し， item の内容を itemprop 属性で記述する。

item は入れ子にすることで構造化が可能。

<article itemscope itemtype="http://schema.org/Article">
  [...]
  <div itemprop="author" itemscope itemtype="http://schema.org/Person">
    Written by <span itemprop="name">Spiegel</span>.
  </div>
<article>

~~更に item 同士は id 属性（グローバル属性）と itemref 属性を使って連結できる。これによりメタデータを構造化できる？かも？~~ itemref 属性は id 属性（グローバル属性）で指定した先の情報を include する。

<div itemscope itemtype="http://schema.org/Person" itemref="link">
  私の名前は <span itemprop="name">Spiegel</span> です。
</div>
[...]
<div id="link">
  続きは <a href="/profile/" itemprop="url">Web</a> で。
</div>

この例では， itemprop="url" で指定した情報が元の item に組み込まれる。 itemref 属性には複数の ID を指定できるらしい？

id-itemref 連携はページ内でしかできない（URI ではないため）。外部のリソースを指示するには itemid を使う（らしいのだが使い方がいまいち分からない。 URN を使った例示はあるが，一般的な URI が使えるのかどうか明示されてない）。

また Microdata の属性はグローバルなので <link> 要素や <meta> 要素でも使える。この場合 <link> 要素や <meta> 要素は <body> 要素内でも使用可能となり，しかも flow content かつ phrasing content として機能するらしい（あまり smart じゃない気がするなぁ）？

Microdata の Validator のようなものはない模様。その代わり Google が Google Structured Data Testing Tool というサービスを行っていて，これである程度は分かるかもしれない。

参考：