HOME
article タグは、それだけで文書の内容が完結するセクションを表します。例えばニュースの記事、ブログのエントリ、フォーラムでの投稿など独立した内容に対して使用します。
article
タグは、それだけでコンテンツが完結するひとつのセクションを表します。例えば、ニュースの記事、ブログのエントリ、フォーラムでの投稿など、独立した内容に対して使用します。article
タグの基本的な書き方は、以下のようになります。
<article>
<h1> コンテンツのタイトル </h1>
<p> ... </p>
</article>
HTML5 ではセクショニング・コンテンツ要素を用いて文書構造を組み立てます。セクショニング・コンテンツ要素とは nav
、article
、section
、aside
を指します。それらの要素で文書構造を組み立てると、以下のような形になります。
nav
タグは、ナビゲーションリンクを含むセクションです。例えば、グローバルナビゲーション、パンくずリスト、目次などで用いられます。article
タグは、それだけでコンテンツが完結するひとつのセクションを表します。例えば、ニュースの記事、ブログのエントリ、フォーラムでの投稿など独立した内容に対して使用します。section
タグは、汎用的なセクションとして用いられます。このセクションの中には、必ず見出しタグが必要になります。aside
タグは、本文とは独立した補足的な情報を含むセクションです。例えば、メインとなるコンテンツの補足、脚注、用語説明などです。広告もこのタグに含まれます。article
タグ内には、見出しタグ(h1
~h6
)を含めるべきです。見出しタグを含めることで、明確なコンテンツとして識別できるようになります。
<article>
<h1> コンテンツのタイトル </h1>
<p> ... </p>
</article>
article
タグ内に time
タグを含めることにより、コンテンツの発行日時を示すことができます。
<article>
<h1> コンテンツのタイトル </h1>
<p>
<time datetime="2021-06-24"> 2021/06/24 </time>
</p>
</article>
article
タグは、ページの中で複数回使っても問題ありません。
<article>
<h1> コンテンツのタイトル1 </h1>
</article>
<article>
<h1> コンテンツのタイトル2 </h1>
</article>
article
タグ内で、複数のテーマを扱う場合は、テーマ毎に section
タグで分割します。
<article>
<h1> コンテンツのタイトル </h1>
<section>
<h2> テーマ1 </h2>
</section>
<section>
<h2> テーマ2 </h2>
</section>
</article>