Accessibility—Summer Website Olympics

August 20, 2004

How accessible are the olympic websites? Millions of people will be visiting these pages so how well to they present their information to those that use screen readers, impaired vision, color-blindness, etc. So without further due, Accessibility, it will todays competition and judged on the following: (1) How well a page would presents its content to the disabled? (2) Are appropriate images coded with alt and title properties? (3) Readability and Color Blindness.

This competition is brought to you by Vischeck and Accessify.

Web Reader Ready

The following was judged by turning off style sheets and looking at the order of the code.

Athens 2004 does a good job at displaying the top stories first before the long list of navaigation. No access keys.

Fox Sports Olympics display several navigation items with no simple way to skip to top stories. Medal standings are done with flash making them not as accessible as a standard table. No access keys.

ESPN Olypmics displays top story first along with an easy to follow layout. No access keys.

NBC Olympics is much like Fox’s in that navigation appears first with no way to skip them. No access keys.

Images

Do all appropriate images include alt text that would describe a photo for someone with images off or with a screen reader.

Athens 2004 has all of the alt tags filled in, but the sub-text for each image is basically the same as the text in the alt property. For example, instead of writing “19 August: Sally Newmarch and Amber Halliday of Australia compete in the women’s lightweight double sculls semifinal during the ATHENS 2004 Olympic Games at the Schinias Olympic Rowing and Canoeing Centre. © Ezra Shaw/Getty Images”. The alt tag would be better and less redundant for a disabled reader if it saide, “Photo of Sally Australia’s Newmarch and Amber Halliday rowing at the Schinias Olympic Rowing and Canoeing Centre. 19 August: © Ezra Shaw/Getty Images”

Fox Sports Olympics has empty alt text for their photos.

ESPN Olypmics includes all alt text, simple and short for each photo.

NBC Olympics includes all alt text, but fails to include headline from main photo in the alt text. This photo would benefit with a better alt text like “Headline: Six-cess. Michael Phelps Photo.

Readability and Color Blindness

Readability was based on text size used for body copy and if it was easy to increase size. Color blindess was based on VisCheck’s web pages utility.

Athens 2004 used points to render text size. The body copy is set at 7 point Verdana—I hope my grandma isn’t reading it. Very small text and no easy way to increase size unless you are browsing with Mozilla. Page looks good for color-blindness.

Fox Sports Olympics is set in 11px Arial. No option to increase text size. Page looks good for color-blindness.

ESPN Olympics default is 11px Verdana. Story pages offer a readability tool that allows you to change font and text size. Nicely done Mike D! Page looks good for color-blindness.

NBC Olympics default is 11px Verdana, but no way to easily change size. Page looks good for color-blindness.

After adding the scores ESPN comes out on top with this one. Good job. CSS layouts always make accessibility better, plus that readability tool pushed it over the edge. Over all, all of these sites did pretty good with this competition. It is good to see that more and more websites are taking notice of it.

Accessify Competition

Website	Medal
ESPN Olympics	GOLD
Athens 2004	SILVER
NBC Olympics	BRONZE
Fox Sports Olympics	—

Next “apparatus” will be design.