Overview of Website Accessibility (Webinar Summary)

An Overview of Website Accessibility [recorded presentation]
TechSoup Talks series, Jan. 14, 2010
(notes here by Natalie Zebula, some portions paraphrased)

Presenters (text from TechSoup):
Jane Vincent,
AMLS, is the Accessibility/Usability Manager for the Center for Accessible Technology in Berkeley.
Kami Griffiths, She is currently the Training and Outreach Manager at TechSoup where she holds local and international trainings, delivers online seminars, and helped develop the TechSoup for Libraries program.

Why is website accessibility important?

  • You want your website compatible for as many individuals as possible (low-bandwith users as well as users with users with disabilities)
  • Flash can’t be used on iphones

What guidelines are available?

  • WCAG 2.0 from the World Wide Web Consortium (W3C)
  • Screen readers now can tell where links begin and end
  • WCAG 2.0 intended to respond to new technologies
  • Four principles: Websites should be…
  1. Perceivable (regardless of using assistive technology)
  2. Operable (using a mouse and keyboard, etc.)
  3. Understandable (clarity of language, ESL, consistency in your website)
  4. Robust (using correct coding syntax, when using flash/java)

    Accessiblity Issues

    • Drupal, Facebook, Twitter
    • Need to deal at the source code level
    • Usually minimal code, sometimes just by CSS

    Problems with Guidelines

    • Obtuse
    • Not necessarily a concensus on what is most accessible, ex.: Want descriptions of photos or just want to skip over photos?
    • Don’t cover all users. Doesn’t address fully the needs of users with learning disabilities
    • Accessbility may be in conflict with other considerations (webaim.org – post questions to the listserv)

    Basics

    • Language tag: Language not specified, screen readers will pronounce in that language. (some do this automatically, like dreamweaver). <html lang=”en”>
    • Text alternatives to pictures/graphics: Picture of Michelle Obama <img alt=”Photo of First Lady Michelle Obama”>  or <img alt=”Michelle Obama smiles at…”>
    • Decorative elements: alt=”” (null) You don’t want this read by a screen reader
    • Extended description (80 characters) ex: icanhascheeseburger does this well

    Form Fields

    • Often not marked up correctly
    • “radio button check 1 of 5, radio button check 2 of 5…” just reads like that, no idea what to put in
    • correct: “title M S radio button check, title M R radio button check, …”
    • id=”surname” (read out)

    Text Size

    • Most controlled by browser, but also by CSS
    • Allow users to change size
    • 10px or 10pt are fixed, instead use em (proportional)
    • Better to make a change in the stylesheet instead of each page

    How to check if your pages are accessible?

    • Good free checkers online (automated), but they can’t check all issues
    • New guideline: Should be clear ways for error feedback (on a form), a checker cannot check for this, or provide meaningful feedback
    • Best way, most comprehensive (test your website with individuals blind/low vision/phsyical, learning disabilities/elderly who use and don’t use assistive technology)

    CMS

    • CMS: want to see if it is accessible. Do you have access to the source code? Can you modify stylesheets? Does the CMS use templates or skins that are already accessible? Are they accessibility prompts built in?
    • Drupal: good at providing good color contrast suggestions, ver. 7 (more features)
    • WordPress: long list of links, short tutorial (not entirely accurate), create accessible feeds
    • Access on mainstreet.org (blind users can acces this site with no problem)
    • Plone: coding can be automatically cleaned up (closing tags), automatic alternative text for images
    • Joomla: weakest of the four, accessibility statements, they are working on it

    Social Media

    • Facebook: tell people if you are a screenreader user, how to use
    • Twitter: has sep site that is screenreader friendly
    • Flickr: not yet accessible, it is owned by yahoo, yahoo has a wonderful accessibility group, will address in the future.

    Questions

    Make flash accessible? Will post in the forums/maybe have another webinar.  A technical topic
    Alt tags? Say “Photo of…”? Most users prefer this, not everybody, but most.
    Can make any website accessible? Can see source code, you can make it accessible.
    Bibliography? List of checkers? Yes, in the follow up email.
    Other groups to help smaller orgs? webaim
    Recommend a screenreader for testing? Very expensive, jaws frowns on using the demo version for testing. But there are open source nvda, wave toolbar (?) puts icons are parts of the page where there are problems.
    What audio formats are best? Assume people will use screen readers. more on making mulitmedia accessiblity later. Leaders in this: national center for accessible media.

    Closing Comments

    • Population 65+ is the fastest growing group
    • People with problems using a keyboard and mouse
    • Making it better for screen readers can also make it better for voice recognition software.
    Advertisements

    Leave a Reply

    Fill in your details below or click an icon to log in:

    WordPress.com Logo

    You are commenting using your WordPress.com account. Log Out / Change )

    Twitter picture

    You are commenting using your Twitter account. Log Out / Change )

    Facebook photo

    You are commenting using your Facebook account. Log Out / Change )

    Google+ photo

    You are commenting using your Google+ account. Log Out / Change )

    Connecting to %s