A Little CSS Goes a Long Way

Using HTML tables to control layout is still something we see, but there's a MUCH better way: CSS.

Why CSS?

The key reason for using Cascading Style Sheets (CSS) is simply to separate the content of a document and the markup that describes that content (HTML/XHTML) from the formatting that tells the content how it is supposed to look and where (or even if) it is to appear on a page. 

As web browsers have become more and more compliant with industry recommended standards, it has become much easier to fully utilize the power of what CSS can do to create websites that load faster, are more easily redesigned, and are more cleanly coded for search engine optimization. CSS also improves accessibility for screen readers and other tools designed for users. 

Why Separate the Content from the Markup? 

The advantage of separating the content of a page from the presentation is it becomes increasingly easier to present that content in multiple ways. 

For example, a bit of CSS code can display the same content as beautifully laid out and branded one way in a web browser and another way – without graphics or navigation, for example – when the page is printed. CSS also enables reformatting for the smaller screens of our increasingly ubiquitous handheld devices. 

CSS is Efficient 

Since most style sheets are maintained in a handful of files separate from each individual web page, updating the appearance and layouts of an entire site becomes a breeze because you update one file to implement site-wide changes. 

That isn't to say that using this kind of layout is a complete walk in the park. Getting pages to display uniformly across the many different web browsers and operating systems available is easily the toughest job for a style sheet developer. While all modern browsers do support CSS, the implementation is not always up to the recommended specifications. Most notable is Internet Explorer 6, which is notorious for being more than a little quirky in the way that it renders style sheet values. Thankfully, this nearly 9-year-old browser (a veritable Methuselah in internet years) is finally being supplanted by the much more CSS-friendly versions 7 and 8.

You can learn the basics of CSS at w3schools.com. 

Posted by Andy Wetherill, Front-End Developer