CSS walk-through tutorial

Snippet of CSS code
Snippet of CSS code.

For those who’ve ever wanted to get into Cascading Style Sheets (CSS) coding, but never quite got around to it, or couldn’t quite grasp what it was all about; or perhaps you just want to know what it is that some of us coders are going on about, Albino Blacksheep’s Live Design tutorial is for you.

What is CSS?

In recent years there has been a drive to separate the content from the design of web pages. That way updates to the look of a site can be made quickly and efficiently. This is done largely using Cascading Style Sheets: text files that explain to the web browser how to present the information on a page, eg make all links blue and underlined, make all headings black, Arial and 24 pt, etc. That way one change of the code in one file can update the look of an entire website.

There is a really good introduction to CSS at www.cssbasics.com. To see a website being transformed step-by-step with CSS look no further than Albino Blacksheep.

In 18 steps Albino Blacksheep (for that must be his/her name) walks visitors through the redesign of the ABS website.


You can see how ABS started like this, with a basic, ‘no-frills’ marked-up page…



… to this, graphically pleasing offering. Using nothing more than the power of Cascading Style Sheets (CSS).


CSS Zen Garden

Another impressive site, for those who’re unfamiliar with it, is the CSS Zen Garden. The premise of this site is that within each design the HTML page code is always the same, all the designers are allowed to change is the CSS file. Impressive stuff.

Published by

Gareth Saunders

I’m Gareth J M Saunders, 52 years old, 6′ 4″, father of 3 boys (including twins). Enneagram type FOUR and introvert (INFP), I am a non-stipendiary priest in the Scottish Episcopal Church, I sing with the NYCGB alumni choir, play guitar, play mahjong, write, draw and laugh… Scrum master at Safeguard Global; latterly at Sky and Vision/Cegedim. Former web architect and agile project manager at the University of St Andrews and previously warden at Agnes Blackadder Hall.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.