datetime

time 要素 (HTML)

[4] HTMLtime 要素は、日時日付時刻を表します。

仕様書

分類

[95] time 要素は、

... です >>94

タグ

[97] 開始タグ終了タグも、省略できません >>94

属性

[98] 大域属性の他、 datetime 属性 (>>103) があります >>94

内容モデル

[96] time 要素内容は、字句内容です >>94。ただし制限があります (>>103)。

HTMLTimeElement インターフェイス (DOM)

[99] time 要素要素インターフェイスは、 HTMLTimeElement インターフェイスです >>94

[100] HTMLTimeElement インターフェイスは、 HTMLElement インターフェイス継承しています >>94

[101] dateTime IDL属性は、データ型 DOMString属性で、 datetime 内容属性反映しています >>94

[108] 普通の文字列としての反映になります。

レンダリング

[102] time 要素は、その内容と、 datetime 属性値機械可読形とを表現します。 >>94

マイクロデータ

[110] マイクロデータ特性値としては、 time 要素の場合日時値が用いられます。

[111] itemValue 属性は、取得時には日時値を返し、 設定時datetime 内容属性反映します。

日時値

[103] 日時値 (datetime value) は、 datetime 内容属性があればその属性値、なければ子テキストの連結です。 >>94

[104] datetime 内容属性がないときは、子孫要素があってはなりません >>94

[105] datetime 内容属性の値は、要素内容を機械可読な形で表したものでなければなりません >>94

[106] 日時値は、次のいずれかでなければなりません >>94

  1. |
    1. 妥当な月文字列
    2. 妥当な日付文字列
    3. 妥当な月日文字列
    4. 妥当な時刻文字列
    5. 妥当な地方日時文字列
    6. 妥当な時差文字列
    7. 妥当な大域日時文字列
    8. 妥当な月文字列
    9. HTMLの年
    10. 妥当な時間文字列

