A, HTML semantic context
HTML semantic structure, is only in recent years put forward, before comparing the HTML structure, mostly a bunch of no semantic tags . Most is DIV + CSS, in order to change this situation, developers and official proposed the concept of semantic HTML structure used, and added a lot of HTML5 semantic tags.
Two, HTML semantic concepts
Semantic refers to the structure based on the content, select the appropriate label , for developers to read and write more elegant code at the same time, let the browser reptiles and machine a good resolution.
Three, HTML semantic necessary
With the development of the Internet, WEB carrying more and more information (images, audio, video, etc.), people began to use machines to process information network, was born a search engine . How taken are large and complex information processing and mining search engines, so let the machine to better read the content on the WEB has become increasingly important.
Traditional Web by the document composition, W3C hopes "Web of data" through a set of technical support, namely Web of Data, Web will be seen as a large-scale distributed database to store and manage data. Semantic Web is a Web data structure of an important part of helping people create and store data on the Web, create the relevant processing rules vocabulary and data.
Four, HTML semantic role
4.1 page a clear structure
Remove or CSS style lost time, but also make the page appear clear structure, enhance the readability of the page.
4.2 supports more devices
Other convenient analytical device (such as screen readers, the blind readers, mobile devices) in a meaningful way to render web pages.
4.3 conducive to SEO optimization
And search engines to establish good communication helps crawlers to crawl more valid information, the search engine crawlers also depends on the context and markers to determine the weight of each keyword heavy.
4.4 to facilitate the development and maintenance team
Everyone in the team following the W3C standards, can reduce a lot of differences of things, facilitate the development and maintenance and improve development efficiency, and even modular development.
Five, HTML semantic methods
(1) The logical structure of the document the context of the current selection of the most suitable expression of semantic labels;
(2) at least as much as possible without using semantic tags <div> and <span>;
(3) Do not use labels with style, such <b>as: <u>, , <font>and so on, using CSS;
(4) the use of the title tag should be based on the importance of progressively decreasing, there is no fault, and a page can have only one <h1>;
(5) increase the density of the keyword, such as alternative Alt text image, prompt text title;
(6) the proper use of a content container, such as a paragraph <p>, the list of <ul>, <ol>, <li>, <dl>, <dt>, <dd>;
(7) It should be emphasized text, you can use <strong>or <em>label (the browser's default style, do not use CSS setting), <strong>the default style is bold (do not <b>), <em>italic (do not <i>);
(8) Note that the use of the table, the title <caption>, header <thead>, the table body (body) <tbody>, Notes to Table (footer) <tfoot>. <Tr> definition of the table rows, <th> header definition table, <td> defining cell.
(9) form fields using <fieldset> tag, and <legend> label <fieldset> Title defined;
(10) each <input> tag corresponding to the text described require the use of <label> tag, as the id attribute is set by the <input>, and is provided for = id and the corresponding text of the description <input> in <lable> tag association.