Home > Article > Web Front-end > Is semantics a new feature of HTML5?
Semanticization is a new feature of HTML5. Its functions are: 1. Allowing the page to present a better content structure and code structure; 2. Improving user experience; 3. Conducive to SEO; 4. Allowing browsing The server's crawlers and machines can better parse; 5. Facilitate team development and maintenance.
The operating environment of this tutorial: Windows 7 system, HTML5 version, Dell G3 computer.
1. What is HTML semantics?
Basically it revolves around several main tags, such as title (H1~H6), list (li), emphasis (strong em), etc.>
According to The structuring of content (content semantics) and the selection of appropriate tags (code semantics) facilitate developers to read and write more elegant code while making browser crawlers and machines better Parse .
2. Why semantics? What is the use?
In order for the page to present a good content structure and code structure without CSS: In order to look good when running naked;
Improve user experience: For example, title and alt are used to explain nouns or explain picture information, and how to use label tags;
Good for SEO: Establishing good communication with search engines helps crawlers capture more effective information: crawlers rely on tags to determine the context and weight of each keyword;
Convenience for other devicesParsing (such as screen readers, blind readers, mobile devices), rendering web pages in a meaningful way;
develop and maintain, and semantics are more readable. It is an important trend in the next step of web pages. Teams that follow W3C standards all follow this standard, which can reduce differentiation.
#3. What should you pay attention to when writing HTML code?
4. What new semantic tags are added to HTML5, please describe them in detail.
1), Define the sections and paragraphs of the main part of the document. 2), A special section tag, which has clearer semantics than section. Define an independent, complete content block from the outside, such as a forum article or a blog text. . . 3), Used to load non-text content in the page, independent of other modules. For example, ads, groups of links, sidebars. . . 4),Defines a navigation part composed of a link group, the links in which can link to other web pages or other parts of the current page.
7),
Used to combine the title elements (h1~h6) of a web page or section.
8),
Used to combine elements.
9),
Add a title to the figure element. Generally placed on the first child element or the last one of figure.
10),
Define the details of the element, the user can click to view or hide it.
11),
Used in conjunction with details to include the title of details.
12),
Used for canvas drawing.
13),
Define video.
14),
Define audio.
15),
Define the content of the embedded web page. Such as plug-ins.
16),
This tag defines media elements for media elements (such as video, audio).
17),
Define a list of optional data, used in conjunction with input () can create a drop-down list of input values.
18),
Visually show the text that you want to highlight to the user. For example, search keywords are highlighted to users in search results.
19),
Weights and measures, using red, yellow and green to represent a The range of the value.
20),
Define different types of output, the style is the same as span.
21),
Progress bar, running progress.
22),
Define date or time.
23),
Define the encrypted content.
24),
Define command behavior.
Related recommendations: "html video tutorial"
The above is the detailed content of Is semantics a new feature of HTML5?. For more information, please follow other related articles on the PHP Chinese website!