Web Front-end development uses tags to optimize pages and search engines.

After the holiday, I have more practices to write blogs. You have a lot of support and blog activation in a few days. Please give me a lot of support and thank you for your comments these days, I also learned some knowledge! If something is not well written, you should correct it in time. Thank you for your kindness.

This time I want to talk about the rationalization of tags used in HTML pages. I mainly outline the big framework, analyze the semantics of HTML page tags, and use some tips. As we all know, web standards advocate the arrangement of the document flow structure of the entire page in a tree. So their tag application is worth further research. This will not only make your page look more compliant with web standards, but also play a crucial role in the optimization of search engines. Then, what I want to talk about is the DIV tag and DIV, which can be seen simply by its spelling, its literal meaning can be interpreted as "Partitioning" and "layering", but its understanding on the HTML page means that the box is also the box model, and it can put content like a box, it is most appropriate to pull the frame with this Div. Complete is <div>... </Div> you can write the style you want in the middle. For example, if you want to write a B2B website, the first thing we need to consider is how to speed up the browser's page parsing speed. Then, our preferred framework tag is Div.

Using the DIV in the framework is also worth pondering. Do not abuse it. Next let's take a lookCode:

1 < Div Class = "1" >
2 < Div Class = "2" > </ Div >
3 < Div Class = "3" >
4 < Div Class = "3" > </ Div > </ Div >
5 < Div Class = "4" > < Div Class = "4_1" > </ Div > </ Div >
6 < Div Class = "5" > < Div Class = "5_1" > </ Div > </ Div >
7 < Div Class = "6" > < Div Class = "6_1" > </ Div > </ Div >
8 < Div Class = "7" > < Div Class = "7_1" > </ Div > </ Div >
9 < Div Class = "8" > < Div Class = "8_1" > </ Div > </ Div >
10 </ Div >

We recommend that you never abuse this type of code, especially when you are a newbie who doesn't understand Div + CSS. As a result, if you worship Div too much, you will abuse it. Otherwise, the document is filled with Div labels, leading to unclear page structure, increasing maintenance pressure, and violating web standards. Although I have always been skeptical about web standards, its benefits always outweigh the disadvantages (I will explain this here later ). How can we use it properly? Let's take a look at the code below:

1 < Div Class = "Head" > <! -- This is the header Div -->
2 < Div Class = "Main" > <! -- This is the main content DIV in the middle. -->
3 < Div Class = "Left" > </ Div > <! -- This is the Left Div (generally, it mainly writes some categories, navigation, and additional information) -->
4 < Div Class = "Right" >
5 < Div Class = "Center" > </ Div > <! -- Main Content -->
6 < Div Class = "Log_news" > </ Div > <! -- The main logon box or the right side of news -->
7 </ Div > <! -- This is mainly used to write theme content for the right div. -->
8 </ Div >
9 < Div >
10 < Div Class = "Footer" > </ Div >

Let's see if their structure is similar to a tree structure? The structure is clear, clear at a glance, and the browser resolution is also very reasonable. More importantly, it is very friendly to the crawling spider of the search engine. He can quickly identify the theme content and the secondary content! Our future maintenance is also very simple!

Next we will look at some H1 labels, which are ignored by many developers. In fact, this label is very important and very important. Its importance is no less than the DIV tag. We can understand its meaning in HTML: the tags of the H series are the highlighted labels of the content. We should not ignore the emphasis. In the structure, it represents the topic. In Series H, he is the leader and the topic content is the leader. That is to say, if you write a terminal page of a portal website, that is to say, on the pages where many members publish information, the content is written by some merchants, and some of them do not understand these aspects. They only write one title, some content, and some things. Even some professionals publish information to publish information. This is just the task. However, our website needs to be indexed, which leads to high indexing and traffic accumulation! So the first thing we need to consider is optimization. How can we optimize it? Where can you choose to make the H1 tag reasonable? Title: this title is a topic on the terminal page. Search engine spider crawls to your page and finds the H1 tag. It first analyzes the content of your tag, first, I found your H1 tag. The content is the title and the word structure is very good. (generally, people who publish information should think about the title and write it out. There is no random copy )! The topic content on your page is highlighted, which brings you great benefits. In this way, we did not deliberately optimize it, but it is also very consistent with the standards of the web. Why not? Therefore, we must grasp the semantics of structures and labels.

The next step is the P tag. The P tag refers to the paragraph and the paragraph of the text. It does not play an obvious role in optimization, but this tag is also very important in the HTML document stream, for example, when there are a large number of texts such as news, soft texts, and information, you can use the P tag instead of the DIV tag, because it is not suitable. The browser also analyzes documents.

I would like to share these labels with you because they are rarely introduced online! I know there are still a lot of optimization labels, that is, a little lazy, can't help everyone. I will write it again next time. I will take a nap first. I slept too late last night!

I have analyzed several labels of these framework types. Please give me some comments and be willing to accept them!

(Like to learn and want to discuss with me a variety of Web Knowledge left your mailbox or contact information, or with me mail 747850255@qq.com reprint Please consciously attach reprinted address, from the blog Park "Opening Audi next year ")