The Future of Design
The days of the design hack are drawing to a close as more and more people are using browsers that support style sheets. No longer do designers have to hide their content within tables just to recreate an effect that could just as easily be created using style sheets. There has never been a better time to separate web content from web design.
Why Split Content from Design?
There are many reasons why you would want to do so, but they pretty much boil down to three main benefits.
- To clean your code, making it more readable, faster to download and easier to work with.
- To speed up design changes, changing one style sheet is quicker and easier than changing something on all your pages.
- To prepare for the phase out of HTML in favour of XHTML/XML.
Wouldn't it be nice to be able to work on the content of your pages without worrying too much about getting it to look right first time? Or be able to have a background image for all your main headers without having to resort to using a table to get the effect? Even a simple HTML page that has no obvious styles applied to it can look very different with the clever use of a style sheet.
Why start now?
There is no better time than the present to have another look at your pages and seeing what can be converted to style sheets. A high percentage of web users are using a CSS capable browser that you can certainly use some of the more common style sheet tricks to liven up your pages.
Obviously the newer the browser a visitor has, the more likely you are to be able to do more in terms of CSS design. As a general rule of thumb, version 5 browsers and above will support the bulk of the effects that you will need to recreate your page layout using only style sheets.
Of course, not everyone will have the full support that your style sheet design will require, but there are ways of dealing with the problem. The Web Standards Project is taking the radical approach of trying to convince those still using older browsers to upgrade, recommending that site owners offer a "no frills" version for those that don't upgrade. If you really value your visitors, you may be tempted to find the time to ensure that your site looks great in all browsers, but if only a small handful of people actually get to see it in those browsers, is it really worth the effort?
Move over HTML, XML coming through!
HTML as a language has evolved as far as it will go, there will be no version 5 of the HTML doc type; XHTML has officially taken over as the next standard. XHTML is the name given to the HTML compatible version of XML; while XHTML and HTML look similar at first glance, there are subtle, but important differences.
- All XHTML tags must be closed, even empty tags such as images or line breaks.
- All attributes need to have values; all values must be in quotes.
- All tags are recommended to be in lower case.
- The use of character entities is important to avoid confusion (e.g. & instead of & for text and links).
- No XHTML support for non-standard HTML elements such as blink or marquee.
- XHTML has much stricter validation rules.
Taking the time to convert your HTML into XHTML could seem tedious, but it will help you take one step closer to the ultimate separation of design and content; using pure XML.
Once XML has better browser support, it will help evolve the way we design pages. We will be able to add more meaning and structure to our data; so rather than using a table to display details of a book, we can create a tag that tells the browser it is a book and the properties of it. Styles will determine how it is displayed, but the same page data can be displayed differently to different people; this will improve accessibility for sure.
One major advantage of using XML for building web pages is the fact that it will give more meaning to the content and should go some way to making search engine results more relevant. If you are looking for a certain book author, then you need only search for details that are located within a book tag (in theory anyway).
How long this transition will take depends on how quickly site owners are willing to take up and implement it; having said that, it does look like XHTML/XML and style sheets are the way forward for page design!