HTML code SEO optimization Best layout examples Explained

Source: Internet
Author: User

The search engine is very optimized for HTML code, so HTML optimization is the first step to a good promotion. A code that complies with the SEO rules is generally shown in the following interface.

1, <!– mu Zhuang network blog –> This thing is some page comments, you can add my " mu Zhuang Network blog " Here, but too many keywords may be punished by the search engine!

2,

3,

4, <title> ( mu Zhuang Network Blog-diligent record to share ) </title> military battleground, very important, the word value daughter Ah, the webmaster pay close attention to the key word placement, do not stack the keyword, or the consequences will suffice for you to eat.

5, <meta Http-equiv=content-language content=zh-cn>

6, <meta http-equiv= "Content-type" content= "text/html; Charset=gb2312″>

7, <meta name= "keywords" content= " mu Zhuang Network Blog-diligent record to share " > This now weight is not too high, but as long as there is a severity we also want to use.

8, <meta name= "description" content= " mu Zhuang Network Blog-diligent record to share " > This thing is your Baidu search time site under the use of the introduction, there is a certain role Oh!

9, <link href= "Style/css.css" type= "Text/css" rel= "stylesheet" >

10.

11. <body>

12. <div>

13, Wood Network blog

14, mu Zhuang Network Blog-diligent record to understand sharing

15, mu Zhuang Network blog 1

16, mu Zhuang network blog 2

17, mu Zhuang network blog 3

18, mu Zhuang Network blog 4

19, mu Zhuang Network blog " > can increase the relevance of the site.

20, <a href= "/" title= " mu Zhuang Network blog " > mu Zhuang Network blog </a> can use hyperlinks to increase the number of keyword occurrences, the word is best to make the site keyword, so help in the rankings.

21, <strong> mu Zhuang Network blog </strong> The weight of the <H1>, higher than is certain that it is more than <b>, <u>, <i> and other tags.

22, <b> keyword emphasis </b><u> keyword emphasis </u><i> keyword emphasis </i> weight secondary to the above

23. </div>

25. <div>

26, the copyright part of the key words stressed that this can increase the layout of the keyword, more reasonable. And the place will get a good weight.

27. </div>

28. </body>

29.

SEO most commonly used HTML tags if you want to be a seoer, you have to understand some of the important HTML code. In fact, learning HTML is very simple, below I say, seo most commonly used HTML tags have what:??

1, H1-h6 tags, these labels occupy an important position in the page, wherein the H1 tag can be said to be in addition to the title of the most important page of another label. Here should be careful to use H1, do not use too much, or be punished by the search engine is not worth it. If it is a channel page, big class column name using H tag is appropriate, of course, here the largest and most important classification to use H1, and then in accordance with the importance of the column, followed by the H2, H3 and so on H tags. Such a reasonable arrangement, so that the dominant level is clear, you can also guide the search engine to find the important part of this page. If it is an article page, it is necessary to use H2 according to the optimization method of the article page, if the most common page layout, only the article title and text content, no other information with the same level of the text, then you can use H2 decoration of the article title, you can tell the search engine clearly in the article page, my article title is the core , so the article page H2 can only appear once. Other H tags can be properly added according to the page column, but pay attention to reasonable use, otherwise counterproductive.

2, the Web page keyword plus Black label please use B tag (I think B tag is better than strong label quality). b tags are often used in keywords, a page just add 2-5 times is almost, depending on the size of the page.

3, <a href= "url" title= "link description" > Web information </a> for important links in the page with the title description, help search engine to find the key URL of the page.

4, alt Tag "img src=" xxx.jpg "alt=" image description "page of the ALT tag is used to illustrate the picture, here are two aspects of the role, one is to tell the search engine image information, the other is not loaded in the picture or picture path problems when the user is told, This is what kind of picture. In a Web page, all the pictures with alt tag is definitely not good, the best way is to focus on the Web page (in most cases, and the site highlighting the target keywords related to the image) using the ALT logo, so that the search engine crawling page important images are helpful to improve the site keyword weight will also be very good.

The weight score of different HTML tags in SEO optimization

