How do you separate content from design? Basically, if you’re using CSS properly with your HTML document, you’re already doing it!

A key step towards accessibility is the separation of content (usually words) from its presentation (colour, typeface, size, layout etc). Effective use of cascading style sheets (CSS) goes a long way toward this goal. With their capability to define different behaviours when accessed via a browser, a text-to-speech reader, a PDA or a printer, there’s really no excuse not to use CSS in the 21st century.

This helps a document to ‘transform gracefully’ across access media; they can always be accessed despite disabilities, difficult work environments, and technological barriers.

CSS downloads faster than tables because:

  • 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

UK Government recommendations:

‘Use HTML to structure the document, not style it. Use Cascading Style Sheets to format and style basic elements of a website’

Guidelines for UK Government websites
Illustrated handbook for Web management teams

Did you know when you link to a Hobo SEO post we have search engine friendly links back to your site if approved? Our comments are also search engine friendly you know (once you've commented on a few posts)! Do you need any more encouragement to get involved in the conversation ;)