0 reply content: the HTML standard is written as follows:
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 wocould be chapters, the varous tabbed pages in a tabbed dialog box, or the numbered sections of a thesis. A Web site's home page cocould 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 wocould make sense to syndicate the contents of the element.
Note: The section element is not a generic container element. when an element is needed only for styling purposes or as a convenience for scripting, authors are encouraged to use the p element instead. A general rule is that the section element is appropriate only if the element's contents wocould be listed explicitly in the document's outline.
([] Is my note ):
The section element indicates a part of a document or application. The so-called "part" refers to the content area grouped by topic, usually with a title. [That is, each section corresponds to a different topic. Note that it is the subject of the content, rather than the standard set by others .]
The section example includes the Chapter overview in the book, each tab page in the Multi-tab dialog box, and the section numbered by number in the paper. The home page of the website may be divided into sections such as introduction, latest content, and contact information.
Note: The webpage author should use article instead of the section element, if its content is used for aggregation (syndicate ). [For example, each blog on the blog homepage. Another example is the first floor, second floor, and third floor of Forum posts ...... N floor. Normally, each part of the content is similar in form, but the source is independent .]
Note: section is not a common container element. Apply the p element if it is only used to set the style or script processing. A simple principle is that section elements are applicable only when the element content is listed in the document outline. There is a very important description in the standard description document:
The section element is not a generic container element. when an element is needed only for styling purposes or as a convenience for scripting, authors are encouraged to use the p element instead. A general rule is that the section element is appropriate only if the element's contents wocould be listed explicitly in the document's outline.
More detailed here: http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-section-element
When to use it, the following two points can basically be used:
- Section is not a label dedicated for containers. It is dedicated to p
- Section should have a title (h1 ~ 6), but we recommend replacing it with article.
We can understand it as a special module container with a clear id (not a dedicated block container) in non-article paragraphs ). Section, as its name implies, is a chapter, for example:
WWF
The World Wide Fund for Nature (WWF) is ....
As for why it should be used, it is for the sake of semantics. There are sections, articles, and dl which are more comfortable to see, so people can understand and computers can understand, which is much better than the full-eye p. A section is usually composed of content and
TitleSection is generally not recommended for untitled content, in HTML 5 Outliner
This website can detect sections without titles. The function of a section is to partition the content on the page, for example, sections with titles, functional areas, or articles, do not confuse it with articles that have their own complete and independent content.
Take a newspaper for example:
One or more newspapers have many sections, including the front pages, international affairs sections, sports sections, entertainment sections, and literature sections, A section with a forum title or content that belongs to a category can be wrapped in a section.
There are many articles and reports under each Forum. Each article has its own title and content. In this case, it is best to use article. If a report is too long and has multiple sections and each section has its own title, you can use section to wrap the section.
Although these labels have such limitations, the official standard recommendations are also vague, but do not forget the meaning of html5 semantic tags. One of them is to make it easier for developers to read the code documentation, clear the code structure. I personally think that if you can easily read and understand the labels for yourself and others, you can use them boldly.
Finally, I think the cause of difficult tag selection is also related to the fact that there are too few html5 semantic structure tags. If you add more tags, more subdivided tags, commonly used webpages, and dedicated functions, for example, the comment tag is added to the comments part, the link tag is added to the links, the paging tag is added to the pages, and the author tag is added to the author information. This will not solve the problem of using tags with similar functions, p, you don't have to think about this. Keep a stick and try it all. In the HTML5 specifications I understand, simply put,
P acts as the container role and is used to set the overall attributes of a piece (one p may contain multiple sections );
Section is used to emphasize a module and emphasize that the module itself is a whole;
Article emphasizes a piece of independent content and content independence.
Navigation
Top of the main area of the page
Article 1
Content 1
Article 2
Article 2
Information at the bottom of the main area of the page
Advertisement?
Hot News Connection?
At the bottom of the page
Section is the main content of the page. I think some labels are designed for search engines. because browsing a webpage is to obtain the main content of the page. other information serves the main content. how to Make It semantic. Personal Understanding (non-professional ):
1. The newly added html 5 tags mainly help make html code more standardized and semantic.
2. There is no restriction on tag nesting. But with more nesting, we will go back to the era where p was just as speechless.
3. p is not recommended after html5. P is used, but some p can be replaced by section to make the code structure more reasonable.
3. The section should be as flat as possible (controlled at one layer), similar to the rules for using p labels. There are chapters (just Chinese Translation of sections) and regional concepts. Nested gods are the most annoying.
4. The article label is the container of the main content of the page. You can add multiple articles on the page.
5. You can have multiple headers. For example, nested in article as the header of article, see here: http://www.w3schools.com/html5/tag_header.asp
5. Question: Can a section be nested in the article as a chapter part of a large article. (The statement is correct, but it seems that there is no section label insertion port in mainstream Rich Text editors. . It mainly divides pages into various functional topic blocks.
6. Any section, article, and other containers with "Sandbox Model" can contain h1 ~ H6.
To be improved ·
Some additional instructions:
- Do not simply use section as a styling hook. Use p and span for this purpose.
- If the header, footer, aside, or article is more semantic for your content, do not use section
- Do not use section unless it has a title.
Reference from HTML5 classic instance by o''reilly