First, the HTML tag weight score arrangement Internal link text: 10 points title Title:10 sub-domain: 7 h1,h2 The font size title: 5 minutes per paragraph first sentence: 5 minutes or file name: 4 points of similarity (keyword accumulation): 4 points Each sentence begins with: 1.5 points bold or italic: 1 minutes Text usage (content): 1 minutes t Itle attribute: 1 points (note not <title>, is the title property, such as a href= ... title= ") alt tag: 0.5 points Meta description (description attribute): 0.5 points Meta Keywords (keywords attribute): 0.05 points

Second, SEO optimization

1, static pages will be information pages and channels, the homepage of the site to a static page, is conducive to search engines faster and better collection.

2. The keyword optimization of the page title must list the title of the information, the name of the site, and the relevant keywords.

3, meta-tag optimization (past the important methods of SEO, now is not a key factor, but still can not be ignored) mainly include: Meta description, meta keywords settings. Keyword density is moderate, usually 2%-8%, that is, your keywords must appear in the page several times, or in the search engine allowed to the extent, to avoid piling keywords.

4, for Google to make sitemaps Google's sitemaps is the original robots.txt extension, it uses XML format to record the entire site information and for Google to read, so that the search engine can be more comprehensive content of the site.

5, the image of the keyword optimization of the image of the Alternative keyword also do not ignore, its other aspect of the role is that when the picture can not be displayed, you may give the visitor an alternative explanation statement.

6, avoid the nesting of the table now the table nested too many, search engines usually only read 3 <table> nested, if too much, will cause some useful information is not detected.

7, the use of Web standards for site reconstruction as far as possible to make the site code to conform to the HTML 4.0 or XHTML 1.0 specification. Through the XML+CSS technology for website Reconstruction, reduce non-tabular and redundant code, improve the extensibility of web pages, compatibility, can make more browser support.

8, the site structure of the flat planning directory and content structure preferably not more than 3 layers, if there are more than three layers, preferably through the sub-domain to adjust and simplify the structure of the layer. In addition, the canonical approach to directory naming is to use English instead of phonetic alphabet

9, the page capacity of the rationalization of reasonable page capacity will improve the speed of the page display, increase the friendliness of the search engine spider program. Also suggest JS script and CSS script to use linked files as far as possible

10. External file policy put JavaScript files and CSS files in the JS and CSS external files respectively. The advantage of this is that you put important page content at the top of the page, and you can reduce the file size. It is helpful for search engine to crawl the important content of page quickly and accurately. Other font <FONT> and formatting tags are also used sparingly, and CSS definitions are recommended.

11, external links as much as possible to other topics related to your website links to the site, as far as possible with the high PR value of the site to link with each other. If the website provides export links related to the subject, it is considered by the search engine to have rich content related to the subject, and also facilitates ranking, such as the concept of various investment sites and investment and financing websites. In addition to avoid links regardless of the quality of the large area of nets, search engine Ningquewulan.

12, the site map of the site's own site map is a search engine more comprehensive index of your site is an important factor. Proposed to make a text-based site map, including all the columns of the site, sub-columns. Site Map of the three major factors: text, links, keywords, are extremely conducive to search engines to crawl the main page content. In particular, dynamically generated catalog sites need to create site maps.

13, image hotspot In addition to AltaVista, Google explicitly support the image hotspot links, other engines are not supported temporarily. When a "spider" Program encounters this structure, it cannot be identified. So try not to set the image Map link.

14, Flash application Flash because it does not contain text information, should be used for function display and advertising, less for the site columns and pages.

15, JS script in the browser does not support JS footsteps <NOSCRIPT> tags will play an important role in the search engine spider search will also help.

16, frame frame tag will be ignored by the search, try to use less, if you must use, you should use the Noframe label correctly, in <Noframe></Noframe> The area contains links to frame pages or descriptive text with keywords, and keyword text appears in areas outside the frame.

17, the internal link of the information can help improve the site rankings and PR value, such as related information, recommended information, such as how to SEO a website text and HTML code than in fact for the search engine, the most friendly, when the text, although the picture is now crawling constantly improving, but any experienced veteran will tell you, SEO, text most suitable. Because of this, for example, Web site construction blog, although the figure, but still the text is mostly. Here is a simple example of how to increase the text of the site with the HTML code ratio:

Such as: Many people like to write like this

H1:

As we all know, a page does not appear two H1, if there are two, it is like a person with two heads as hard to see. This is not only common sense, but also standard. So adding these H1 to the class or ID is superfluous.

This should be written:

This is very simple, how does a round chamfer in the page do? There are many n methods on the Internet, the most typical of which is the HTML+CSS implementation of the rounded rectangle, the HTML code part is as follows:

<div class= "Panel" > <div class= "T-o B1" ></DIV> <div class= "T-o B2" ></DIV> <div class= " T-o B3 "></DIV> <div class=" t-o b4 "></DIV> <div class=" Content "> <!--here Content--<div C lass=clear></div> </DIV> <div class= "b-o b4" ></DIV> <div class= "B-o B3" ></DIV> <div class= "B-o B2" ></DIV> <div class= "B-o B1" ></DIV> <div class= "Break" ></DIV> </div>

In fact, we do not have to use this code at all, can be simplified to:

<div class= "Panel" > <!--here Content--</div>

There is no doubt that this can obviously reduce the HTML code, of course, the light is lost in the round corner effect, the effect we can use JS Plus. We can write in purely JavaScript code, for convenience, we use jquery to write:

JQuery (function ($) {$ ('. Panel '). prepend ("). Append (');})

It is important to note that this JavaScript code is written in a separate JS file.

If multiple fillets are used in the page, just set the class to panel. In this way, we can reduce the HTML code to achieve the purpose of adding content and HTML code. Without sacrificing the user's visual effects, to the crawler to see a clean page code, and in the same network speed conditions, certain to reduce the crawl time, is conducive to crawling, no doubt, will be conducive to search engine rankings. In addition to this fillet, sliding doors, etc., can be used in jquery code optimization, said the most popular, the domestic use of those sliding door is disgusting, but also to add a lot of useless ID, in fact, sliding door can do more simple.

Here is the HTML code: <dl> <dt> Sliding door title 1</dt> <dd> sliding door 1 corresponding content </dd> <dt> sliding door title 2</dt> <dd > Sliding door 2 corresponding content </dd> ... </dl> h tags full perspective h1 level headings represent the top priority, and its status is as important as the status of the keyword in the page.

Generally used in the website title or headline news, some large sites are also used in the logo, although H1 code can be written more than one, but the actual semantics are unique, H1 title in a page preferably only 1 times or not. H2 two headings appear mainly in the main content of the page of the article title and column headings, the three-column structure is generally in the middle, two column structure is generally on the important side. Can be used in conjunction with H3. H3 level Three headings are typically featured on the side sidebar of the page. H4 is its auxiliary, the occurrence frequency is not high. Page-level relationships cannot be too deep, so h4,h5,h6 generally appears less often.

This article is from: Mu Zhuang network blog: HTML code SEO optimization Best layout examples Explained

HTML code SEO optimization Best layout examples Explained

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.