Wednesday, August 15, 2007

Taming CSS

For those of you who are not familiar with CSS, or Cascading Style Sheets, let me give you a little lesson. We'll call it CSS-101.

In the early days of the internet, web pages were built using basic HTML. HTML basically used a table format or rows and columns to format the way the page looked. As web pages became more complicated and began to use more graphics, flash and media, it became apparent that something more was needed.

CSS breaks away from the table format. Basically you put your contents into boxes and tell the boxes where they should be placed on the page. While the content is contained on your html page (now XHTML), the instructions for formatting and placing is located on an external .css file, which is loaded into the html page.

So I've been fooling around with this for the past year or so. At first I used CSS just to format my text styles. But lately I've been trying to get better search results for my sites, and that's where css can really help out. By reducing the amount of code required in a tables format into a css format, there is less clutter on your page for the search engines to go through.

The first big change was to the Omni site. Initially this site was built as a cient portal using ColdFusion for the data base. The design was an afterthought and lacked any real content for the search engines. A couple months ago the site was redesigned by myself and co-workers Dan Upbin and Daniel Maxwell. Daniel used a combination of CSS and tables on the pages, which worked well enough. But even those pages, with the flash showcases and all, had too much clutter.

So I took up the challenge and redesigned the site. There are still some tables in there but the flash has been eliminated and the code has been optimized. The next step is to rewrite the text content for SEO.

All of this work with CSS has helped me with my other sites as well. Of course there are still instances where I can't use CSS. Unfortunately some of the older versions of browsers, especially Internet Explorer, do not work well with CSS and require 'hacks' to fix these 'bugs'. It's very difficult to write css for every version of every browser, especially since I don't have the old browser versions anymore. When my client, Kilalu Luxury Homes, viewed their new site on an old AOL version, the layout broke up and they wanted the site to work in all browsers. In this instance I had to re-write the html code for tables.

Sometimes you just can't win.

Labels: , ,


Post a Comment

Links to this post:

Create a Link

<< Home