
こんにちは!静岡県浜松市でWEBデザイナーをしています小瀧です。
Webページに日付や時間を表示する場合、ただテキストとして書くだけでは、検索エンジンやスクリーンリーダーにとって「いつのことか」は正確に伝わりません。
特にSEOやアクセシビリティの観点から見ると、「機械に読み取れる形式で正確にマークアップされているか」はとても重要なポイントです。
そんなときに活躍するのが HTML5 で導入された <time> タグです。
このタグを使うことで、人間には読みやすく、機械には解析しやすい日付の記述ができるようになります。
今回は初心者にもわかりやすく、このタグの使い方や注意点、SEOとの関係について詳しく解説します。
<time> タグとは?
<time>タグは、HTML5で導入された日付や時刻の情報をマークアップするための要素です。これを使うことで、検索エンジンに「これは日付情報ですよ」と伝えることができます。
基本的な使い方は以下の通りです。
<time datetime="2025-05-16">2025年5月16日</time>
上記の例では、「2025年5月16日」という人間にとって分かりやすい日付表記に対して、datetime 属性でISO 8601形式(機械が読み取れる日付形式)を指定しています。
datetime属性の書き方
datetime 属性には、ISO 8601という国際標準の日時形式で日付を記述します。主な形式は以下の通りです。
- 2025-05-16:年月日
- 2025-05-16T14:30:日時(Tで区切る)
- 2025-05-16T14:30:00+09:00:日本時間を含む日時
表示上は日本語でも、datetime 属性内では英数字のISO形式にすることで、GoogleやSNS、音声読み上げなどが正しく理解しやすくなります。
具体例:ブログ記事の日付に使う
たとえばブログ記事の公開日に使う場合、以下のような記述が推奨されます。
<p>公開日:<time datetime="2025-05-16">2025年5月16日</time></p>
このようにすることで、見た目は普通の文章ですが、裏では機械に正確な情報が伝わる構造になっています。
<time>タグの活用場面
- ブログ記事の公開日・更新日
- イベント開催日・締切日時
- 製品のリリース日
- 証明書の有効期限
特にSEOの分野では、構造化データとの相性もよく、Googleがページ内容を正しく評価しやすくなります。
注意点:日付フォーマットと日本語
日付の表示を「2025/5/16」や「5月16日」などにしたい場合もあると思いますが、
datetime属性の中身は「2025-05-16」のように必ずISO形式にする必要があります。
表示と機械読み取りを分離できるのが<time>タグの強みでもあります。
まとめ
<time datetime=""> タグを使えば、日付や時刻を人にも機械にも優しくマークアップすることができます。とくにSEOやアクセシビリティにおいては、日付の明示がコンテンツの信頼性や検索精度に影響するため、正しい使い方をマスターしておきましょう。
WordPressなどCMSでも、テンプレートに取り入れておくとより一貫性のあるマークアップができます。










