html 時間指定 表示

HTMLにおける時間指定表示

Webページに時間情報を正しく記述することは、アクセシビリティとSEOの観点から非常に重要です。HTMLでは、時間情報を明示的にマークアップするための要素として<time>要素が提供されています。この記事では、<time>要素の役割、属性、使用方法、そして具体的な適用例を通して、Webページにおける効果的な時間情報の表現方法を解説します。

<time> 要素の概要

<time>要素は、日付、時刻、またはその両方を表すために使用されます。人間が読める形式のテキストに加えて、機械可読な形式で時間情報を埋め込むことができます。これにより、ブラウザや検索エンジンは時間情報を正確に解釈し、カレンダーへの予定追加や検索結果の精度向上などに役立てることができます。

<time> 要素の属性

<time>要素には、時間情報をより詳細に記述するための属性が用意されています。
属性名 説明 値
datetime 機械可読な形式で日時を指定します。 YYYY-MM-DDThh:mm:ss[Z|(+|-)hh:mm]形式の文字列
pubdate 要素の親要素が
,
"pubdate"キーワード

datetime 属性

datetime属性は、時間情報を機械可読な形式で指定するために使用します。値は、ISO 8601の拡張形式で記述します。 


<time datetime="2023-10-26">2023年10月26日</time>
<time datetime="2023-10-26T17:00">2023年10月26日 17時</time>
<time datetime="2023-10-26T17:00+09:00">2023年10月26日 17時 (JST)</time>

pubdate 属性

pubdate属性は、要素の親要素が

,