Mikhail Tuknov, founder of Infatex.com, sent in this article on CSS and its importance in search engine optimization. I found it to be a basic and ‘to the point’ read on how CSS can cut down on load time, cross browser compatibility and code cleanliness.
As the holiday season approaches, Search Engine Journal will be posting more of these basic SEO tutorials. If you would like to contribute to the mix, please contact us using the form on the lefthand sidebar.
Benefits of CSS in Search Engine Optimization
Cascading Style Sheets (CSS) is a style sheet language that permits web designers to attach style like spacing, color, font, etc. to HTML documents. Cascading style sheets work similarly to a template; permitting web developers to label style for an HTML element and after that 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 layout to specific fonts and styles.
There are many benefits of using CSS. One of the major benefits of using CSS is the easy maintenance of the website. Maintenance of a website made with CSS is much easier compared to the ones which are table based. CSS splits the presentation style of documents from the content of documents and makes the maintenance of the site easier. Aside from being able to make site extensive changes with no trouble through one CSS file, the clean code it generates makes it easier to update. Webmasters can characterize the appearance of a site in one place, and change the whole site by changing just one file. 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. So, if you have to alter the color of all pages in your site, you only have to edit one style sheet. This saves you enormous amount of time, particularly if you have to edit each page independently. CSS generally requires less code compared to table based. This makes your code lighter and cleaner. Clean code makes a huge difference in maintaining your site.
Cascading Style Sheets Benefits and Search Engine Optimization (SEO)
Another major benefit of CSS is that it makes your website SEO friendly. The reason behind this is simple. The search engines spiders are actually very lethargic. They do not go through the bundles of HTML codes to get to the indexed codes. Font tags and tables make the HTML code very cumbersome; thus, reduce the accuracy of the results. If you use external CSS files to design and determine the design attributes; the HTML code will be clean and it will result to better search engine rankings. With some knowledge of CSS you will be able to change the code layout without destroying the actual 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 website; thus will help to show search engine crawlers the importance of your content. I personally saw a huge boost in rankings in fully CSS web sites. When I look at someone’s website that was built using old school HTML code with tags such as: TABLES, TD, TR, FONT and so on, I feel awkward and immediately convert that site to a fully table-less CSS layout. There are many tools on the Internet that shows the actual code over text ratio weight of your site. Do you know why? Because modern search engines such as: Google, Yahoo and MSN love light-weighted websites. They want to see your content; the text, not the code. With CSS everything is possible. You practically externalize excessive code into external file, thus leaving the actual page clean and simple.
CSS makes your website more accessible. The number of users browsing the web through hand held devices are continuously growing tremendously. It is estimated that by 2008, one third of the world’s population will be using hand held devices for accessing Internet. It is always important that your site is accessible to them also. You can make an additional CSS document particularly for handheld devices like cell phones, which will be called up in place of the regular CSS document; which is not achievable with a tabular layout. CSS benefits accessibility chiefly by separating document structure from presentation. By separating style from markup, webmasters can simplify and clean up the HTML in their documents, making the documents more accessible.
Increases Download Speed of Your Website
CSS code downloads faster than tables. Browsers read through tables twice previous to exhibiting their contents; first to work out their structure and then to determine their content. Moreover, tables are shown on the screen as a whole, no part of the table will be displayed until the entire table is downloaded and rendered. Tables support the use of spaced images to assist with positioning. CSS generally requires less code than cumbersome tables. All code to do with the layout can be placed in an external CSS document, which will be called up just once and then stored on the user’s computer; while the table layout stored in each HTML document, must be loaded up each time a new page downloads. Also with CSS, you can manage the order of the items downloaded into the screen. You have the control to make the content appear previous to the slow loading images, which is liked by most of the web users.
Cross Browser Compatibility