Seven CSS tips to help you optimize SEO

CSS tutorialWe all know that it is not easy to build a website that is good for both users and Google. If we want to accommodate Google to discover the value of the website as much as possible, the user experience will be greatly compromised when designing the website. Google's spider crawlers are still unable to recognize some advanced Web technologies, such as Flash and Ajax. Sometimes they are just like children, you need to guide and help them discover and understand the quality of your website. Fortunately, there are also many CSS solutions that can make up for this defect, although the "skills" in the title of this article feels a bit tricky and tricky, in fact, this is just a means to cater to Google. Imagine whether we want to "cheat" Google, or Google makes our Web development always insecure...

Although there are more than one Google search engine, many of them are even more difficult to serve than Google. In addition, given their absolute strength, this article focuses on Google. The following seven CSS tips are applicable to SEO, with no particular ranking:

1. Make Rational Use of CSS paging technology

Google has a serious problem when evaluating the page weight of a long article. Generally, a long page has a higher weight than a short page. However, from the perspective of user experience, we often hope that users can read the full text, and do not need to drag the scroll bar or open another new page to continue reading.

The solution is CSS paging. This is not text hiding? As a matter of fact, hiding text, like hiding links and small texts, is an old form of cheating that interferes with search engine rules, which is often referred to as "black hat SEO, so never use it. CSS paging differs greatly from text hiding. It divides long text into several easily identifiable parts and is still on the same page. To some extent, it means tabs. When using CSS paging, you should also pay attention to the limitation of Google's page weight determination: crawlers generally do not completely crawl a large page.

2. Absolute Positioning

The closer the page is to the top, the more Google's attention will be given. Google crawlers do not "Browse" the page content as they do for the final parsed page content. They are crawled in the source code, so if the structure of your website is complicated, for example, if there are many navigation, scripts, or other gadgets, Google crawlers may stop crawling the main content before crawling it. In this case, you can consider to embody the main content in the position where the page source code is earlier than the previous one, and then use the absolute position in CSS to locate the appropriate position in the webpage, in this way, when the user browses, the main content will not go to the front of the navigation menu and other elements.

3. Use H1, H2... H * define the title

In HTML, title elements like H1 and H2 are always larger than other texts by default. Therefore, many web designers have long used to use DIV or SPAN to replace the H * label as the title text container, then you can freely set the style. However, in this case, Google will not know that the text is the title of the page content, which affects the judgment of the page weight to a certain extent. As a matter of fact, CSS can also provide a rich set of style definitions for labels such as H1. We do not need to adopt the previous one-by-one approach.

4. Title text SIFR image replacement method

Many people like to use text Replacement Technology on titles. In short, CSS is used to hide the title text and then replace it with images with richer appearances. There are many implementation methods for image replacement text technology. For details, refer to the text Technology for image replacement in ximi CC. Some of these methods are well-considered and relatively simple. Maybe you will ask again, isn't this text hidden? Yes, some replacement technologies will have some negative impact on SEO, because crawlers cannot capture the title itself.

Fortunately, Google has recognized an image text replacement method called SIFR. It can display titles in Flash, where you can use various fonts flexibly, in addition, the H * label can be identified in the code.

Reference content is as follows: SIFR indicates Scalable Inman Flash Replacement, that is, "Scalable Inman Flash Replacement" technology. It is a technology extended by Mike David son Based on the IFR method. It uses Flash + JS + CSS to perform more delicate and accurate text rendering without replacing the text elements on the page.

With SIFR, you can customize text fonts on the WEB, even fonts not installed on the client browser. SIFR uses Flash to render the font effect, which can smoothly eliminate text aliasing. You can easily get various text effects just like using CSS to control text.

5. Use of the List

Most SEO experts now accept the fact that keyword density is not the main factor affecting page weight, that is to say, if your keyword appears 20 times or 5 times on the page, it does not have a substantial impact on the weight. On the contrary, a high density may be considered as a fraudulent keyword. But what if you really need to repeat some words instead of SEO? Put them in the list tag. No matter whether it is an unordered list or an ordered list, Google will not regard repeated words as cheating methods.

If you do not want UL or OL to be displayed in a list on a webpage, you can use CSS to change its appearance style to make it more harmonious with the page. Some cool people even use lists for the whole site, and do not apply tables, DIV, or even SPAN to the layout at all.

6. Nofollow attributes on the Link Page

The Nofollow attribute is a new tag created by Google to minimize the impact of spam links on search engines. You only need to add rel = "nofollow" to the link tag. In this case, it is equivalent to telling the search engine that the webpage to which the link is directed is beyond my control and does not comment on its content. In this way, when the search engine calculates a wide range of links for the target website, this link will be excluded.

When determining the page weight, Google will pay special attention to those pages that contain many external links. Using Nofollow will make Google not mistake those links as very important pages. Do not waste weights on unrelated pages. Try to concentrate permissions on important pages. A rel = "nofollow" attribute can avoid wasting weights.

7. pure CSS navigation menu

Many people think that the pure CSS menu will not have a substantial impact on SEO, so they are still very accustomed to adding some JS or other things during the design to enhance the dynamic effect of the menu. In fact, the principle of pure CSS menus is similar to why we discard tables and adopt DIV la S. The simplified Page code greatly improves the page loading speed, this is very beneficial when spider crawls, otherwise it will certainly have a certain impact on page indexing and weight. What's more, CSS's powerful style control capability is enough for us to make practical and exquisite navigation menus.

The seven aspects discussed above are not very advanced knowledge or technology, nor will they play a decisive role in the SEO effect of a website, but it is undeniable that they will be more or less legitimate help, and help you to upgrade CSS from a technology to an idea. If you think SPAM is more effective in SEO, I can only say it is a silly idea. By the way, I don't like the concept of white hat SEO. For me, either SEO or SPAM is a method or a means.