Two points of SEO in xhtml+css layout

Source: Internet
Author: User
Keywords Suggestions SEO

Intermediary transaction http://www.aliyun.com/zixun/aggregation/6858.html ">seo diagnose Taobao guest cloud host technology Hall

Xhtml+css layout mode is widely accepted because of its performance and content, which can improve the index efficiency of search engine, code simplicity, improve page browsing speed, easy maintenance and revision, and many other advantages. The following author combines the mobile Phone business class website, the xhtml+css layout in combination with some summary of SEO, hoping to give webmaster colleagues some useful reference.

First, do a good job of web page structure analysis, is the premise of the design of the Web page

A site with a high number of visits is a factor in the success of the site, we design the Web page in accordance with the different theme of a reasonable choice of plate and color matching, the site to achieve the publicity effect through a reasonable mix of beautiful pages to attract customers interest, prompting them to visit our website.

First, the analysis of the page plate structure

"Mobile Business Website" Mainly to promote new mobile phones and sales on the Internet mainly, the characteristics of this type of site is mainly to let people feel the rich and beautiful goods in the choice of color is mainly blue, green, small icons, small buttons, border lines and other decorative small graphics to red, orange-oriented, it appears that the page colorful, lively, generous, Strong visual impact; In addition, "mobile Business Website" Main page includes website banner, navigation bar, site search, new product picture publicity, the latest news, Web services, product information, copyright information.

Second, analyze page layout structure

The entire Web page frame is relatively simple, including banner pictures, navigation bar, search bar, page subject and copyright information. Therefore, the basic Web page frame structure is adopted. Clear and accurate architecture design is the basis and key to the next step.

Third, according to the XHTML+CSS Layout Web page model features to achieve page of the production of modules, highlighting the advantages of layout

The overall framework of the page has a general design, the various modules for the processing, and finally unified integration, this is the design of the usual steps to create a Web site, the formation of good design habits can be practice makes perfect.

1, the use of div tags to block the page, to determine good blocks and the relationship between the sub-block based on the analysis of the layout of the page block, and the production process to note the use of annotation statements, so that the page code clear, easy to read.

2, the definition of CSS style to achieve the effects of the design and beautification

Page after the partition of the module, the next is to define the CSS style positioning and landscaping work, the specific operation of the entire site before the style analysis and planning work, this is the effective use of CSS style sheet premise.

1 the entire Web site to use the CSS style sheet for unified planning. From the principle of consistency of the Web site effect, the whole site's style of the system analysis and planning, detailed list of the name and style of each style content. Use attribute abbreviations in particular to minimize redundant code, such as:

margin-left:10px;margin-top:0px;margin-bottom:0px;margin-right:10px can be written in this format: margin:0 10px.

2 Unified planning of the application of CSS styles. The style effects you want to use for each page in your Web site (example: Common text information in each page uses a uniform size, fonts, row heights, colors, and so on) are uniformly defined in an external style sheet file to facilitate calls to individual pages, while the effects that you want to use individually on a page are defined directly in the appropriate page as nested style sheets.

3) based on SEO style naming specification

Search engine is through the crawl site source code to make intimate contact, how to better let search engine crawler more accurately aware of the relevance of the content of the site, enhance the site's search optimization? There may be unexpected gains from the basics of naming rules, The following from the perspective of the front-end design of some common naming rules, it is very good to consider the search engine preferences, in the process of page design, as far as possible to make the search engine understand, so as to achieve our design goals.

3, the overall adjustment of the page effect to ensure the coordination of the page and beautiful

After the steps of the page has been basically formed, in the final production, often also need to make some details on the page to adjust the effect. For example, whether the values of padding and margin between blocks are coordinated with the overall page, and whether the individual blocks are harmonized and so on. In addition to the fixed width and center plate, you need to consider adding a background to the page to fit the large display users.

Second, consider the browser compatible processing, to ensure that different users see the best page effect

In the design of Web pages, often encountered in IE made in the page to change to Firefox preview, found that the page effect changes very much. In order to solve this problem, we should do the corresponding processing when designing the webpage. Commonly used methods are: Starting from a blank page, each one small step, at the same time in various browsers to view, once found that the display effect is different, immediately find the cause, find a solution; You can also simulate the effects of web pages in a variety of browsers, such as the current IETester v0.2.3, this can be done while modifying; In addition, we should be good at summarizing some frequent problems in the process of processing methods. For example: use padding or border to avoid border overlap. You might be overwhelmed with space that you shouldn't have, or if you need a little space, you can't squeeze it out, and if you're useful to margin, it's easy to create a border overlap. And if there are some mistakes that make 50%+50% 100.1%, so that the Web page problems, then try to change these values to 49%, or even 49.9%, often this approach to solve the problem and so on.

This article from the Chinese Thesis Center (www.zhonghualunwen.com) reprint please mark!

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.