Yesterday, Steve Faulkner of The Paciello Group wrote a tweet quoting an alt attribute on the Walmart.com home page. My first reaction was disbelief, frustration, and outrage.
I replied to the tweet, then found the following code (line 2421) which Steve was referencing:
The message was designed for screen reader users. But just this one line of code is so wrong on so many levels including the following.
- A spacer GIF? What is this, 1998? This is a badly outdated and poor practice.
- Alt text is too long; I suggest under 15 words. Or, include the text as part of the main page or use some kind of “D” link.
- This message was meant to be vital to the user (particularly if blind), and thus should not be stuffed in an ALT attribute.
- Many people with visual impairments may not be blind, but have “low vision”, and thus may not use a screen reader. These individuals could use a screen magnifier or simply enlarge text with their browser.
- Law: Walmart is a very large corporation providing sale of goods nationally; this means that they are a great “Target” for a lawsuit, excuse the pun! (If you don’t get the joke, read about the NFB vs. Target lawsuit.)
- The use of Flash in itself is highly debatable. One can write a book about this point, but basically, Flash requires a proprietary plug-in, usually not developed with accessibility, and is not supported on many modern user agents such as the iPhone/iPad (not to mention many others including text-only browsers).
- How does one turn off his Flash player, anyway?
Solutions
Immediate: Provide HTML alternative to content.
Better: Use accessible Flash and provide an HTML alternative to content.
Best: Use HTML only for content. Implement with web standards, progressive enhancement, and DOM scripting, to create the same visual effect as the original Flash. This will not only make your content accessible, but will also make the site lighter and faster and is also good for SEO.
4 replies on “Walmart’s Poor Alt Text and Use of Flash”
Well I agree with points 6 & 7 but not so sure about the others.
1) Spacer.gif is not being used as a spacer (despite its name). It is being used to communicate information to screen reader users only. I have been recommending this technique and if it is a poor technique I’d like to understand why and better alternatives.
2) Agreed the text is too wordy but a limit of 15 words is arbitrary. Length should depend on importance and context.
3) How would you implement this message?
4) Not sure how this message applies to non-screen reader users.
5) Obviously this is a shortcut to avoid the extra effort of doing accessible Flash -but I doubt that this will get them sued.
FYI… I signed my previous comment “Steve”. Just want to be clear, I am not Steve Faulkner.
-Steve
Steve, good questions. Here are my replies:
1) Requires extra bytes, additional download element, limited display in browsers; can use normal text instead which may be hidden offscreen.
2) If the description is lengthy, alt is not appropriate. See WebAIM’s info on long descriptions.
3) I *wouldn’t* implement this message in the first place. I’d write the code with progressive enhancement and ensure everything is accessible.
4) Just pointing out the inaccuracy; not all “visually-impaired” users are blind.
5) If the content is not accessible, that will get them sued. And the Flash is not accessible, nor is there any alternative content.
Spacer.gif always leaves me chuckling. The first time I heard a screen reader was a Danish language version. The site was for the National Radio and it was stuffed with this fillers. The screen was black so people with sight weren’t tempted to look at anything. I asked what was that “spa-sear-gif” thing that was rattled off in this metallic voice? Simple solution was to navigate away from the page forever. However, it was the government sponsored radio, meaning it was obligated to provide public service information to all citizens. So it chose to drive the blind crazy with bad code! Yikes. I laughed. Then I cringed.