Home >Web Front-end >CSS Tutorial >Summary of the advantages of using CSS DIV for layout_Experience exchange

Summary of the advantages of using CSS DIV for layout_Experience exchange

WBOY
WBOYOriginal
2016-05-16 12:07:311474browse

The use of CSS DIV to reconstruct websites is increasingly valued by everyone, especially large sites. Large portal sites such as Alibaba and 163 have already completed the reconstruction work. I have already had the habit of using CSS DIV to write web page source code last year. I personally feel that this method is indeed much better than the traditional TABLE form of source code architecture.

1: Separate performance and content

Strip out the design part and put it in an independent style file, and only store text information in the HTML file.

2: Improve search engine indexing efficiency of web pages

Replace nested tags with HTML that only contains structured content. Search engines will search for your web page content more effectively, and May give you a higher rating.

3: Improve page browsing speed

For the same page visual effect, the page capacity reconstructed using CSS DIV is much smaller than the page file capacity encoded by TABLE. The former is generally only the latter. 1/2 size.

Also because the

tag has to wait
It can only be displayed after downloading, so the entire web page pops up at once, which makes the display speed feel very slow. With css div, the
tag can display the content inside without waiting for the
to be downloaded, so it makes people feel that the speed of opening the web page is very fast.

4: Easy to maintain and revise

You can redesign the entire website page by simply modifying a few CSS files.

From the above description, using CSS DIV to reconstruct the website can greatly improve the friendliness of website users and search engines.

CSS DIV has become the mainstream of current web page layout. In my opinion, the main core reason is not only that it conforms to W3C standards, but that through the use of CSS DIV, web engineering has:

Performance and Content separation

Nowadays, div css has become very popular. All major websites have been restructured into div css mode. NetEase is the best example. After using layers and CSS, the most intuitive experience for users is to open the web page. Much faster. If it can give users a good experience, why not do it?

Today I mainly analyze the necessity of using DIV CSS for website creation or reconstruction from the perspective of SEO:

1. Websites structured with div CSS are easy to move closer to W3C standards. Whether the website Complying with W3C standards is an influencing factor for search engines to rank web pages, especially YAHOO, which takes it seriously.

2. The website source code is simple. Except for a few tags such as div, ul, li, dl, dd, dt, there are almost no other tags. In this way, the website content is completely exposed to search engine spiders. In front of you, it is easier to crawl key content and increase the proportion of pages with key content, thereby increasing the proportion of ranking factors.

3. Key content can be easily read by spiders first. Generally, the site has three columns on the left, middle and right. The main content of the page is in the middle column, and the spider reads the page content from top to bottom, from left to right. If your left column content If there are more, it will be troublesome, and the weight of the main content of your page will decrease. With div css, you can write the main content in the front first, then write the content in the left column and right column, and then position it through CSS.

4. It is convenient to adjust the website structure and layout. For commonly used table layouts, if you want to change the layout, it can affect the whole body. If the website layer structure is designed reasonably, you can use CSS to easily change the performance of the website. This is the separation of structure, content, and behavior. If the website structure is changed regularly, it will naturally be very attractive to search engine spiders.
For a website that uses layers and css as a foundation, future optimization work will naturally save a lot of effort.​
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn