Which semantics is better for a list of articles?

2019-01-20 14:43发布

问题:

I was asking myself for the markup of a list of entries of a blog.

Which could be like that:

Case 1 :

<article>...</article>
<article>...</article>
<article>...</article>

or case 2 :

 <ol reversed>
    <li><article>...</article></li>
    <li><article>...</article></li>
    <li><article>...</article></li>
 </ol>

The example seems to be logic: "it's a list of entries order by desc date"

An other example is a list of important step to use a product:

<ol>
     <li><section><h1>step 1</h1></section></li>
     <li><section><h1>step 2</h1></section></li>
     <li><section><h1>step 3</h1></section></li>
</ol>

To get an outline like:

product name
    description
    how to use
       step 1
       step 2
       step 3
    customer reviews
    etc

Do you think it’s too much markup for this content?

My purpose is to get a best HTML5 syntax and outline, but I don’t want to fill the HTML with useless tags.

EDIT: The real question isn’t what is better but it’s more something like to know what developers are thinking about this different ways. Because there are a lot of ways to do things, but sometimes if 2 ways are correct there is maybe a more "logical" or "relevant" method to do it.

回答1:

ol must only be used if "changing the order would change the meaning". Just because content is sorted somehow doesn’t necessarily mean that ol is appropriate.

If you should use a list (whether ol or ul) depends on your actual content and its context, it can’t be answered generally. The HTML5 spec defines these lists as "list of items", without specifying what a list is or what qualifies as item.

A possible/subjective rule of thumb (with many exceptions): Look at your content and ask yourself if you would call it a list, and if you could picture it with typical bullet points.

A page, titled "Blog", showing 10 fulltext blog posts? Probably not.
A sidebar, titled "Related posts", showing 10 links to blog posts? Probably yes.

This suggests that the "complexity" of content might play a role, too, so another possible/subjective rule of thumb (with even more exceptions): If an item has a heading (i.e., it’s a section) and long content, you might not need a list.

Steps to use a product, where each step consists of long explanations with images? Probably not.
Steps to use a product, where each step consists of a short sentence? Probably yes.