38

記事の典型的なインデックス (抜粋のないブログなど) では、次の画像のようになります。

例

これらの項目はリスト ( <ul><li>) にするか、単に div にする必要がありますか?

また、フィギュア/フィグキャプションにする必要がありますか? ある程度の意味はありますが、... 画像はメイン コンテンツではなく記事の一部であるため、タイトル/説明は画像のキャプションではなく、記事のキャプションである可能性があります。

どう思いますか?

編集: 実例 - https://news.google.com/?hl=en

4

5 に答える 5

30

article各スニペット (つまり、ニュース ティーザー) を使用します。

それぞれarticleh1、見出しのimg要素、画像の要素、およびpテキストの要素が含まれています。

おそらくフルバージョンにリンクしたいので、すべての要素を 1 つのa要素 (HTML5 で許可されています) で囲むか、見出しなどだけで囲むことができます。

したがって、次のようになります。

<article>
  <h1><a href="" title=""><!-- news title --></a></h1>
  <img src="" alt="" />
  <p><!-- news description --></p>
</article>

figureこの画像自体に別のキャプションが必要な場合にのみ使用してください。ニュースの説明 (ここでは に含まれていますp) は通常、その画像のキャプションではありません。

子の順序を変更できますarticle。セクション要素の機能のおかげで、見出しが最初の要素である必要はありません。

を使用できますがul、必須ではありません。olただし、順序がコンテンツを理解する上で本当に意味がある場合にのみ使用してください (つまり、順序が異なるとドキュメントの意味が変わる場合)。典型的な例: アイテムが関連性によってランク付けされている場合 (たとえば、最も関連性の高いティーザーが一番上にある場合)、 を使用する必要がありますol


ティーザーが必要かどうかの質問についてarticle

article(HTML5 要素) を「記事」(英語) という用語と混同しないでください。「記事」という用語の理解とは必ずしも関係のないarticle別の定義があります。

ティーザーも である必要がありますarticle– ティーザーarticleとフルテキストarticle異なる articleですが、同じエンティティを参照しています。

于 2013-10-11T12:15:28.947 に答える
1

これは意見の質問なので、好みの問題になります。あなたのイメージに基づいて、<ul> <li>divを使用して同じ結果を得ることができますが、使用します。

于 2013-10-10T23:06:56.863 に答える
1

各アイテムが記事を表す場合、それぞれを<article>elementsを使用して表す必要があります。

記事の順序付きリストまたは順序なしリストであると思われる場合は、それぞれ<ol>または<ul>要素を使用できます。

マークアップをできるだけシンプルにし、必要に応じて複雑にすることをお勧めします。次のようなものです。

<div>
  <article>
    <img>
    <div>…&lt;/div>
  </article>
  <article>
    <img>
    <div>…&lt;/div>
  </article>
  …
</div>
于 2013-10-10T23:18:29.297 に答える
0

article他の方もおっしゃっていますが、各記事にはタグを付けるべきだと思います。

asideリスト全体をタグで囲むこともお勧めします。そのため、ページに主要な記事が 1 つ ( で囲まれているmain) ある場合、それは他の記事の影響を受けません。

についての素敵な記事asideがあります。

于 2016-07-20T07:29:54.943 に答える