<time> - 正確な日付と時刻

timeは、正確な日時、時刻をマークアップするためのタグです。マークアップする対象となる、日時、または時刻を表すテキストは、決められたフォーマットに沿っている必要があります。対象のテキストがフォーマットに沿わない場合は、別途、datetime属性で指定することができます。pubdate属性は廃止されているのでご注意下さい。

説明

datetime
RFC 3339の規格に従って指定する。以下は、「2015/12/07 15:50:07」を例にする。日付の場合は2015-12-07、年だけの場合は2015、月までの場合は2015-12、週の場合は2015-50、時刻まで入れる場合は2015-12-07T15:50:07+09:00
pubdate
pubdate属性は、2011年11月に廃止されました。指定すると文法違反になります。

下記は、2015年12月日に旅行に行った日記を、マークアップした例です。ブラウザ、検索エンジンに対して、マークアップした部分が日時、時刻を表していることを伝えられます。

HTML

<p><time>2015-12-06</time>に、私は山口県の錦帯橋に行ってきた。</p>

2015-12-06に、私は山口県の錦帯橋に行ってきた。

datetime属性の使い方

time要素においてマークアップ対象の日時、時刻は、YYYY-MM-DDのように決められたフォーマットに従っていなければなりません。例えば、下記のような日時、時刻はフォーマットに沿わないため、マークアップできません。

HTML

<p><time>12月6日</time>に、私は山口県の錦帯橋に行ってきた。</p>
<p><time>昨日の15時</time>に、私は山口県の錦帯橋に行ってきた。</p>

そんな時に有用なのがdatetime属性です。この属性の値にフォーマット通りの日時、時刻を指定することで、タグで囲んだ部分がフォーマットに沿っていなくても大丈夫になります。

HTML

<p><time datetime="2015-12-06">12月6日</time>に、私は山口県の錦帯橋に行ってきた。</p>
<p><time datetime="2015-12-06T15:50:07+09:00">昨日の15時</time>に、私は山口県の錦帯橋に行ってきた。</p>

pubdate属性は廃止されている

time属性にはpubdate属性が存在しましたが、この属性は、2011年11月に廃止されました。一部のサイトや書籍では、time要素でこの属性が使えると掲載されていますが、実際は指定すると文法違反になるのでご注意下さい。親のarticle要素、またはドキュメント全体の投稿日時であることを示す論理属性でした。

概要

カテゴリー
  • Flow content (フロー・コンテンツ)
  • Phrasing content (フレージング・コンテンツ)
  • Palpable content (パルパブル・コンテンツ)
コンテンツモデル
フレージングコンテンツ
利用できる場所
フレージングコンテンツが期待される場所で使用できます。time要素の中にtime要素を含めてはいけません。
利用できる属性
グローバル属性
許可されている、全てのグローバル属性を指定できます。
datetime
RFC 3339の規格に従って指定する。以下は、「2015/12/07 15:50:07」を例にする。日付の場合は2015-12-07、年だけの場合は2015、月までの場合は2015-12、週の場合は2015-50、時刻まで入れる場合は2015-12-07T15:50:07+09:00
pubdate
pubdate属性は、2011年11月に廃止されました。指定すると文法違反になります。
タグの省略
timeタグは、開始タグ、終了タグ、共に省略することはできません。

参考情報

time要素に関する情報は、下記サイトで確認できます。

  • W3C … W3CによるHTML5勧告。timeの項目。
  • HTML language reference … W3Cによるtimeのリファレンス。
  • Time-datetime … W3C。datetime属性に指定できる日時、時刻のフォーマットについての説明。
  • Drop the pubdate attribute … W3C。pubdate属性の廃止について。
  • WHATWG … WHATWGによる仕様書、HTML Living Standard。time要素の仕様。