Web Accessibility Summit at UF
Monday, October 04 2010 @ 02:19 PM EDT
Last week, the University of Florida Web Administration team hosted the Environments for Humans - Web Accessibility Summit 2010 (#a11ysummit on Twitter). I was able to attend at no cost to my department. Being a UF employee has its perks from time to time.
It was a great event with very knowledgeable speakers. The three big take-aways for me:
- Valid HTML 5 is easier to write than XHTML.
- Accessibility is not just for humans with disabilities. Search engine crawlers such as Google are "blind". Touch devices such as Apple iPad and Android are only going to become more common.
- Standards compliance does not equal Accessibility!
“Accessibility and HTML5”
- Reality: Only 5% of web pages on the Internet are compliant to HTML standards (according to a survey by the Opera browser folks)
- Reality: Validation is painful, writing "valid" (X)HTML is too hard for most people.
- Valid HTML 5 pages are very simple compared to previous standards. It should be much easier for web developers to write valid HTML 5 pages.
- The following is a simple but valid HTML 5 web page:
- HTML 5 relaxes a lot of rules, such as quotes around elements.
- New elements help with semantics of the page (header, article, aside, section, ....). New features to deal with common web site components such as audio and video, such as multiple source attributes (e.g. sources can include .mp3, .ogg, .wav and browser will find the one it is compatible with).
- Video Codecs are still problematic. There are no universally supported video codecs yet.
Progressive Enhancement with ARIA”
- WAI-ARIA is an attempt to make the web experience as good as the desktop experience. Currently a working draft.
- Progressive Enhancement means an improved browsing experience based on browser capabilities. e.g. The web site works with very simple browsers but as browser capabilities improve the site will have improved experience.
- Accessibility is not just for humans with disabilities. Search engine crawlers such as Google are "blind". Accessible web pages are searched more effectively.
“Accessibility and Compatibility”
- Standards compliance does not equal Accessibility! It is possible to have completely valid code that is not accessible.
- All images that have alt text should present CONTENT and FUNCTION, very rarely a description. Use
for images that are not important to the meaning or content of the page.
alt = ""
- Images that are the only thing within a link MUST have alt text.
- Use buttons to submit forms, not links.
- Pave the Cowpaths. e.g. if you look around a college campus... students find the shortest paths. Turn those dirt paths into sidewalks. Look at your site usage stats.
- Hover / mouseover is DEAD for conveying critical information. Modern touch devices (iPad, Android) do not have hover capability. Many types of access do not have hover capability.
- Use "Skip to main content" links.
Slides: Not available. Too bad, lots of good code examples were shown.
- A sample site: http://www.jkrowling.com/
- Learn to love liquid layouts. Allow user to increase width of browser window, increase font size, etc). There are lots of tricks to accomplish this. She gave lots of examples with code (such as "Flexible Faux Columns", "Jello Layout", "Em-based Layout", ...).
- Put the banner image in the background of a banner div.
- The clickable area of an anchor tag can be much larger than just the text.
- Images specified in ems instead of pixels will re-size with the layout as font size is increased.
- Don't count on color alone to convey important information.
Simulate color blindness:
Color Contrast Check:
- Allow users to pick alternate style sheets (e.g. high contrast site):
“Practical Accessibility Testing”
W3C Unicorn (unified validation / testing tool)
WAVE Accessibility Validator
- Worldspace by DeQueue
- FireEyes by DeQueue
- Web Developer extension for Firefox
- Accessibility Toolbar for IE
- Luminosity Contrast Ratio Analyser
- Screen Readers (JAWS, Fangs)
“Future Trends in Accessibility”
Universal Design is NOT one size fits all.
- Apple iPhone has VoiceOver accessibility features built-in which sets it above current generation of Android and Blackberry.
- If you have a choice between building a mobile version of the web site vs. building a mobile app, build the mobile web site.
Matt May “Is Universal Design Still Possible?”
Universal Design = Accepting Entropy
This presentation started late due to earlier technical difficulties, I had to leave part way through.
Announced Training / Future Conferences:
There is a JQuery Summit (online) Nov. 16-17 run by this same group.
The In Control Web Design Conference is in Orlando next year (February).
Many well-know web design book authors present at In Control.