HTML

The itemprop attribute is a label that tells machines what kind of information the element contains (e.g., name, author, price).

itemprop 属性

itemprop属性とは

Webページの要素に「この部分は○○という情報だよ」と名前を付けるためのマイクロデータ属性です。検索エンジンや音声アシスタントなどの機械がページ内容を正しく理解しやすくなります。

役割

itemscopeitemtypeで示した「ひとまとまりの情報(アイテム)」の中で、itempropは各要素の「項目名(プロパティ)」を指定する。

例:本(アイテム)の「title」「author」「price」など。

書き方の基本

HTML

<div itemscope itemtype="https://schema.org/Book">
	<span itemprop="name">吾輩は猫である</span>
	<span itemprop="author">夏目漱石</span>
	<meta itemprop="datePublished" content="1905-01-01">
</div>

itemscope itemtype で「Book」というタイプを宣言。

itemprop="name" などで各要素にラベルを付ける。

meta 要素を使えば表示せずに値だけ提供できる。

効果

リッチリザルト
検索結果に評価★や価格が表示されやすくなる。
アクセシビリティ向上
スクリーンリーダーや AI が文脈を理解しやすい。
データ再利用
他のサービスがページをクロールして情報を集めやすくなる。

よくある間違い

itemprop だけ書いて itemscope/itemtype を書かない
どのアイテムのプロパティか特定できず意味が薄れる。
プロパティ名を独自に作る
可能だが、なるべく schema.org など共通語彙を使うと効果大。

まとめ

itempropは「この要素は〇〇という属性ですよ」と機械に伝える名札。

itemscope/itemtype とセットで使い、検索や音声アシスタントに優しいページを作りましょう。