Posts
Podcast #76: Web Accessibility Disasters
Tuesday, November 24, 2009
Dennis and Ross review web sites which should be great in web accessibility, but fail badly. The hosts provide a lot of constructive criticism, including many fixes that can be done in a minimal amount of time. Issues are also good to discuss as a reminder for our own work.
Download Web Axe Episode 76 (Web Accessibility Disasters)
Transcription provided by Katherine Lynch, a Drupal, Wordpress, and accessibility professional.
Chatter
- Web Design Sketchbook give-away
- Dennis presented on Accessible Twitter at the Accessing Higher Ground conference
- TEDxDetroit - technology, education and design
- Excited about WordPress 2.9!
Articles
- W3C WAI: Web Design and Applications > Accessibility: the what, why & how of web accessibility (new site design also)
- Thoughts around universal access on mobile from Accessibility 2.0
- Universities reject Kindle DX as a textbook replacement
- Ebook Accessibility Issues Trouble OverDrive and Adobe
- Accessible Tabs in the new Yahoo Homepage - recreated with YUI3 and WAI-ARIA
- Dolphin Computer Access makes eBooks accessible
Web Site Disasters
Digitalaccessibiliy
Company targeting Accessibility for Ontarians with Disabilities Act (AODA)
The Good
- Almost all of the text is marked up in HTML rather than image, flash or other media.
- Simple, clean design.
The Bad
- No ALT text on main banner.
- Font size tool (triple whammy).
- Underlines not links; links not underlined.
- Headings not marked up appropriately.
- Menu missing <ul>
- List not a list (see Compliance page).
- Inline / intrusive JavaScript.
Job Accommodation Network (JAN)
A service provided by the U.S. Department of Labor's Office of Disability Employment Policy (ODEP). JAN's mission is to facilitate the employment and retention of workers with disabilities by providing employers, employment providers, people with disabilities, and family members with information on job accommodations, entrepreneurship, and related subjects.
The Good
- Textual navigation; no Javascript based navigation.
- Has proper ALT text on pictures and JAN and ODEP logos.
The Bad
- No heading tags; some marked up with bold tag.
- There is a summary on layout table (double whammy).
- No skip nav or skip to link provided.
- Inline javascript. Example: <body onload="P7_ExpMenu()">
- Non-breaking spacing used for layout.
The Rose Project
Mission is to provide maternal and child healthcare to the economically poor people of Malawi, with particular reference to HIV treatment and care.
One of nine listed for Most Accessible Website in the Irish Web Awards?
The Good
- XHTML; semantic, clean mark-up
- Using headings
- Language is defined (xml:lang="en")
- SWFobject.js for unobtrusive flash embedding
The Bad
- When JavaScript is unavailable, Flash replacement image has broken links and placeholder text.
- Skip links - Skip link doesn't work?
- 'Find out about ways to give' button.
- logo missing alt text for tag line.
- H1 headings should be H2 (such as Featured Project).
- Some links that should be underlined, are not.
- Use of <small> tags not recommended.
- Links lack the default focus effect and outline removed!
DO NOT do this:
:focus {
outline-color:-moz-use-text-color;
outline-style:none;
outline-width:0;
}Labels: conference, podcast, review, wordpress
Roundup: Accessibility Links on Twitter
Monday, November 23, 2009
Here's a list of some great links relating to web accessibility going around Twitter last week.
- An excellent, open, web accessibility curriculum from WaSP InterAct (@waspinteract)
- Captioned Interview with Ken Harrenstein (Deaf) and T.V. Raman (Blind) both Engineers at Google.
- AIR 2 Beta, Introducing Accessibility Support
- Automatic captions in YouTube
- Upcoming web accessibility training courses for professionals from the RNIB; 15-19 Feb 2010; Liverpool, UK.
- Input for HTML5 needed: Do you find table summaries helpful?
- Gov 2.0: Transparency without accessibility? Nearly 20 percent of Americans need sites such as Recovery.gov and Disability.gov to improve accessibility features.
Labels: adobe, captions, html5, news, table, twitter, video
Accessible YouTube Sites
Tuesday, November 10, 2009
There are two web accessible versions of the popular YouTube video web site, that I'm aware of at least. (If you know others, please comment.) They are "Easy YouTube" and "Accessible Interface to YouTube".One big issue is that captioning doesn't appear to be supported on either site. I've never worked with the YouTube API (yet), but I'm assuming there are technical blockers here. (Please comment if you know more!) Flash and JavaScript are required for both sites.
Both sites have excellent markup and implement great accessibility improvements. But as with any site, more enhancements can be made. Here's a quick review each.
Easy YouTube
JavaScript expert Chris Heilmann developed this site in 2008. You can search for a video or enter the URL of a specific YouTube video. You can also choose from three video sizes. Excellent documentation and help is provided.Suggestions:
- Missing H1 tag.
- Add highly visible hover/focus states on elements.
- Add captioning support, if possible.
- Implement ARIA.
- Add video comments content.
Accessible Interface to YouTube
This is a more recent accessible YouTube interface. The author is unknown. (I'd like to know who you are as it's very well done!) The interface is very simple yet informative; it display video details and comments. ARIA is implemented, but I have not fully tested it. There's also a survey you may take to help further development.Suggestions:
- Add highly visible hover/focus states on elements.
- Add captioning support, if possible.
- Add controls for volume adjustment.
Free Browsers for Visual Impairment
Tuesday, November 03, 2009
I recently came across an article from disaboom called "Assistive Technology: Top 8 Free Browsers for Visual Impairment and More". The link was also popular on Twitter. But one problem, there are no links to the mentioned browser! So I went and found them:- WebbIE -accessible browser, RSS news reader and more.
- EdWeb - talking web browser that can display web pages as text and symbols.
- Fire Vox - Talking Browser Extension for Firefox (add-on page).
- CliCk, Speak - less advanced version of Fire Vox.
- Orca - speedy and powerful Gecko-based browser.
- Simply Web 2000 - outdated; optimized for Internet Explorer 5.
- SpeakOn -PC-based media suite program (four apps).
- Thunder - package contains the WebbIE Text browser and more.
Disaboom is the leading resource for disability information and real-life articles about people with disabilities. Our broad range of topics, including health conditions, lifestyle, and helpful resources, help you create the life you want.
