Learn CSS from the pro’s
When I started developing for the web again about a year and a half ago, I found myself messing around with tables and frames. These were the presentation tools which I remembered from way back in 1995 when I first delved into the world of html and web development. I didn’t really know where to start, when it came to the presentation of my sites. Before long I got frustrated with the presentation of my first couple of pages I built for my blog. Then my friend Daan mentioned the magic acronym… CSS. Cascading style sheets are a standards compliant way to handle the presentation of your web pages, not only does it save bandwidth because the presentation is separated from your html, but it also simplifies a site redesign immensely.
The problem I had when I first heard about CSS was, how does it work and where can I find useful resources to help me learn css. As it turns out the best css tutorials are all around us. Go to any modern standards compliant website (My favourites were www.apple.com, www.kottke.org), and view the pages source of the site. Near the top of the html you will most likely find 1 or more lines with the following text,
<link rel=“stylesheet” href=“/css/sitestyle.css” type=“text/css”/>
All you have to do is copy the filename (in this case /css/sitestyle.css) and paste it into you browser after the site url (e.g. http://www.somesite.com/css/sitestyle.css) and the css for the site will open in your browser [1]. Now you can analyse [2] the css along with the xhtml of the site to learn exactly how the site presentation of the site is achieved. After analysing a couple of sites you like, you will be ready to start writing your own css and xhtml to develop the presentation you want for your site.
[1] Some sites protect their css, but there are more than enough well designed sites out there to find useful css.
[2] Note that I say analyse the css, not steal the css.
