HTMLのarticleタグとsectionタグ【現役エンジニアが解説】
今回は、HTMLのarticleタグとsectionタグについて、それぞれに分け、簡単に解説していきます。
articleタグは記事
articleタグは記事を一つにまとめます。
記事とは、要するにコンテンツのことで、論文等も含まれます。
<article>記事や論文の中身を書く</article>
上記のコードのように、articleタグの中に記事や論文を書いていきます。
sectionタグは章分け
sectionタグは記事の中のそれぞれの章をまとめます。
例えば、序論と本論、結論がある場合には、sectionタグは3つ使います。
<article>
<section>序論</section>
<section>本論</section>
<section>結論</section>
</article>
上記のコードでは、序論と本論、結論の章をそれぞれsectionタグでまとめています。
h2タグは章の見出し、h3タグは節の見出し
h2タグは章の見出しに、h3タグは節の見出しに使います。
sectionタグと一緒に使う場合には、sectionタグ内の冒頭で使うことが多いです。
<article>
<section>
<h2>1.序論</h2>
<h3>1.1.序論A</h3>
<h3>1.2.序論B</h3>
<h3>1.3.序論C</h3>
</section>
<section>
<h2>2.本論</h2>
<h3>2.1.本論A</h3>
<h3>2.2.本論B</h3>
<h3>2.3.本論C</h3>
</section>
<section>
<h2>3.結論</h2>
<h3>3.1.結論A</h3>
<h3>3.2.結論B</h3>
<h3>3.3.結論C</h3>
</section>
</article>
上記のコードでは、序論と本論、結論の章を、それぞれsectionタグでまとめたうえで、h2やh3で見出しを付けています。