timeタグの意味と使い方!ISO 8601と公開日・更新日の実装

timeタグの意味と使い方!ISO 8601と公開日・更新日の実装

人と機械に伝わる日時表記の基本と重要ポイント

timeタグは本文中の日時を意味づけし、支援技術や検索エンジンに機械可読な情報を提供します。特にdatetime属性へISO 8601形式のdatetimeを指定すると、表示と解釈を分離でき、集計や表示最適化に役立ちます。

用語の定義(意味としくみ)

time要素は人間が読む日付・時刻テキストを囲み、datetime属性に機械可読な値(例:2025-08-17T09:00:00+09:00)を指定します。テキストはローカライズされた表記で構いませんが、属性はISO 8601に準拠させます。仕様上、pubdate属性は存在しないため、公開日や更新日の意味付けは文脈(ラベル)で示します。

実務での論点(使い分け・実装の注意)

記事・イベント・価格の有効期限など、日時が意味を左右する箇所でtimeを用います。内容は読みやすく、属性は厳密にという方針が基本です。特に公開日や更新日の明示はUXと検索評価の両面で有効です。

  • 属性はISO 8601で統一:YYYY-MM-DD、時間はTHH:MM:SS、タイムゾーンはZまたは±HH:MMを付けます。
  • 相対表現(「昨日」「先週」)は本文に可ですが、datetimeで絶対時刻を補います。
  • 期間は開始・終了それぞれを別の<time>で表し、「〜」などで連結します。
  • 公開日(Published)と更新日(Modified)はラベルで区別し、必要なら両方を記載します。
  • 構造化データ(JSON-LD)は別途実装し、本文のtimeは表示と意味づけに専念させます。

比較・使い分け表

比較・使い分けの目安
項目意味用途
time本文内の日時を意味づけ公開日・更新日・イベント日時の明示
span意味のない汎用インライン装飾のみ。日時の意味付けには不適
metaメタ情報(非表示)OGP等の補助。本文の表示には不適
JSON-LD構造化データ記述検索向けのdatePublished/dateModified
abbr略語の意味づけ日時ではなく略語の展開に使用

SEO上の注意

検索面では、本文のtimeで日時を明示しつつ、JSON-LDのArticle/BlogPosting等でdatePublisheddateModifiedをISO 8601で記述します。ページ内の表示と構造化データの値は一致させ、タイムゾーンのオフセットも統一します。誤差や未指定は誤解やリッチリザルト不整合の原因になります。

よくある質問(FAQ)

datetime属性は必須ですか?

必須ではありませんが推奨です。本文は「2025年8月17日」のように人向けに書き、datetime2025-08-17のような機械可読値を入れると解釈が安定します。

タイムゾーンはどう指定しますか?

UTCはZ、ローカルは+09:00のようにオフセットを付けます。時差のある読者や集計処理でのズレを防ぐため、サイト内で統一しましょう。

近縁要素との違い(spanやmeta、JSON-LD)は?

timeは本文の日時を示す要素、metaは非表示のメタ、JSON-LDは検索向けの構造化データです。表示はtime、検索連携はJSON-LD、と役割分担すると明確です。

期間(開始〜終了)はどう表現しますか?

開始と終了を別々の<time datetime="…">で表し、テキストで「〜」や「–」を挟みます。各datetimeはISO 8601で記述します。

timeタグのまとめ

timeタグは本文の可読性を保ちながら、厳密な日時情報を機械に伝えるための要素です。ISO 8601のdatetime、明確なラベル、統一したタイムゾーンを徹底し、検索向けのJSON-LDと併用すれば、ユーザー体験と検索の両面で安定した実装になります。

関連記事
SEOに関連する10種類のHTMLの書き方|SEO対策との関係性は?
SEOに関連する10種類のHTMLの書き方!SEO対策との関係性は?
SEO対策に取り組むとき、「HTMLは専門知識が必要で難しそう」と感じてしまう方も多いのではないでしょうか。 確かにHTMLはページの骨組みをつくる言語であり、タグの選び方や使い方を誤るとレイアウト崩れなどの不具合につな…