Lake of The Woods October 2006 (c) 2006 Karin Carlson

Web Standards: Under the Hood of Web Design

This page is intended to give brief explanations, and some links for futher reading, for a few web design topics that have shaped my design decisions, and web design standards to which I try to adhere. I am making notes here both for my clients and potential clients, as well as friends and visitors who themselves are interested in web design and would like to learn more.

Web Standards

An excellent series of point and further reading about what web standards are and why they are important can be found at Max Design’s site: The Benefits of Web Standards. Some of the benefits of using Web Standards include Accessibilty, ease of maintaining the site, and compatibility with future browser upgrades, not to mention pages that load much faster than pages built with two or three times as much code.

Accessibility

To make inroads to making a website completely accessible to persons with disabilities (specifically, but not limited to, visual impairment), titles and alternate text are included with all images, enabling screen-reading software to read a picture when it cannot be seen. Skip links are often implemented which allow screen-reading software to skip reading the entire navigation bar for every page, and go right to the important content.

One check I routinely do for sites is to ensure that people with various levels of colour-blindness can still easily read the content and recognize the links.

A very good on-line tutorial for accessibility is available free from Dive Into Accessibility.

CSS - Cascading Style Sheets

On all sites I develop, including Joomla! sites, I use Cascading Style Sheets (CSS) for the formatting. CSS is widely recognized as the proper way to format web pages, and has been recommended by the W3C since 1996 I firmly believe what I have read over and over on the Net: Cascading Style Sheets are the single most important thing you can implement to make updating your site easier.

Using CSS to apply layout and formatting to a site has many significant advantages over using HTML formatting tags (such as bold, font size, etc.), many of which are or will be deprecated by the W3C. CSS enables faster page downloads, more efficient design modification, and more streamlined site maintenance than coding every page in a site.

The basic idea behind CSS is that instead of having formatting on every page of a website, the formatting only exists on one page, called a Style Sheet. To change the background from yellow to green using HTML tags (the old-fashioned way), one would have to change the coding of all the pages in a site (for this site, that’s 50+). With CSS, I only need change the color in one place on the one page: the Style Sheet. The CSS in this site control not only the colors, fonts, and other formatting, but also where items appear on the page (layout). The pages load very quickly because there are no frames or tables, and minimal Java (only in the footer for the StatCounter software).

Read more from W3C about CSS:

Validation

Validation is the process of checking the HTML and CSS code of a website against a specific set of standards. At the top of each web page the designer puts a document declaration, essentially telling the browser software what language to expect and how exact the designer has been at following the guidelines of that language (HTML 4.01 strict, for example). I validate both the HTML and the CSS for all the websites I design and build. Read about Validation Basics here.

Browser Compatibility

Ask any web designer what their least favorite part of the process is and they might well answer “getting the website to look okay in all the different browsers, especially older browsers and Internet Explorer.” Currently, I strive to have functional, good-looking sites in the following browers/versions:

All contents of this site, unless otherwise noted, © 2006 Karin Carlson. All Rights Reserved.

I recommend SiteGround web hosting