Usable Web Designs
   
Perfecting the art of web design
 

Image Reuse
Variable Text Size
Variable Page Width
Cascading Style Sheets
Download Times
Flash
Colour Blindness

Cascading Style Sheets (CSS)


We use cascading style sheets to speed up page download times, simplify site maintenance, and ensure a consistent look across the site.

Cascading style sheets allow us to create descriptions of the various elements of the page. Those descriptions are centralized in a single file, which is downloaded to the visitor's computer once, and then reused for each page they visit. Having the style information centralized keeps the size of each web site page smaller, and reduces overall download times. Style information includes the choice of font, font size and font colour, as well as alignment (left or right justified, or centered) and background images.

Style examples used in our own web site include:

  • The style of the main body of text.
  • The style of main menu.
  • The style of the usability menu.

Cascading style sheets also simplify maintenance. Let's say you decide to change the font of the main body of text. You can edit the choice of font in the CSS file and upload that file to your web site server. The font is now changed on all the web pages of the site, and all you had to do was edit a few words in the CSS file!

Using style sheets also keeps the look of your site consistent from page to page. To maintain this advantage over time, you must avoid using other forms of style control (such as embedded font tags) in your site's HTML code, when you make your edits, as these override the specifications in the style sheet.