发表新帖
发表新帖

Section vs Article HTML5

前端 未结
关注
10 2088
深忆病人
深忆病人 2020-12-02 03:42

I have a page made up of various \"sections\" like videos, a newsfeed etc.. I am a bit confused how to represent these with HTML5. Currently I have them as HTML5

相关标签:
10条回答
  • 醉酒成梦
    2020-12-02 04:16

    also, for syndicated content "Authors are encouraged to use the article element instead of the section element when it would make sense to syndicate the contents of the element."

    0 讨论(0)
  • 耶瑟儿～
    2020-12-02 04:19

    A section is basically a wrapper for h1 (or other h tags) and the content that corresponds to this. An article is essentially a document within your document that is repeated or paginated...like each blog post on your document can be an article, or each comment on your document can be an article.

    0 讨论(0)
  • 谎友^
    2020-12-02 04:19

    My interpretation is: I think of YouTube it has a comment-section, and inside the comment-section there are multiple articles (in this case comments).

    So a section is like a div-container that holds articles.

    0 讨论(0)
  • 天命终不由人
    2020-12-02 04:22

    Sounds like you should wrap each of the "sections" (as you call them) in <article> tags and entries in the article in <section> tags.

    The HTML5 spec says (Section):

    The section element represents a generic section of a document or application. A section, in this context, is a thematic grouping of content, typically with a heading. [...]

    Examples of sections would be chapters, the various tabbed pages in a tabbed dialog box, or the numbered sections of a thesis. A Web site's home page could be split into sections for an introduction, news items, and contact information.

    Note: Authors are encouraged to use the article element instead of the section element when it would make sense to syndicate the contents of the element.

    And for Article

    The article element represents a self-contained composition in a document, page, application, or site and that is, in principle, independently distributable or reusable, e.g. in syndication. This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.

    I think what you call "sections" in the OP fit the definition of article as I can see them being independently distributable or reusable.

    Update: Some minor text changes for article in the latest editors draft for HTML 5.1 (changes in italic):

    The article element represents a complete, or self-contained, composition in a document, page, application, or site and that is, in principle, independently distributable or reusable, e.g. in syndication. This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.

    Also, discussion on the Public HTML mailing list about article in January and February of 2013.

    0 讨论(0)
  • 孤独总比滥情好
    2020-12-02 04:27

    I'd use <article> for a text block that is totally unrelated to the other blocks on the page. <section>, on the other hand, would be a divider to separate a document which have are related to each other.

    Now, i'm not sure what you have in your videos, newsfeed etc, but here's an example (there's no REAL right or wrong, just a guideline of how I use these tags):

    <article>
    <h1>People</h1>
    <p>text about people</p>
    <section>
        <h1>fat people</h1>
        <p>text about fat people</p>
    </section>
    <section>
        <h1>skinny people</p>
        <p>text about skinny people</p>
    </section>
</article>
<article>
    <h1>Cars</h1>
    <p>text about cars</p>
    <section>
        <h1>Fast Cars</h1>
        <p>text about fast cars</p>
    </section>
</article>

    As you can see, the sections are still relevant to each other, but as long as they're inside a block that groups them. Sections DONT have to be inside articles. They can be in the body of a document, but i use sections in the body, when the whole document is one article.

    e.g.

    <body>
    <h1>Cars</h1>
    <p>text about cars</p>
    <section>
        <h1>Fast Cars</h1>
        <p>text about fast cars</p>
    </section>
</body>

    Hope this makes sense.

    0 讨论(0)
  • 执念已碎
    2020-12-02 04:30

    Section

    • Use this for defining a section of your layout. It could be mid,left,right ,etc..
    • This has a meaning of connection with some other element, put simply, it's DEPENDENT.

    Article

    • Use this where you have independent content which make sense on its own .

    • Article has its own complete meaning.

    0 讨论(0)
 看不清?
提交回复
热议问题