Alt Text & Universal Design Week 1

Welcome. I'm Bryan Gould and I'm the course facilitator.

I work for WGBH’s National Center for Accessible Media. WGBH is Boston's public television station, has 2 radio stations, is the largest producer of public television programs--including Nova, American Experience, Antiques Roadshow and Frontline--and the single largest producer of content for pbs.org, one of the most trafficked dot-org sites in the world.

WGBH has also been involved in access for people with disabilities for a long time.

In the early 1970's, WGBH developed Closed Captions for people who are deaf and hard of hearing and broadcast the first television program with captions, The French Chef with Julia Child.

In the 1990's WGBH developed Descriptive Video Service® (DVS®) which adds a track of descriptive audio narration to a television show or film, describing action, costumes and scenery to people who are blind and visually impaired.

WGBH also developed systems for making movies in theaters accessible during regular showtimes, and for every screening of a movie from the day it debuts.  Rear Window Captioning® and DVS Theatrical®, collectively known as Motion Picture Access® or MoPix®, are currently installed in over 400 theaters in the U.S. and Canada, and WGBH captions and described over a hundred movies each year.

WGBH opened the National Center for Accessible Media in 1990 as a research and development facility dedicated to addressing barriers to media and emerging technologies for people with disabilities in their homes, schools, workplaces, and communities. NCAM supports and helps create national policy decisions, develops technical solutions and tools, conducts research and promotes advocacy via outreach. We also have a Strategic Partners program that supplies accessibility consulting and services solutions for industry, universities and local, state and federal government agencies.

Learn more about NCAM

As you read in my bio, my work is largely focused on providing access to digital media for people who are visually impaired.

Course Design

Each Wednesday I will post a new document like this one which will fill out the bullet points from the syllabus. This document is designed to both provide information and to spur discussion. Each week will also include an assignment. I will open a new forum for you to discuss these.

More than anything, this course is yours. Please participate and share your discoveries. I will help steer discussions in helpful places and highlight insights that will benefit everyone.

Since many of you are already active and engaged, I don't see the need for a synchronous Skype call (or the like) right away.

Already, many of you have learned one of the most important lessons that this course will offer. You can only know if your digital media (websites, PDF, etc) will work well with a screen reader, after you test it with a screen reader! Accessibility checkers are great tools but there is no substitute for gaining at least a rudimentary knowledge of a screen reader and plowing through your pages to hear them read back to you.

Week 1: 

I. Why bother to design accessible Web sites?

Legal mandate - to fulfill legal requirements. Section 508/WCAG are often used as minimum requirements even if there is no legal mandate to do so. Only U.S. Federal Government agencies are legally required to be 508 compliant.

Social mandate - to make content accessible to the widest audience possible

Educational advantage - more students benefit from accessible material

Resulting in...
    Market advantages
    Meeting client requirements
    Expanding customer base
    Improving image of company

Add to all that...
    many accessibility principles also make it easier for anyone to browse the Web, especially on mobile devices.

So, why design accessible Web sites? Because everyone benefits, that’s why.

II. 
What is assistive technology?

A.     Blind and visually impaired users use screen readers to listen to the contents of a Web site

        Most used screen readers:

• JAWS, Window-Eyes (Windows)
• VoiceOver (OS X 10.4+)
• NVDA (open-source; Windows)

       
        What is a screen reader?
            Software that allows a blind or visually impaired user to interact with a computer
            Screen readers work with many applications, not just Web browsers
            When working with Web browsers, screen readers read aloud the textual contents of a Web site
            Screen readers gather information from a variety of sources (DOM, HTML source, MSAA), not necessarily the screen itself
            Screen readers provide a summary of a Web page’s contents and structure (the number of headers, links, tables, etc.)
            Interacts with properly marked-up forms and data tables

    
        Visually impaired users use screen magnifiers, often in conjunction with a screen reader. 
            ZoomText, MAGic (Windows)
            Zoom (OS X)
            Windows Magnifier

        Some mobile devices also provide accessibility support:
            Apple iPad, iPhone, iPod touch: VoiceOver, Zoom
            Apple iPod nano, shuffle: speakable menus
            BlackBerry smartphones
            Oratio screen reader
            Code Factory screen readers for Symbian/Windows Mobile phones
            Most cell phones have basic text-to-speech (TTS) support, but this does not necessarily make them accessible
    
B. Deaf and hard-of-hearing users need no special technology to view the Web
        However, in order for multimedia (e.g., video and audio clips) to be accessible to this audience, Web authors must provide text alternatives such as closed captions or transcripts.

III.  Text equivalents for images

Providing text equivalents for images is the most basic rule of Web accessibility.  While blind users benefit most from alt text, so do sighted people who use the Web with the browser’s images turned off, for example, those with slow connections or using mobile devices. In addition, text equvilants are beneficial to people who do not process visual information easier and who for example, prefer a data table or text summary to a complex bar chart.

There are 3 types of images
    Images that are Eye Candy
    Images that are really Links and Buttons
    Images that Convey Information

Images that are Eye Candy
    These are visual enhancements which do not provide content.
    Do not describe them but do provide a null @alt i.e, alt=""

Images that are really Links and Buttons
    Do provide title (ex. "Contacts") or function (ex. "Change Password") but do not include image description.

Images that Convey Information
    These images require text equivalents.

Throughout this course, we will spend much more time discussing how to provide text equivalents that are clear and efficient for people relying on them.
For now, here are some things to think about before we get into writing alt text.
    
    What You Need to Write Good Image Descriptions:
        Detailed knowledge of the subject matter
        Good writing skills and an excellent command of the vocabulary associated with the subject
        Adequate access to reference and support materials to ensure that the descriptions are as clear and accurate as possible
        A review/edit process. Descriptions should be reviewed for accuracy by someone other than the original writer

    What Do I Write?
        Consider context to answer these basic questions:
            Why is the image there?
            Who is the intended audience?
            If there is no description what will the reader miss?
            What information is included in the surrounding text?
            Is there an image caption?

    
    Quotes of inspiration (and dread) from the experts:

The describer is a gatekeeper of information. It is a role that is both powerful and difficult. ...what the describer selects for description, the manner it is described in, and how it is positioned ...is final.  
        - Phil Piety

Description carries both an obligation and a responsibility to present information factually, without opinion or prejudice, in a manner that facilitates understanding. 
        - Kay Ferrell

IV. Assignment

* Read:  WebAIM's Designing for Screen Reader Compatibility

*Do: Use a Screen Reader to complete the course sign-up task. Use one of the following screen readers to view pages from various websites and report experiences and frustrations in navigation and images.

• Webaim includes links to JAWS and Window Eyes trials and an explanation about what it's like to use a screen reader for the first time.  
• NVDA is open-source for Windows
• For Mac users, VoiceOver is installed on every Mac. 

*Discuss:  Your experience using screen-reader and read the comments of others.
NOTE: Due to my error, this week's discussion is under Documents and not Forums.
Please post comments and read the Document titled: "Exercise: Using a Screen Reader - please add your comments"  
Please ignore the Forum topic: "Discussion of Screen Reader exercise"