Why XHTML / CSS?

04 February 2009

xhtml and css are technologies for building web pages that not only look good but are accessible and naturally rank well in SERPs. What are the advantages of this technology, and how can it be used to improve the web?

xhtml 1.0 is a web markup language which is interpreted by web browsing devices (such as Internet Explorer, Firefox, mobile phones and other web enabled devices).

css 2.1 is a coding language which allows designer to attach visual styles (element layout, fonts, colors, etc) to to xhtml documents.

What is the web?

The world wide web (or the internet, depending on your preference) is essentially text information linked together via “hyperlinks” that is accessible to anyone using a web browsing device. For most people this device is their computer, using a web browser such as Internet Explorer or Firefox. For others this could be their mobile phone, a screen reader or any other web enabled device.

Throw into this the myriad of images, videos, audio, Flash, Java and other web technologies that people now come to expect from their browsing experience and we have the modern “internet”. But all these things are add-ons, the web (and more importantly the technology on which it is built) was only ever intended to carry linked text.

So we have an essential difference between the way that machines (and by machines I mean things like screen readers and search engines like Google) and humans view information on the net. We see images, videos, flashing lights. Computers see text, all linked together in one giant network. This is the web.

Separating Content & Style

So we have a problem. We need to present our information in a way that is attractive, but also readable by machines. If we want our web site understood by search engine software, screen readers and many other devices that aren’t able to display anything other than basic images we need to be able to separate out those elements and just present the basic text data.

xhtml allows us to write pages of text (and linked in images and other media) and attach visual style as a seperate entity. That way devices or programs that can’t use the visual data can easily ignore it and concentrate on the important inter-linked text data.

So, any other advantages?

Certainly! Because we’re using an external style sheet rather than embedding the “look” of the page within the html document we can change it depending on users needs without changing any of the content!

• Define separate style sheets for screen, print, mobile or other devices.
• Easily provide alternate styling for visually impaired users such as colour blindness.
• Change style elements on the fly, enabling users to increase the size of the text without having a detrimental effect on the overall design.
• Disable the styling altogether, allowing users to apply their own custom styling for their specific needs.

The bottom line

As the web moves forward, and is accessed in an increasingly varied number of ways xhtml and css are core technologies on which the rest of the web can be built. If you want your web site to be accessible, usable and rank well in search engines then xhtml/css is the way forward.