TIME

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 で記述する手法は古くから要求があり、要素を新たに追加するもの、 既存の要素を流用するものなど、様々な提案がありました。

新しい要素の提案

[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>

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

HTML5

最初は date だった。

t 要素

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

[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 に改められました。

[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 に独自の変更が加えられ、それをきっかけに両者が同期されなくなりました (それまでは W3C が独自の変更を決議しても、 Ian Hickson が編集している WHATWG HTML5 のソースファイルから W3C HTML5 を生成していました)W3CHTML5 はこの騒動の後しばらく放置されていましたが、最終的には W3C が独自の編集者を雇用し、 WHATWG と決別して独自の仕様書を発行するようになります。

[93] 最終的には W3CWHATWG 側の time 要素の定義に揃えたようです。 ただし独自の編集を加えているようです。

[69] Web Applications 1.0 r6783 Drop <time> and replace it with <data>. Drop the Atom conversion section entirely. Convert a bunch of examples that used to use <time pubdate> to using schema.org, to show how to annotate publication dates and the like in a machine-processable way. ( ( 版)) http://html5.org/tools/web-apps-tracker?from=6782&to=6783

[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

[78] Web Applications 1.0 r6827 the <time> element is dead, long live the <time> element ( ( 版)) http://html5.org/tools/web-apps-tracker?from=6826&to=6827

[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

[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>