Widely available すべての主要ブラウザで対応済み。安心して使用可能。

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
5
12
4
5
18
4.2
1+対応 (バージョン) 未対応 注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

基本構文

HTML
<article>
  <h2>Blog Post Title</h2>
  <p><time datetime="2024-01-15">January 15, 2024</time></p>
  <p>The body of the article goes here.</p>
</article>

ライブデモ

blogarticlecard

Article element in blogarticle structureization.date or kacategory with.

プレビュー全画面表示

ni-scardoverview

Multiple. Article element line upni-sOverview representationationation.

プレビュー全画面表示

comentsection

coment article element in m-kap.nestedpossiblestructure.

プレビュー全画面表示

実務での使いどころ

  • <article> の活用

    <article> は HTML の要素で、文書、ページ、アプリケーション、サイトなどの中で自己完結しており、(集合したものの中で)個別に配信や再利用を行うことを意図した構成物を表します。

注意点

  • 古いブラウザでは対応していない場合がある。

アクセシビリティ

  • スクリーンリーダーでの読み上げを確認すること。