Disney & Other Recent Web Accessibility Lawsuits

It's unfortunate that soon after Disney Parks & Resorts receives an award for accessibility from the AFB, an announcement is made for a Class Action Lawsuit Against Disney Alleges Inaccessible Websites. The lawsuit cites Disney's failure to accommodate blind persons in violation of ADA. Read more in this article by Nic Steenhout (@vavroom): Lawsuit Against Disney For Lack Of Accessibility.
Here are more headlines involving law and accessibility over the last few months, mostly web accessibility:

• Delta hit with $2M DOT disabilities violations fine (February 2011)
• Scarborough woman wins accessibility challenge against federal government (December 2010)
• Accessibility Lawsuit Filed Against JetBlue Airways - Law Office of Lainey Feingold (October 2010)
• Court orders Ottawa to make websites accessible to blind - The Globe and Mail (November 2010)
• NFB files complaints against 9 law schools for inaccessible web site (May 2010)
• Unfriendly Skies? Blind Passengers Sue United : NPR (October 2010)
• NFB files complaint against Penn State University for accessibility problems (November 2010)
• Blind MBA to have her day in court over inaccessible government websites (September 2010)
• Blind Students Sue Law Schools Over Online Applications - Wired Campus - The Chronicle of Higher Education, Wired Campus - The Chronicle of Higher Education (June 2010)

Link Roundup - September 2010

• Bonus! An offer to the HTML5 team to save longdesc by Vlad Alexander at XStandard
• Landmark Technology Access Bill Heads to President Obama's Desk
• Accessibility testing tools (Steve Faulkner, The Paciello Group)
• Response to HTML5 editor on Canvas accessibility (by Rich Schwerdtfeger)
• Adobe’s Andrew Kirkpatrick interviewed on Accessibility in Government (video)
• Accessibility for web writers, part 1: Introduction
• Assistive Technologies for Online Learning
• Web Accessibility day course by RNIB in Edinburgh (Oct) & London (Nov)
• Should Sighted Developers Use Screenreaders To Test Accessibility? (great comments!)
• Using Accessible Twitter With JAWS Screen Reader
• HTML5 Canvas Accessibility in Internet Explorer 9 by@stevefaulkner
• 20 Sites Assessed For Cognitive Web Accessibility
• Top 4 Reasons Why You Need to Address Web Accessibility
• WebAIM Aids eBay Accessibility Efforts
• Blind woman sues Canadian feds over online access
• Very entertaining video explaining closed captions (YouTube)
• Does your website legally need to be accessible? (U.S.)
• Web Design Guidelines for Low Bandwidth
• Web #Accessibility, Structured Negotiations & DOJ Rulemaking
• 10 Tools for Evaluating Web Design Accessibility
• WCAG 2.0 for Usability Specialists presentation (W3C) (April 2010)
• Facebook patent for 'social CAPTCHA' fails on accessibility
• Accessibility and the Law: How good UX can keep you out of court (U.S.)
• Raakt - The Ruby Accessibility Analysis Kit

Critique - New Section 508 Web Site

Below are suggestions for improving the web accessibility of the new United States government Section 508 web site. Well, from analyzing the home page at least. This is basic stuff and I'm very disappointed that the site leaves so much to be desired. The site, which is U.S. government law with rules for web accessibility, should itself be an example of an accessible web site. And with the recent ADA anniversary, this was a great opportunity to move forward in the field of web accessibility. But instead, unfortunately, this was a failed attempt. The U.S. government has a lot of work to do.

Core Issues

• No headings! Not one. Need headings in markup, period. There are many headings indicated visually, but inappropriately coded such as using strong or div tags.
• Labels for text inputs are incorrect; there's a label tag, but no text label! See the search text and email address for news signup.
• Alternative text for many images need improvement such as removing "Graphic for". Better yet, do not use a graphic when it's not needed; text is fine in the following two cases. (Losing the inline style would also be good.)
  • Example 1:
    <img style="border:0" src="/images/508questions.jpg" alt="Graphic for how do I get my 508 questions answered">
  • Example 2:
    <img alt="Graphic for An Official Website of the United States Government" src="/images/official-website.jpg" style="border: 0pt none;">
