Smart Communication Design Company
ホーム > ナレッジ > 用語集 > Web制作用語集 > HTML用語集 > article要素

article要素

article要素はHTML5から新たに追加された要素です。

article要素でマークアップされたコンテンツはブログサイトの1つの記事など、それ自体で完結するセクションであることを示すことができます。

article要素の中にarticle要素が登場する場合、その内容は原則、祖先として存在するarticle要素の内容に関連していることが前提です。

例えば、次に示す使用例のようにarticleタグでマークアップされたブログ記事の子孫として登場するarticle要素は、ユーザーの投稿コメントが記述されています。このようなマークアップを行うことで、そのコメントが直近の祖先要素として存在するarticle要素(記事)に対してのコメントであることを示すことができます。

article要素は、少なくとも子要素に1つ以上のh1などのヘディングコンテンツを含むべきです。また、article要素の子孫として存在していないaddress要素から著者情報を影響されることはありません。そのarticle要素の著者情報を示すためには、article要素の子孫としてaddress要素を記述する必要があります。

article要素の子要素として存在するfooter要素内にtime要素とそのdatatime属性を用いることによって、article要素の発行日時を示すことができます。

使用例

<article class="entry">
<header>
<h2>記事タイトル</h2>
<p><time datetime="2016-10-20">16/10/20</time></p>
</header>

<p>記事本文</p>

<section class="comment">
<h2>コメント</h2>

<article class="message">
<header>
<h3>件名</h3>
<span>投稿者名</span>
<span><time datetime="2016-10-20">16/10/20</time></span>
</header>

<p>コメント本文</p>
<!-- /.message --></article>

<article class="message">
<header>
<h3>件名</h3>
<span>投稿者名</span>
<span><time datetime="2016-10-21">16/10/21</time></span>
</header>

<p>コメント本文</p>
<!-- /.message --></article>
<!-- /.comment --></section>
<!-- /.entry --></article>

使用可能な属性

コンテンツカテゴリ

子要素にしていい要素の種類

親要素にしていい要素の種類

仕様書と策定状況

仕様書 策定状況
W3C 勧告
WHATWG Living Standard
最終更新:2016年9月2日