web-dev-qa-db-ja.com

HTML5タグを使用したブログページの最も意味的に正しい構造は何ですか?

grok<aside><section><article>の究極の性質にしたいと思います。

HTML5タグを使用したブログページの最も意味的に正しい、最も適切な構造は何ですか?

サイドバーを<aside>内に配置する必要がありますか?または、これはむしろ<section>に属しますか(<aside>は広告、短い引用などに使用されるべきです)?

主な機能であるブログ投稿をどのように提示すればよいですか? <article>を正しく使用するにはどうすればよいですか?

記事タグをどのようにマークアップする必要がありますか?

9
Wabbitseason

ブログの投稿に<article>を使用します。 Mark Pilgrimには、各タグの使用方法に関する非常に優れた 説明 があります。また、彼のサイトの定義リストのすぐ下にあるarticleをマークアップする方法についても説明しています。これは、HTML 5とCSSを学習するための素晴らしい本です。

「article要素は、ドキュメント、ページ、アプリケーション、またはサイト内の自己完結型の構成で構成され、シンジケーションなどで独立して配布または再利用できるように意図されたページのコンポーネントを表します。」

Asideは「接線方向に関連する」要素用であり、sectionは「一般的なドキュメントまたはアプリケーションセクションを表します」を表します。

7
citadelgrad

<aside>については、演劇とは別に考えてください。物語は観客に何かを説明するために保留され、メインフォーカスに戻る前に少し接線をたどります。例えば。:

<article>
     <p>A horse walks into a bar.</p>
     <p>The bartender says, "Why the long face?"</p>
     <aside>Not because it was sad, horses just have long faces.</aside>
</article>

ひどい例ですが、有効な例です。プルクォートや他の記事に関連する接線のようなものには役立つかもしれませんが、純粋にセマンティックタグとして、広告は一般的に属しません。

キーワード駆動型の広告システムは、コンテンツの意味的な適合を気にせず、人口統計のマッチングに関心があります。 <article>がPHPのみであり、Python/Perl/Javaに関連する広告をプルする(ある時点で)場合、<aside>は意味を失いました。それらをページの他の場所に配置した方が良いでしょう。

2
tadamson