[107] 要素の内容の機械可読な等価値 (machine-readable equivalent of the element's contents) とは、 >>106 に対応する構文解析方法によって解釈した結果の値です。いずれによっても解釈できなければ、 そのような値はありません。 >>94 >>106 の各構文は互いに完全に区別可能となっているので、 いずれであるかは曖昧無く決まります。

歴史

前史

[1] 日時HTML で記述する手法は古くから要求があり、要素を新たに追加するもの、 既存の要素を流用するものなど、様々な提案がありました。

[118] HTML要素概説
要素名
date
日付
説明
付の Tim Berners‑LeeWebページdate 要素の構想がある。 文書の作成、編集、失効の日時を表す。
出典
[37] HTML要素概説
要素名
date
要素名
time
日付
説明
HTML 2.x に、 date, time がある。日付時刻を表す。
出典

新しい要素の提案

[2] Aural Cascading Style Sheets (ACSS) http://www.w3.org/TR/WD-acss-970630#speech-properties

This ('speak-date' property) would be most useful when combined with a new HTML tag used to identify dates, such as this theoretical example:

   <p>The campaign started on <date value="1874-oct-21">
   the twenty-first of that month</date> and finished 
   <date value="1874-oct-28">a week later</date>

[16] W3C I18N FAQ: Date formats ( 版) http://www.w3.org/International/questions/qa-date-format#bytheway

Some have advocated the creation of a <date> tag that would display dates according the locale of the user agent. This is subject to the same practical issues as described for dynamic date generation with the Japanese example. The appropriate format is generally a function of the linguistic context of a page, rather than the user's platform.

既存要素の流用

[63] マイクロフォーマット界隈では、 abbr 要素日時の表記に流用する 「デザイン・パターン」を発明しました。 (詳しくは abbr の項を参照してください。)

[62] Tantek's Thoughts (Tantek Çelik 著, 版) http://tantek.com/log/2005/01.html#d26t0100

My first instinct was to try the <object> tag, since it has a nice mechanism for providing data within its 'data' attribute, and fallback plain text inside the element itself, e.g. (simplified for sake of discussion):

<object data="20050125">January 25</object>
This worked great in typical modern browsers, except for one: Safari (v1.2.1). Unfortunately, to put it mildly, Safari's <object> support sucks. It doesn't handle <object> fallbacks, it doesn't know when not to handle <object> mime types that it doesn't support, it doesn't support display:inline on <object>, and it doesn't do proper intrinsic sizing of <object> replaced elements. These are all trivial to reproduce bugs.

Humans don't think of dates and times in terms of fully qualified year, month, date, hour, minute, second, time-zone values. Humans think of dates and times in terms of only that which is necessary. The day, or the day and the month, or perhaps just the hour. What do all these have in common? They are all abbreviations for a fully qualified date and time.

Lucky for us, XHTML has an element for abbreviations: <abbr>.

Thus, the ISO8601 date 20050125 should be marked up as:

<abbr title="20050125">January 25th</abbr>

[39] HTML要素概説
要素名
abbr
日付
説明
Tantek Çelik は、 かねてから議論されていた日時の記述について、 abbr を用いる手法を考案した。 HTML5time が追加されるまで microformatsデザインパターンの1つとして活用された。
出典
注釈
  • microformats HTML を利用したデータ記述の方式を定めた一連の仕様群と、 その方法論やコミュニティーの総称。 平成時代中期頃、 HTML の開発が凍結されて新機能追加は期待できず、 Semantic WebHTML と切り離されてWebサイトでの利用に難があるという状況で、 既存のHTML要素class 属性を活用したより高度な情報の記述手法が Tantek Çelik らにより模索された。 Web標準に関心がある人々や同時期に勃興しつつあったブログシステムなどでしばしば使われた。 方法論は HTML5 の開発に、技術面はマイクロデータに大きな影響を与えた。

[64] しかしこれに対しては「abbr略語を表すが、日時略語ではない」 などの批判があり、マイクロフォーマット界隈を越えて普及するには至りませんでした。

HTML5

[40] Web Forms 2.0, , https://whatwg.org/specs/web-forms/2004-12-10-call-for-comments/

 * add something like <date>, <time>, and <number> so that dates, times,
   and numbers can be auto-formatted.
[41] 将来構想の注釈。
[216] HTML要素概説
要素名
date
要素名
time
要素名
number
日付
説明
Web Forms 2.0 の文書ソース注釈に、 将来構想として date, time, number がある。 >>58 整形表示に用いる想定だった。
出典
注釈
[42] HTML要素概説
要素名
date
要素名
time
日付
説明
Web Applications 1.0 に、 date, time の構想が示されていた。
出典
[43] HTML要素概説
要素名
date
要素名
time
要素名
t
日付
説明
時点の Web Applications 1.0 文書ソース注釈内の作業予定に、 t がある。 >>59
出典
Web Applications 1.0
注釈

t 要素

[3] Ian Hickson は、日時を表す要素の追加の要求が古くから強いことを踏まえ、 t 要素HTML5 仕様案に追加しました。

[45] <t> element, draft the first., Hixie, , https://github.com/whatwg/html/commit/6bdcd9dc9da3f21cb61f0f8c123ed2d252cd2583

[44] HTML要素概説
要素名
t
日付
説明
HTML5t を定義した。
出典

[5] 現地時間が記述されていても、 tooltip で利用者の地方時が表示されるようなブラウザにwktk (名無しさん 2006-09-25 23:41:07 +00:00)

[6] [whatwg] Joe Clark's Criticisms of the WHATWG and HTML 5 http://listserver.dreamhost.com/pipermail/whatwg-whatwg.org/2006-October/007513.html (名無しさん 2006-10-31 00:54:15 +00:00)

[7] >>6 [whatwg] Joe Clark's Criticisms of the WHATWG and HTML 5 ( 版、 Ian Hickson 著) http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2006-October/007513.html

<t> (or an equivalent) has been widely requested, especially in the microformats and CSS communities. Several microformats have need for encoding specific times and/or dates, and are currently (ab?)using <abbr> for this purpose. The CSS community has requested a <date> or <time> element because they want to restyle dates and times according to locale. The blogging and content publishing communities have also raised the need for a way to unambiguously mark up what part of their document is a date and/or time, though in their case (as with microformats) they need a way to then mark each date/time element as being a particular semantic (publishing date, birth date, calendar event time etc).

Also, the aforementioned research indicated that there are substantial amounts of content on the Web that uses invented elements, IDs, and class attributes to mark up dates and times. For example, I found about the same number of pages with the obscure ID "updatedtime" as I did pages with a <button> element; "date" was the 14th most frequently seen class name.

time 要素 (第1世代)

[8]t」は短すぎるということで、後に time に改められました。

[47] 同時に旧 xt に改称されました。 <x>
[48] HTML要素概説
要素名
t
要素名
time
日付
説明
HTML5ttime に改称された。
出典

[17] Sam Ruby: The <time> element ( 版) http://www.intertwingly.net/blog/2007/04/17/The-time-element (名無しさん 2007-04-18 23:39:35 +00:00)

[76] [whatwg] <time> element feedback ( ( 版)) http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2010-December/029363.html

[67] [whatwg] proposal: extend <time> to markup durations ( ( 版)) http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2011-July/032456.html

time 要素 (第2世代)

[90] 2011年10月に time 要素は削除され、かわりに data 要素が導入されました。11月に新たに time 要素が追加されました。 (data 要素も残っています。)

[91] 第1世代の time 要素Webブラウザーに相応のレンダリングを求めるものでしたが、 実際には著者は独自のレンダリングを望んでおり、Webブラウザーも独自のレンダリングを実装する意思がないことから、 同名の新しい要素を改めて定義しなおしたものだと説明されています。

[92] しかしこの変更への反発から W3C HTML WG を中心に大きな混乱が生じ、 それまで WHATWGHTML5 の複製だった W3CHTML5 に独自の変更が加えられ、それをきっかけに両者が同期されなくなりました。 W3CHTML5 はこの騒動の後しばらく放置されていましたが、最終的には W3C が独自の編集者を雇用し、 WHATWG と決別して独自の仕様書を発行するようになります。

[93] 最終的には W3CWHATWG 側の time 要素の定義に揃えたようです。 ただし独自の編集を加えているようです。
[55] 厳密に言えばこれ以前も W3C HTML WG の決議に従って W3C 版は WHATWG HTML Standard の一部を削除するなどの違いがあったのですが、 Ian Hickson が編集している WHATWG HTML5 のソースファイルから W3C HTML5 を生成していました。これ以後も協調体制の維持のための調整は続いていて、 ただちに両 WG の関係が決裂に至ったわけではありません。 しかし大勢として言えば、このときまでなんだかんだ同調されてきた両 WG の仕様書が、この変更をきっかけにまったく別々に編集される体制へと変化したといえます。
[56] ただ分裂したとはいっても W3C HTML WG には独自に仕様書を編集し続ける実力がありませんでした。 そこで活発に編集され、主要 Webブラウザー事業者が参照していて、 Webブラウザーの実情をよく反映している WHATWG 版仕様書の変更を W3C 側が手動で取り込むという形になっていき、両者が決定的に異なる状態にはなりませんでした。 HTML 5.0

[51] 13240 – Consider replacing <time> with <data>, , https://www.w3.org/Bugs/Public/show_bug.cgi?id=13240

[70] IRC logs: freenode / #whatwg / 20111102 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20111102

[71] IRC logs: freenode / #whatwg / 20111102 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20111102

[72] HTML5 spec reverted to cvs r1.5431, svn r6782 [was: Revert request for r6783] ( (Michael[tm] Smith 著, 版)) http://lists.w3.org/Archives/Public/public-html/2011Nov/0098.html

[73] IRC logs: freenode / #whatwg / 20111110 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20111110

[74] IRC logs: freenode / #whatwg / 20111111 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20111111

[75] Ian Hickson responds over HTML5 getting 'time' element back | News | .net magazine ( 版) http://www.netmagazine.com/news/ian-hickson-responds-over-html5-getting-time-element-back-111552

[77] Time element - WHATWG Wiki ( ( 版)) http://wiki.whatwg.org/wiki/Time_element

[79] Web Applications 1.0 r6829 extend timezone format to also allow omitting the colon ( ( 版)) http://html5.org/tools/web-apps-tracker?from=6828&to=6829

[80] (3) Google ( ( 版)) https://plus.google.com/107429617152575897589/posts/3ZEQAVkF6xd

[81] IRC logs: freenode / #whatwg / 20111116 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20111116

[82] IRC logs: freenode / #whatwg / 20111118 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20111118

[83] IRC logs: freenode / #whatwg / 20111129 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20111129

[84] IRC logs: freenode / #whatwg / 20111206 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20111206#l-1112

[85] [whatwg] proposal: extend <time> to markup durations ( 版) http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2011-December/034091.html

[86] Web Applications 1.0 r6845 Update the date-and-time microsyntaxes to support having the 'T' replaced by a single space. (Note: multiple spaces are invalid and will cause parse failures. Only a single space is supported.) Based on proposal and implementation evidence from Tantek documented at http://wiki.whatwg.org/wiki/Time_element#permit_space_instead_of_T_in_datetimesAffected topics: HTML, Microdata ( ( 版)) http://html5.org/tools/web-apps-tracker?from=6844&to=6845

[87] [whatwg] proposal: extend <time> to markup durations ( ( 版)) http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2011-December/034091.html

[54] HTML要素概説
要素名
time
要素名
data
日付
説明
HTML Standardtime は削除され、 data が追加された。 >>57 現行仕様である。
出典
注釈
[52] HTML要素概説
要素名
time
日付
説明
HTML Standardtime が追加された。 現行仕様である。 旧 time とは違いも多い。
出典

[88] Web Applications 1.0 r7435 Make the year-only format for <time> more in line with how it works elsewhere. ( ( 版)) http://html5.org/tools/web-apps-tracker?from=7434&to=7435

実装

[61] time 要素利用者時間帯ロケールの文字列としてレンダリングするスクリプト。 「○分前」みたいな表示もできます。 http://suika.fam.cx/www/style/ui/time.js.u8

関連

[109] sortable整列には、 time 要素日時値が使われることがあります。

[65] time 要素以前にも HTML には ins 要素del 要素datetime 属性があり、編集の日時を表記するためにはこれが用いられていました。 CSS によって datetime 属性レンダリングさせている人もいました。

[9] time 要素文書中の日時マーク付けするものですが、 フォームにおいて利用者日時を入力させるものとしては <input type=datetime><input type=datetime-local><input type=date><input type=time> があります。

[10] 文書作成日時変更日時Dublin Core を用いて meta 要素に記述する人達もいました。

[89] HTML+RDFa 1.1time 要素の独自の解釈を規定しています。 (RDFa処理器の項を参照。)

[112] data 要素は、time 要素を一般化して日時以外にも拡張したものです。 data 要素日時の表記に利用できます。

[113] 例えば HTML Standard には、 Unix timevalue 属性に指定した data 要素の例が掲載されています。

[11] HTML5TimeZone - Internationalization ( 版) https://www.w3.org/International/wiki/HTML5TimeZone

[12] Fix #426, time element content model contradiction · whatwg/html@a14ca08 ( 版) https://github.com/whatwg/html/commit/a14ca08fae3b2d2feec88544dd24b2b3db21ae16

[13] 【皇室ウイークリー】(番外編)佳子さまお誕生日〈45枚のお写真で振り返るこの1年〉(1/6ページ) - 産経ニュース (SANKEI DIGITAL INC. 著, 版) http://www.sankei.com/premium/news/151229/prm1512290006-n1.html

<time><!-- date --><span id="__r_publish_date__">2015.12.29 06:00</span><!-- date end --></time><span class="speech">更新</span>

[14] 社労士:書き込み「社員うつにさせる方法」会員権停止に - 毎日新聞 ( 版) http://mainichi.jp/articles/20151230/k00/00m/040/090000c

<p class="post">毎日新聞<time>2015年12月30日 07時45分</time><time>(最終更新 12月30日 07時45分)</time></p>

[15] 年賀状のサルを12年前と比べてみたら...デザイナーは同じ人、ヒツジでも話題に ( 版) http://www.huffingtonpost.jp/2015/12/30/new-years-card-monkey-2004-and-2016_n_8893298.html

<time datetime="2015-12-31">2015年12月31日</time>

[18] 年賀状のサルを12年前と比べてみたら...デザイナーは同じ人、ヒツジでも話題に ( 版) http://www.huffingtonpost.jp/2015/12/30/new-years-card-monkey-2004-and-2016_n_8893298.html

投稿日: <time datetime="2015-12-30T05:14:20-05:00">

2015年12月30日 19時14分 JST </time>

[19] 時事ドットコム:文化庁の京都移転有力に=「一部機能」軸に検討-政府 ( 版) http://www.jiji.com/jc/zc?k=201512/2015123000492&g=pol

との期待もあり、石破氏の手腕が問われている。 <span id="pub_time">(2015/12/30-17:59)</span><span style="visibility: hidden;"><time itemprop="datePublished" datetime="2015-12-30 17:59" pubdate="pubdate">2015/12/30-17:59</time></span></p></div>

[20] 今年も来年もアニメはMX! 今年もアニメ攻勢がすごいTOKYO MXの年末年始特番、そして2016年について聞いてみた!!|おたぽる ( 版) http://otapol.jp/2015/12/post-5150.html

<div class="entryDate smallFont" itemprop="datePublished" content="2015-12-28">2015.12.28</div>

[21] 二次創作について - カクヨムヘルプセンター ( 版) https://kakuyomu.jp/help/entry/fan_fiction_sources

<time pubdate datetime="2015-12-09T06:16:36Z" title="2015-12-09T06:16:36Z">

<span class="date-year">2015</span><span class="hyphen">-</span><span class="date-month">12</span><span class="hyphen">-</span><span class="date-day">09</span>

</time>

[22] Invert the content model for the <time> element · whatwg/html@d82d29d ( 版) https://github.com/whatwg/html/commit/d82d29ddfccaa2d1806dc9ed48fd3bbbc0181912

[23] Link to the correct "Text" from the time element · whatwg/html@7bae38d ( 版) https://github.com/whatwg/html/commit/7bae38d0405c6cd72d688b38922bff7e21d9e41a

[24] Point out extra requirements for time without datetime attribute · whatwg/html@e801902 ( 版) https://github.com/whatwg/html/commit/e801902ac23dcc2074f69c71be7561fb8ef026b1

[25] Fix #644: Only look at child Text nodes in <time> · whatwg/html@b437a80 ( 版) https://github.com/whatwg/html/commit/b437a803c2310d8fb2e05aef343ea24166afb9fd

[26] Refactor child Text nodes to a new concept · whatwg/html@0dd609f ( 版) https://github.com/whatwg/html/commit/0dd609fddc08dab337d24da874c787e51e851efc

[27] ( 版) https://www.fullspeed.co.jp/

<time>2016.04.25</time>

[28] 民泊のエアビーアンドビー、苦情サイト新設 - WSJ ( (NATHAN OLIVAREZ-GILES著, )) http://jp.wsj.com/articles/SB10513819889225894892604582103810164964978

<time class="timestamp">

2016 年 6 月 2 日 16:48 JST

</time>

[29] 動画:上坂すみれの文化部は夜歩くチャンネル(上坂すみれ/早瀬かな) - ニコニコチャンネル:エンタメ () http://ch.nicovideo.jp/bunkabu/video

<p class="time">

<time>

<var title='2016/07/01 13:00'>

2016-07-01 13:00

</var>

</time>

[30] KinKi Kids オフィシャルサイト / Johnny's Entertainment () http://je-kinkikids.com/

<p class="date">2016.07.13</p>

[31] 京町家・中古住宅をリノベーションにより上質な空間へとプロデュースする京都の不動産会社 株式会社 八清(ハチセ,Hachise) ( ()) http://www.hachise.jp/

<span class="day">2016/6/24</span>

[32] NewsPicks ( ()) https://newspicks.com/

<span class="published elapsed" data-datetime="2016-07-27T03:39:43+00:00"></span>

[33] 中村繪里子 きけないらじお | カルチャー情報サイト「yoppy」 () http://www.yoppy.tokyo/category/special/kikenairadio

<time datetime="">2016/11/04 17:30</time>

[34] 家電会議 - Gear S2の厳選レビュー・ユーザーの評判(記事37件) ( ()) https://kadenkaigi.com/product/300730585406898844

<time itemprop="datePublished" datetime="2016-07-05T12:19:30Z"></time>

<time class="timestamp">6ヶ月前</time>

[35] User:Matthew Raymond/date element - WHATWG Wiki ( ()) https://wiki.whatwg.org/wiki/User:Matthew_Raymond/date_element

[36] ムービー&ラジオ一覧 | アソビストア () https://asobistore.jp/special/List

<time>2020.01.28</time>&#xFF5E;<time></time></p>