What is the meaning of semantic html? Why do we need to be semantic?

first, what is the semantic HTML?

Semantic HTML is the right label to do the right thing, allowing developers to read and write more elegant code while the web crawler well parse.

Second, why do we have to be semantic?

1, in favor of SEO, is conducive to search engine crawler better understanding of our web page, so as to obtain more effective information, improve the weight of the page.

2, in the absence of CSS can clearly see the structure of the page, enhance readability.

3, easy to develop and maintain the team, semantic HTML can make it easier for developers to understand, thereby improving the team's efficiency and coordination ability.

4, support multi-terminal device browser rendering.

third, semantic HTML How to do it?

When doing front-end development, remember that HTML tells us what a piece of content is (or what it means), not what it looks like, and how it looks like it should be decided by CSS.(structure and style separation!) )

Writing semantic HTML structure is very simple, first of all, the semantics of the various tags in the HTML, when you see the content of what the label can be better to describe it, what is the label.


<p> paragraph mark, know <p> as a paragraph, you will no longer use <br/> To line up, and do not need to <br/> to distinguish between paragraphs and paragraphs. The text in <p> wraps, and the line wrap effect is better than <br/>. The gap between paragraphs and paragraphs can also be controlled by CSS, making it easy and clear to distinguish between paragraphs and paragraphs.

<ul>, <ol>, <li>,<ul> unordered list, this is widely used by everyone,<ol> ordered list is also very common. In the process of web standardization,<ul> also be more used for navigation bar, originally the navigation bar is a list, this is completely correct, and when your browser does not support CSS, navigation links are still good, but the beauty of a little bit worse.

<dl>, <dt>, <dd>,<dl> is the definition list. For example, the dictionary of words in the interpretation, definition can be used in this list.

<em>, <strong>,<em> is used to emphasize,<strong> is used as a key emphasis.

<q> is not just about adding double quotes to text, but rather representing the text as a reference.

<table>, <td>, <th>, <caption>, (X) the table in HTML is no longer used for layout.

add: web crawler, SEO and other concepts

Seo:search engine optimization--search engine optimization, which is a search engine to take advantage of the rules, the adoption of optimization strategies or procedures to improve the site in search results rankings.

Network crawler: Also known as network spider, Network robot, is a search engine to automatically crawl Web resources of the program or called a robot. From a certain URL as the starting point, go to visit, and then put the Web page back into the database, so constantly circulating, it is generally believed that search engine crawlers are crawling by links, so the tube called crawlers. This is only used by development search engines. For websites, crawlers automatically extract our pages as long as there are links to our pages.

Source: http://www.w3cfuns.com/notes/32557/6b91faf9614287c822fb49c6d8af02e2.html

What is the meaning of semantic html? Why do we need to be semantic?