Accessibility and
Inclusivity
Accessible Technology at the UW
Visit the Accessible
Technology at the UW site and learn all about what is
happening at the UW in making technology work for everyone.
The Basic Methods for Accessible Websites
- Validated HTML
- Semantic element types (headings, paragraphs, lists,
tables, etc.)
- Headings and sub-headings used hierarchically
- ALT texts on images, where meaningful
- Page titles
- Meaningful link texts
- Form labels
- Table headers and captions
- Captioning on videos
Useful Tools
Websites
Download-ables and Plug-in-ables
Accessibility Problem Examples
Problems With Focus Indicator
No Focus Indicator
Reverse Focus Indicator (for mouse)
Mystery Focus Indicator
- ESPN — http://espn.go.com/
Enhanced Focus Indicator
Skipnav
Tab Order
- Olympic
College: Unexpected, goes to central pane first —
http://www.olympic.edu/index.htm
- Yahoo; Left nav
first, skips top nav: — (due to cursor in search
box by default, something to discuss, is this a good
technique? On most pages, probably not, but on portal/search
pages, it's probably appropriate, esp. with proper form label
in place) — https://www.yahoo.com/
- Oklahoma State
University: Lots and lots and lots of menu items to tab
through — http://go.okstate.edu/
Contrast and color
- Yahoo: High contrast
by default (except purple nav bar) —
https://www.yahoo.com/
Oklahoma State
University — http://go.okstate.edu/
- Martinsburg
Police Department: Too much contrast? Does it hurt?
— http://www.martinsburgpd.org/
- CSS Teagarden:
Where is nav, where is content? —
http://csszengarden.com/213/
- CSS 204:
Foreground vs background problems —
http://www.csszengarden.com/204/<</li>
- CSS 186:
Fade to invisible —
http://www.csszengarden.com/186/
Menus
Default Text Size
Headings