In our wonderful world of web design there are a million ways to accomplish the same goal, approximately! And that absurdly fictitious number is increasing every day. Instead of one correct way of solving a particular problem we are both blessed and cursed by the abundant choices we have as a web designer. It’s these choices that make designing for the web fun and interesting, while at the same time overwhelming.
We’ve heard about web standards for many years and currently there are still screamingly incorrect ways of doing things with web design. As web designers it is our job to keep up to date with current standards and make sure we do things correctly, this will ensure that our web design will look good now and for many years to come or until such time we need to change thing again to make things current. We used to build web sites using HTML tables and cells but today we use another method of manipulating this language by the use of Cascading Style Sheets or CSS.
CSS is a language that’s used to define the formatting applied to a website or web design, including colors, background images, typefaces (fonts), margins, and indentation. If you’ve never used CSS before, you could be forgiven for thinking, “well, I do all that now with HTML tags. Why would I need CSS?” It’s a valid question that’s best answered with an illustration of the problems that can arise when we define styles using HTML.
At present, a popular design choice is to use a sans-serif font (such as arial, verdana, tahoma, etc.) for the main body text of a site. Since most web browsers default to a serif font like Times New Roman, creating a complex Web page layout using a sans-serif font will often involve a lot of <font> tags. In a complex layout, you might see ten or twenty <font> tags dedicated to applying the same font to all text on a page. Multiply this by five – the number of pages on a modest web site design – and we’re in the realm of a hundred tags. A big web site might have fifty pages or more, in which case you’re looking at a thousand <font> tags, all of them dedicated to applying a basic, consistent style to your web site text.
Now here’s the deal, I’m the web designer and my client calls late on Friday to say, “Verdana is nice, but everyone used it. Let’s use Tahoma instead.” Fancy search and replace tools aside, you’re now faced with the task of adjusting one hundred, one thousand, or even more <font> tags to make what, from your client’s perspective, seems like a very simple change. You can kiss that weekend away you planned goodbye. And try not to groan aloud – it doesn’t go over well with most clients!
Here lays the beauty of CSS it allows the designer to define a style and then apply it to one or more portions of one or more HTML pages using a selector, basically this means that rather than changing one hundred, one thousand tags or more, you just change one style and voila! Your whole web site has a different font. There are many more benefits for using CSS too that include layout etc but I’ll explain all that later.