Colophon

Usability

This site is coded according to to XHTML-Transitional 1.0 standards and also complies to standards of CSS 2.1. It includes plugins from the jQuery library and utilizes PHP 5 technology.

I have built this website to be compatible with the latest versions of Firefox, Safari, Chrome and Internet Explorer 7.0 and up. The following is a list of accessibility features built into this site:

  • All links include reference to the action the user will make. Instead of "click here" a link might be titled "view portfoio". This results in less thinking time for the user.
  • All links are standard color and style. The only exception to this is the articles section on the home page and the navigation bar at the top of the page for obvious design reasons that do not effect usability.
  • Page content is clearly identified using clear titles and headings.
  • Navigation is simple and easy to understand. All items have simple names that explain well what they are.
  • All content has been optimized for search engine crawlers.
  • Site is built on a 960 grid system which ensures the maximum content width is 960 pixels. This makes viewing the page more accessible to a wide variety of viewers.
  • Content structure uses headers appropriately.
  • All content is accessible with a minimum number of mouse clicks.

Accessability

Many elements of this site are based in accordance with the accessability guidelines set forth by WCAG. This means the site is accessible to those who are disabled or less able, and functions well for those who suffer from common problems such as color blindness. Below you will find a number of accessability issues I have taken into consideration while designing this site.

  • All images, form image buttons, and image map hot spots have appropriate, equivalent alternative text.
  • Form inputs have associated text labels.
  • Semantic markup is used to designate headings (<h1>), lists (<ul>, <ol>, and <dl>), emphasized or special text (<strong>, <code>, <abbr>, <blockquote>, for example), etc. Semantic markup is used appropriately.
  • The reading and navigation order (determined by code order) is logical and intuitive.
  • Instructions do not rely upon shape, size, visual location or sound.
  • Color alone is not used to distinguish links from surrounding text. Links are alos underlined until hovered.
  • The page is readable and functional when the text size is doubled.
  • Blocks of text over one sentence in length are no more than 80 characters wide, are NOT fully justified, have adequate line spacing and paragraph spacing, and do NOT require horizontal scrolling when the text size is doubled.
  • All page functionality is available using the keyboard
  • Each internal page has a descriptive and informative page title.
  • The navigation order of links, form elements, etc. is logical and intuitive.
  • The language of the page is identified using the HTML lang attribute.
  • When a page element receives focus, it does not result in a substantial change to the page, the spawning of a pop-up window, an additional change of keyboard focus, or any other change that could confuse or disorient the user.
  • Navigation links that are repeated on web pages do not change order when navigating through the site.

Twitter Updates

Follow @prestondlee

Not a fan of twitter? You can also connect with me on Facebook or LinkedIn.

From the Blog

Visit the blog | Grab the RSS feedGrab GDB RSS feed

Get in touch

Send an email below or a DM via twitter.