How CSS Makes Your Site Google-Friendly

October 24, 2008

Cascading Style Sheets (CSS) is a simple and convenient tool for web developers. CSS allows developers to separate the aesthetic elements of a page including color, fonts, and layout, from the page’s content such as body text and images.

Separating content elements from the style elements gives developers more control over how search engines like Google can crawl over their web pages.

The 3 points below explain why using CSS allows your site to fare better in Google:

1. CSS minimizes page loading time
Along with other search engines, Google prefers web pages with smaller file sizes. Although no search engine optimization rulebook has set a limit, the SEO community recommends 100 KB as the maximum page size, while less than 100 KB is the ideal.

Coming up with a cool site that accommodates a decent amount of content usually requires many lines of HTML code. But if you can remove the styles from the HTML and put them instead in a standalone style sheet like CSS, then you can just import the standalone style sheets into the HTML. This reduces the length of HTML code and keeps page sizes to a minimum.

2. CSS gives you better control of your pages’ structures
Google appreciates well-structured pages because structures help Google index and crawl over the pages. Google has structure standards and design guidelines that serve as reference for web designers. However, Google hasn’t included these as strict requirements.

Some developers mistakenly think that adhering to Google’s guidelines and standards will make their website look drab. Making use of CSS can strike a balance between accommodating Google’s structural preferences and the web designers’ creativity. When it comes to design, CSS pages can be at par with Flash-based pages while maintaining a structure that can easily fit into Google’s index system.

3. Using CSS allows hidden content to be indexed by Google
Using CSS can allow you to limit content visibility. There could be text that you wish to be viewed only in the printable version of your webpage, or content that you want to be part only of page navigation text. CSS will put these lines of text where you want them while allowing Google to crawl over and index them. This increases your probability of inclusion in search engine results.

CSS ease and function
The initial attraction of most web developers to CSS can be attributed to the simplicity of the language. The more they use CSS, the more benefits they realize they could gain from it. Learning the language can take you about 4 days to a full week. However, the long-term rewards certainly give justice to the time you spend learning CSS. There are plenty of online resources that can help you start learning CSS. Help is also widely available online when you’re ready to take your CSS skills a level higher.

Remember that Google rewards websites that are easy to index. CSS gives you the freedom to out-style your competitor’s website while making sure that Google can index your website. CSS gives you the perfect blend of design and search engine optimization.