なぜ今さら `
現場でコードレビューをしていると、日付の表示に `` やただのテキストをポンと置いているケースに未だによく出くわします。「動けばいい」というスタンスならそれでもいい。しかし、Webを「ドキュメントの集まり」から「検索エンジンやAIが理解できる構造化データ」へと昇華させたいなら、`
今日は、中級エンジニアが意外と曖昧にしがちな `
なぜ `` タグが必要なのか
結論から言えば、「人間が見る表現」と「機械が読むデータ」を分離するためです。
例えば、Webサイトの更新日を表示する際、「2024年10月24日」と書けば人間は理解できます。しかし、Googleのクローラーや、ブラウザの拡張機能、あるいはアクセシビリティツールにとって、その文字列が「いつ」を指しているのかを確定させるのは、自然言語処理のコストがかかります。
ここで `
datetime属性の「ISO 8601」完全攻略
`datetime` 属性には、基本的に ISO 8601 という国際標準規格のフォーマットで記述します。これが守られていないと、機械可読性はゼロになります。
実務でよく使うパターンを3つ覚えておいてください。
1. 日付のみ: `YYYY-MM-DD`
2. 日時まで: `YYYY-MM-DDThh:mm:ss`
3. タイムゾーン付き: `YYYY-MM-DDThh:mm:ss+09:00`
特に、日本時間を扱うなら `+09:00` の記述は必須です。これを忘れると、サーバーサイドのUTC時刻と混同されるリスクがあります。
実践的なサンプルコード
以下に、ブログの記事詳細ページなどを想定した「コピペで使える」ベストプラクティスな実装例を示します。
公開日:
最終更新:
キャンペーン期間:
から
まで
ブラウザやAIはどう処理しているのか？
ここがエンジニアとして面白いポイントですが、主要なモダンブラウザは、`
しかし、Google検索のインデックスプロセスにおいては別です。Googleは `datetime` 属性の値を見て、検索結果のカルーセルやスニペットに表示する日付を決定します。つまり、このタグを正しく書くことは、コンテンツの「鮮度」を検索エンジンに直接伝えるためのダイレクトなSEO施策になるのです。
また、最近ではブラウザの「リーダーモード」の実装において、`
シニアからのアドバイス：現場での「妥協点」を見極める
最後に、実務で迷うポイントを一つ。「フォーマットが複雑な場合、どこまで `datetime` に書くべきか？」という悩みです。
私の経験則ですが、「機械がその時刻を確定できる最小単位」まで記述すれば十分です。例えば、秒単位まで不明な記事なら、無理に `00:00:00` と書く必要はありません。
また、CMSでテンプレートを組む際は、PHPやJavaScript側で `date(‘c’)` (ISO 8601形式で出力する関数) を使うのが鉄則です。手動で `datetime` を打つのはヒューマンエラーの温床ですから、必ず動的なレンダリングに組み込んでください。
`
次のプルリクから、ぜひ `
コメント