Jul 10 2004
The joy of separating style from content!
I have always had this fascination for CSS. Moving from hard-coding-style-in-HTML-sources to defining-it-in-CSS is like moving from Procedural Programming to Object Oriented Programming. Defining style classes gives a very consistent feel to the whole site [assuming you have defined your style classes properly!] And if you want to change how some of the content looks, all you need to touch is the CSS file. You no longer have to depend on complex search and replace regular expressions.
So, when I wrote the Export to HTML plug-in for Pramati Studio, I made sure the exported HTMLs used common CSS files to set colors and fonts. Changing the colors and fonts in one CSS, changes the appearance of all the sources.
Wanna checkout the layout capabilities of CSS?! How about moving the main content to the right?! Or how about choosing a more tacky theme?!
If you are a firefox user, you can choose an alternate style sheet using it’s style sheet switcher. What’s more, firefox will remember your choice the next time you visit this page!

And if you are one of the 30% visitors, who are still not using the firefox browser, give it a spin:
Apart from the advantages you get from abstracting style into classes, better accessibility is another key benefit of using CSS. The other day I was reading this very neat book on accessibility, called Dive Into Accessibility. I loved the way the content is presented in the context of some "real people" and how they benefit from sites using CSS. In the chapter Presenting your main content first
, Mark points out that screen readers read aloud the content of the HTML source from top to bottom. However, most sites have the navigation links at the top of the HTML source followed by the main content. So a screen reader has to read out all the navigation links before reaching the main content. What a pain! One of the advantages of using CSS is the ability to control the layout of HTML elements independent of their location in the HTML source. So, using CSS we could have the main content of the page at the TOP of the HTML source though it is visually layed out at the center of the page.
It hardly takes any time to read and appreciate the book … but trust me, it takes a whole lot longer to implement it and to get it into your blood! … but then I have made a start! Check out how this page would look to a screen reader or in a text browser [needs to be improved].

















July 12th, 2004
9:22 am PDT
Comment #1