備忘録的リファレンス

<article>エレメント

 <article>エレメントは、ブロックレベル要素で複数のエレメントをグループ化するエレメントです。<article>エレメントで囲まれた内容は意味が完結しているという前提があります。必ず使わなければならないわけではありません。

 ブロックレベル要素でグループ化することができるエレメントの代表的なものに<div>があります。他にも、<header><footer><main><aside><section>があります。<article>エレメントは、<header><footer><main><aside><section><div>エレメントを包括することができます。  <header><footer><main><aside><section><div>エレメントの親エレメントにできます。

 使い方としては、複数のページを1ページで表現したい場合や、ページのなかにページを表現したいときに有効です。

 よく分からない場合は、<div>で包括していって、<header><footer><main><aside>と同じ意味合いで、それら以外には<section>にする。ページに複数のページ内容、またはカテゴリーがあり、<header><footer><main><aside><section>を包括した内容である場合は<article>にしてみては。

複数ページ(カテゴリー)を1ページで表現

 複数ページおいては<h1>エレメントを複数おきたくなります。しかし、<h1>エレメントは1ページに1つです。

 検索エンジンでは、例え<h1>エレメントが複数存在しても内容を解釈はしてくれます。そこで<article>エレメントを使います。

Example

ページのなかのページ

 ページの中にページを置きたい場合があります。そのためには、<article>エレメントで内容を包括したほうがよいでしょう。

Example