• No keyboard focus to match mouse hover effect. In addition, a hover & focus could be added in several places to make it more usable, such as the first-level items in the left/main navigation menu.
• The "AddThis" social media feature requires JavaScript and in either case is not keyboard accessible.
• No ARIA implemented, not even landmark roles to help with navigation.
• Links such as "read more >>" have no context; not unique. Also recommend removing the ">" character (better to use CSS for these types of markers/symbols).
• Text links are not clear. The underlines are removed and dark blue not distinct enough from black text.
• Poor progressive enhancement. With JavaScript off, the menu options do not fully display and the content of the slider feature is not displayed.
• Redundant title attributes must go! I'm so tired of seeing this. It's not useful but on the contrary gets in the way; and it creates code bloat. Example: <a href="http://www.blogger.com/..." title="Link Policy">Link Policy</a>
• The placeholder email content is confusing. The example is not even a valid email address (missing the top-level domain). The feature can be done with unobtrusive JavaScript and even use the label text, if it existed.

Other Issues

• Horizontal scrollbars in 1024 resolution. Need better resizing/width design.
• Lots of CSS in header (and inline); much better to use external file.
• The attribute language="JavaScript" not needed in XHTML.
• Why display the date? Just adds to cluttered screen.
• Print button not needed. Just adds to cluttered screen. Requires JavaScript.
• Conditional comment for IE6 CSS should be in head, not body.
• Text resizing tool not needed; let the browser do this! And clutters screen.
• Some navigation items use lists while others do not.
• Image need better optimization/compression. One image alone in the slider feature is over 150k and can easily be compressed to 35k.
• 67 XHTML validation errors.

Link Roundup - June 2010

• Simple Free Online Caption Creator for YouTube Videos
• Australian Government releases Web Accessibility National Transition Strategy
• Open Web Camp 2010 at Stanford University, Palo Alto, California, July 17 (Free)
• Assistive Technology Conference in Indianapolis, Indiana, July 29-30 (Free)
• Online version of book Just Ask: Integrating Accessibility Throughout Design
• 50+ Reasons to Use VoiceOver (from Apple)
• AJAX and the Problem of Web Accessibility by @JoeDolson
• HTML5: Techniques for providing useful text alternatives (W3C)
• How NOT to use the HTML title attribute by @ianpouncey (from January)
• Forthcoming Updates on Federal Section 508 Rules by @JoeDolson
• Chrome explains its partial screen reader support
• Princeton University and learning disabled student settle suit
• Blind students sue four California law schools over inaccessible online applications
• What AT devices announce when encountering ARIA roles
• AViewer beta - new accessibility checker tool from The Paciello Group
• Making JavaScript Accessible slides presented by @dennisl at Bayjax meetup
• How to get started on Twitter with JAWS - CNIB blog by @mcourcel
• Examples of Inaccessible Web Design
• Sign petition for Google to make Chrome screen reader accessible
• Features of a Cognitively Accessible Web Site
• How to Use HTML, CSS and JavaScript in an Accessible Manner
• Web Accessibility and WAI-ARIA Primer by @emilylewis
• Writing text alternatives for maps
• Future Web Accessibility: SVG from WebAIM
• List of Twitter clients for persons with disabilities
• U.S. Departments of Justice and Education tell college/university presidents that required electronic book readers must be accessible

Walmart's Poor Alt Text and Use of Flash

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:

<img src="http://i2.walmartimages.com/i/if/spacer.gif" alt="The Walmart.com site includes Flash technology. To avoid interruption of software designed to aid visually-impaired people, please turn off your Flash player." border="0" height="1" width="1" />

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.

1. A spacer GIF? What is this, 1998? This is a badly outdated and poor practice.
   
2. 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.
3. This message was meant to be vital to the user (particularly if blind), and thus should not be stuffed in an ALT attribute.
4. 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.
5. 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.)
6. 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).
7. 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.