How to Use CSS for Search Engine Optimization

By Tim Carey | Posted on 2009-10-08

Cascading Style Sheets (CSS) is a language that permits Web designers to attach styles such as spacing, color, font, etc. to HTML documents. Cascading style sheets are similar to a template, permitting Web developers to label styles for an HTML element and then apply it to the number of Web pages required. Thus, Cascading Style Sheets (CSS) are collections of formatting rules, which control the appearance of content in a Web page. With CSS styles you have great flexibility and control of the exact page appearance; from precise positioning of the layout to specific fonts and styles.

There are many benefits of using CSS. Maintenance of a Web site made with CSS is much easier compared to the ones which are table based. Aside from being able to make extensive changes with one CSS file, the code it generates makes it simpler to update. With CSS, when you decide to craft a change, you simply alter the style and that element is updated automatically anywhere it appears in the site, saving you an enormous amount of time. Without CSS you'd have edit each page independently. CSS generally requires less code compared to a table based layout, making your code lighter, cleaner and easier to maintain.

Cascading Style Sheets Benefits and Search Engine Optimization (SEO)

Another major benefit of CSS is that it makes your Web site SEO friendly. The reason behind this is simple. Search engines spiders are actually lethargic. They don't go through the bundles of HTML code to get to the indexed codes. Font tags and tables make HTML code cumbersome, and thus reduce the accuracy of the results. If you use external CSS files to determine the design attributes, the HTML code will be clean and will create better search engine rankings. With some knowledge of CSS you can change the code without destroying the visual layout. For instance, you could easily make the main content of your site to show up above the header or navigation menu in the code of your Web site; this will help to show search engine crawlers the importance of your content. I personally saw a huge boost in rankings in fully functional CSS Web sites. When I look at someone's Web site that was built using old school HTML code with tags such as: TABLES, TD, TR, FONT and so on, I convert that site to a CSS layout. There are many tools on the Internet that shows the actual code over text ratio weight of your site. Modern search engines such as Google, Yahoo and MSN love light-weighted Web sites. They want to see your content; the text, not the code. With CSS everything is possible. You can place excessive code into an external file, thus leaving the actual page clean and simple.

Many thanks to Mikhail Tuknov for this informative article.