Website QA Quick Reference

TOOLS

There are some tools that are critical to ensuring the quality of websites we produce. These should be used at the beginning and end of the QA process.

The W3C Link Checker will recursively check the site’s links and make sure that all are valid. It will also check redirects and give pointers on how to improve them. This is quicker and more reliable than clicking the links yourself, although it’s a good idea to go through and do it yourself to make sure that pages link to the right page (as this will check if they are valid but not if they match the link text).

Make sure you check off “Check linked documents recursively”. This will make sure that it will follow links found on inside pages.By the end of QA, this test should pass.

The W3C Markup Validator ensures that the source code complies with XHTML standards. You will want to run this on all pages of the site (or a random selection if all is not possible). Invalid XHTML affects SEO, cross-browser compatibility, and rendering speed. By the end of QA, this test should pass.

During the QA process this tool is useful to ensure that we have the appropriate meta tags, semantic markup, etc that we need to ensure successful SEO.

YSlow analyzes web pages and suggests ways to improve their performance based on a set of rules for high performance web pages.

BROWSER CHECKLIST

Every item should be checked in each of the following browsers. The bolded browsers should receive the most attention if equal attention cannot be provided.

Firefox 2 (Windows)

Firefox 3 (Windows)

Chrome (latest version) (Windows)

Internet Explorer 6 (Windows)
Specifically look out for in IE6: transparency, drop-down menus

Internet Explorer 7 (Windows)

Internet Explorer 8 (Windows)

Safari (latest version) (Mac)

Firefox 3 (Mac)

WHAT YOU SHOULD LOOK FOR

At minimum you should cover the following issues:

Content

Titles, headers, and navigation are labeled correctly

There are no unescaped special characters. (they look like a box with a ? inside or a blank box and commonly creep in from pasting characters such as: ‘ – “)

Graphics and Layout

Image Quality (JPEG artifacts should not be visible. Images containing text should be PNG or GIF format, not JPEG.)

Download Time (Page should download in a reasonable amount of time. Firebug and ySlow help with this testing.)

Text Layout (text should be readable and should not overflow itself)

Color Accuracy (colors in Safari should match colors in Firefox)

Browser Compatibility

Use Browser Checklist to ensure compatibility across browsers and platforms.

Accessibility

Skip Links for screen readers should be at the top of the HTML

Tables should be used for tabular data only

All images should contain an alt tag

Site operates at some level without Flash installed

Site operates at some level without Javascript enabled

Site should fit in 1024x768 resolution display

FILING A TICKET

You should try to include as much of the following information as possible:

Written description of the issue

Steps needed to reproduce the issue

Platform(s) (Windows XP / Vista / OS X 10.5 etc)

Browser(s) with version number (Firefox 3)

Screenshot

Related tickets (ie. if another issue is causing this one it may not be necessary to solve this issue specifically)