HTML Living Standard/data
DATA要素
編集<data>
要素は、マシンリーダブルなデータを人間が読めるテキストに関連付けるために使用されます。通常、value
属性を利用して、データの意味や値をマークアップします。
定義
編集<data>
要素は、コンテンツに関連するマシンリーダブルなデータを埋め込むために使用されます。- このデータは、プログラムやスクリプトによる処理を可能にします。
使用方法
編集以下は、<data>
要素の基本的な使用例です。
<p>現在の気温: <data value="25">25度</data></p>
この例では、value
属性にマシンリーダブルな値が指定され、人間が読める形式の「25度」と関連付けられています。
属性
編集<data>
要素は次の属性をサポートします:
value
編集- この属性には、マシンリーダブルなデータを指定します。
- 指定された値はスクリプトやアプリケーションで使用されます。
<data value="12345">商品番号: 12345</data>
使用例
編集商品データの記述
編集以下の例では、商品に関するマシンリーダブルなデータを提供しています。
<p>商品の価格: <data value="980">980円</data></p>
この場合、980円
という人間向けの情報に対して、value="980"
としてデータが提供されています。
機械学習用データ
編集機械学習モデルにデータを提供するための例です。
<p>レビュー評価: <data value="4.5">4.5/5</data></p>
この例では、value
属性に評価スコアが格納され、モデルやスクリプトによって利用可能です。
注意事項
編集<data>
要素は、マシンリーダブルなデータが必要な場面で有用です。ただし、代替としてカスタムデータ属性(data-*
属性)が使用される場合もあります。<data>
要素を使用する際は、必ずvalue
属性を設定してください。設定しない場合、マシンリーダブルなデータとしての機能を果たしません。
利点
編集<data>
要素は、検索エンジンやデータ解析ツールにとって有益です。- 人間にとって可読性を損なわずにデータを埋め込むことができます。
スタイリング
編集<data>
要素はインライン要素として扱われます。CSSでスタイルを適用できます。
data { font-weight: bold; color: #007bff; }
使用上のヒント
編集- 機械処理やデータの意味づけが必要な場面で積極的に使用してください。
data-*
属性とは異なり、<data>
要素は表示されるコンテンツとマシンリーダブルなデータの明確な対応関係を提供します。
関連項目
編集- HTML Living Standard/マシンリーダブルデータ
- HTML Living Standard/カスタムデータ属性 (data-*)
- HTML Living Standard/メタデータ要素