The content attribute is used in meta and Microdata to specify the actual value or information of an element as a string.
content属性 は、主に meta要素 と span要素 で使われ、その要素が持つ情報の内容を文字列で指定するための属性 です。
meta要素 は、Webページのメタデータ(ページの説明やキーワード、OGP情報など)を指定するために使います。
content属性 は、meta要素の持つ「情報の内容」を文字列で指定します。
例えば、ページの説明をmeta要素で書く場合は次のようにします。
HTML
<meta name="description" content="このページはHTMLのcontent属性について初心者向けに解説しています。">
この例では、name="description" が「ページ説明」という情報の種類を示し、content 属性がその説明文の中身を表しています。
ポイント
content 属性の中身は画面に表示されるわけではなく、検索エンジンやSNSなどに使われます。
情報の中身そのものを記述する場所が content 属性です。
span要素 で content属性 を使うのは、Microdata という構造化データを扱うときが多いです。
例えば、商品のレビューの評価を検索エンジンに伝えるときにこう使います。
HTML
<span itemprop="ratingValue" content="4.5">★★★★☆</span>
この例では、画面上には「★★★★☆」という星マークが表示されますが、content="4.5" のおかげで検索エンジンなど機械が読むときには「4.5」という数値が認識されます。
ポイント
表示内容(ユーザー向け)と、検索エンジンなど機械に伝える内容(content属性で指定)を分けられるのがメリットです。
Microdata や schema.org のマークアップをするときによく使います。