Some problems in HTML5 semantics __html

1. What is HTML5 semantics:

Depending on the structure of the content, select the appropriate tags, so that developers readers to write more elegant code while the machine and the browser better parsing.

2. Semantic Benefits:

1 in the absence of CSS, can also show a good content structure.

2 Strengthen the user experience, such as Alt,label, etc.

3 is conducive to SEO: and search engines to establish good communication, to help crawl more information, reptiles rely on the label to determine the context and the weight of each keyword.

4) Convenient for other equipment analysis

5 facilitate team development and maintenance

3. Write HTML code should note:

1 write less meaningless div and span

2 when the semantics are not obvious, when you need to use DIV or p, try to use p.

3 Do not use plain style labels, such as font,b,u, use CSS settings as much as possible

4) need to emphasize the text, with strong, without B, italic for EM, without I

5 Use the table, the title with caption, table head with thread, the main body with the tbody tail with tfoot, table head and general cell separate, the table head with th. Cell with TD

6 form fields surround with fieldset and use legend tags to describe the purpose of the form

7 each input label corresponding to the description text to use the label label, and by setting the id attribute for the input label, set For=someld in the label label to explain the text and corresponding input

4 new Semantic Tags for HTML5:

1 header: can include H1-h6 or Hgroup as title, can also include catalogs, search box, a nav, or any related logo

2) Footer: Contains the basic information of this section: Author, related document link, copyright material ...

3) Hgroup: Contains a number of consecutive h1-h6, if only one h1-h6 is not required.

4) Nav: Represents the page navigation link area.

5) Aside: included in the article element as part of the content, the most typical is the sidebar

<article>
    <p> content </p>
    <aside>
        
 

6 section: represents sections or paragraphs in a document.


<section>
    
7) Article: Represents a self-contained content in a document, page, or website

Note: The article element is easiest to mix with section,div. When the article nested article represents an internal and external association, when article nested section representation

Represents a dependency relationship, section nesting article is an internally independent whole, composed of a section group, and Div wants to combine elements or give them style.