CSS - Design Benefits

CSS (Cascading Stylesheets) design is about laying out web pages by grouping and positioning items, and not using tables to present information.

"After switching to a CSS layout our average page size decreased by 60%" - Alex Walker, SitePoint

CSS design is extremely important and has numerous benefits:

Fast download time

CSS downloads faster than tables because:

• Browsers read through tables twice before displaying their contents, once to work out their structure and once to determine their content
• Tables appear on the screen all in one go - no part of the table will appear until the entire table is downloaded and rendered
• Tables encourage the use of spacer images to aid 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 cached (stored) on the user's computer; table layout, stored in each HTML document, must be loaded up each time a new page downloads
• With CSS you can control the order items download on to the screen - make the content appear before slow-loading images and your site users will definitely appreciate it

More accessible

The number of users browsing the web through handheld devices is growing massively. In 2008 alone an estimated 58 million PDAs will be sold (source: eTForecast) and one third of the world's population will own a wireless device (source: ClickZ). You can make an additional CSS document specifically for handheld devices, which will be called up in place of the regular CSS document. This is not possible with a tabular layout.

More search engine-friendly

Search engines can often spider CSS-driven web pages more easily as they usually have simpler, better structured HTML code. The search engine can then make a more educated guess as to what the web page is about, so all other things being equal, your web pages will appear higher in the search rankings with a CSS layout.

Print-friendly

When a user chooses to print a web page an alternative CSS document can be called up. This document can specify that formatting, images and navigation disappear and just the page content appear on the printed version.

For more information visit www.webcredible.co.uk.