CSS, if you don’t know, stands for Cascading Style Sheets. They have been around for many years now, but still haven’t quite caught on in the mainstream applications – Frontpage and Dreamweaver still have only limited support for them.
One thing that stylesheets enable the webmaster to define how a certain block of text will look on every single page, so if the webmaster needs to change the size or font of the text, instead of editing every single page, they can simply change the values in the CSS file.
Over the last year, many professionals and enthusiasts have realized that you can actually use CSS to create complex website layouts without needing the traditional HTML table tags such as ‘table’ ‘tr’ ‘td’
The biggest advantage that using tabless layouts has is it becomes a whole lot more search engine friendly. This is because there is less HTML code in the webpage as everything is defined and positioned in an external CSS file (which search engine spiders don’t read). This means they are able to pick up your content and keywords much better 🙂
To illustrate just how much smaller in size a CSS website can be compared to a normal HTML website I have uploaded an example of the same design, but one in CSS and another in HTML:
CSS Webpage – Size: 7KB
HTML Webpage – Size: 19KB
That’s a 12KB difference for the exact same design!
The downside to using tabless CSS websites is that they are pretty difficult to edit for the average Frontpage user like me. If you need to change a column width of a webpage in frontpage, you just click and drag until the column is the width you want it. Since the columns are defined in an external CSS as fixed or relative sizes, there is nothing to ‘click’ and you don’t get any visual representation of what you are editing – you must manually type in numbers until you get to the size you want.
This of course can be very time consuming, not to mention stressful as things behave unexpectidly or in a way simply to annoy the hell out of you. I really don’t know why Microsoft or Macromedia (or any other software company) haven’t come up with a point and click CSS editor yet – it can’t be that hard. One thing is for sure, if there still isn’t any point and click CSS editors in 6 months time, I’m just going to develop my own!
If you are not keen on developing a new website from scratch in CSS (and lets be honest, who is?!), then I suggest you check out the following links:
Yahoo Grids – Ready made “fill in the blanks” grids or website layouts that can get you started right away. You don’t need to worry about how you are going to make the layout, they are already done.
4Templates – If you require something a little more professional, then these should be sufficient. 4Templates now ships a CSS (XHTML) version of the template with each order.