I'm in the process of converting our portal (Fellowship One) site template to a standards-based css layout. Concise, simple and semantic markup is my goal. Recently I had a "duh" moment while pondering the benefits of css.
A lot to love..
There is a lot to love about css:
- seperation of content and style
- accessibility
- code reuse
- flexibile
- scalable
- diversity amongst devices (media, print, screen)
I know...I'm very much stating the obvious.
But what I failed to mention...
And this is my "duh" moment: SIZE.
The difference in the amount of markup it takes to create a table-based layout compared to a css-based layout is staggering. Let me share with you a few stats from my portal template re-write. (The following pertains to the template only.)
| |
Current |
CSS |
| Lines of markup: |
287 |
66 |
| File size: |
60K |
8K |
This blew me away. I knew much would be gained from moving to css but I did not realize how much we would gain in reducing page size. In listing the pros of css, amount of markup will always be near the top of my list.