Web Accessibility Worries? Give Your Development Effort Fangs.
Fangs is a Mozilla Firefox extension that acts as a "screen reader emulator." Without having to spend hundreds — or even thousands — of dollars on popular accessibility software, small design shops and hobbyists can now get some idea of what low-vision visitors will hear when they come to your site.
Fangs (a spoof on JAWS, the name of the leading screen-reader) works by creating “a textual representation of a web page similar to how the page would be read by a modern screen reader.” Here’s what 8 Ways to Sunday looks like to Fangs:
Not too shabby, though I could really use a link to an accessibility statement up there at the top. Reading it aloud to myself, it sounds like it would be relatively easy to understand and navigate using a screen reader.
Now compare that to the default home page for the Firefox browser — a specially-branded version of Google:
And here we have another reason why table-based layouts suck. Read that out loud to yourself. How many times would you want to hear “Table with four columns and five rows; Table with two columns and four rows; Table with three columns and two rows; Table with one column and one row…”?
Speaking of tables and accessibility, you might also want to grab Juicy Studio’s Table Inspector bookmarklet or Firefox extension. These handy gizmos examine your web page and highlight the accessibility features — such as summary, headers, axis, scope, etc. — of the tables it contains.
Even if you’re properly using tables only for tabular data, you may be surprised how much more descriptive and informative you can make your tables by adding a few extra features to them. For some examples, visit this Juicy Studio post and try out the table inspector on the tables shown there.
Technorati Tags for This Post
Thanks for the eads-up Adam, these look fantastic! Perfect for testing all my sites which by law have to AAA compliant!
Comment by Andy Beeching — April 10, 2005 @ 9:59 am
Glad it was helpful.
As I’m sure you know, a site that comes across well in Fangs isn’t necessarily AAA compliant. Even testing as such in an accessibility validator like Bobby (which is probably the best) is no guarantee.
The WAI WCAG 1.0 spec is vague in some places and defies machine testing in others. Since it sets an extremely high bar for accessibility, this can be frustrating. I have high hopes that version 2.0 will be more developer-friendly.
Frankly I’m glad that here in the US we only have to worry about Section 508. It’s simpler and more concrete than WCAG 1.0, if not necessarily as complete. If I ever develop a site for an organization receiving federal funding, it will be a much easier target to reach.
Comment by Adam Messinger — April 10, 2005 @ 4:14 pm
I agree, I think it’s like 8 out of the 14 points for version one actually have to be manually verified, and bobby has been known to have some flaws. I think a lot of it is interpretive as well. As long as the devloper performs a decent usability testing with disabled people, and makes reasonable allocation for their needs, most companies will be quite safe from any potential legal cases. And yes, I reckon you Americans get off pretty lightly with the 508!
Comment by Andy Beeching — April 10, 2005 @ 4:56 pm
Well, I use Fire Vox (http://clc-4-tts.cjb.net) to test for accessibility myself. I prefer that because it is an actual screen reader and some things that may look ok in Fangs may turn out to not be ok when read out loud by a computer. For example, abbreviations can be a problem if they can’t be understood properly because the text to speech engine’s phonetic rules mangled the pronounciation.
From what I can tell, Fire Vox seems to follow JAWS/Fangs behavior pretty closely in terms of how it announces the various HTML objects on the page. Fire Vox is freeware and open source, so I don’t have to spend a fortune on a commercial screen reader.
Comment by Neider — June 29, 2005 @ 10:37 am
Great tip, Neider. Thanks!
Comment by Adam Messinger — June 29, 2005 @ 1:13 pm