Graphic of accessibility icons: ear, brain, eye, wheelchair and computer monitor
Web Accessibility
Student Affairs Web Accessibility: your resource for development and guidelines on web site development.
Share

Home

Web accessibility1 refers to the inclusive practice of making websites usable by people of all abilities and disabilities. When sites are correctly designed, developed and edited, all users can have equal access to information and functionality. For example, when a site is coded with semantically meaningful HTML, with textual equivalents provided for images and with links named meaningfully, this helps blind users using text-to-speech software and/or text-to-Braille hardware. When text and images are large and/or enlargeable, it is easier for users with poor sight to read and understand the content. When links are underlined (or otherwise differentiated) as well as colored, this ensures that color blind users will be able to notice them. When clickable links and areas are large, this helps users who cannot control a mouse with precision. When pages are coded so that users can navigate by means of the keyboard alone, or a single switch access device alone, this helps users who cannot use a mouse or even a standard keyboard. When videos are closed captioned or a sign language version is available, deaf and hard-of-hearing users can understand the video. When flashing effects are avoided or made optional, users prone to seizures caused by these effects are not put at risk. And when content is written in plain language and illustrated with instructional diagrams and animations, users with dyslexia and learning difficulties are better able to understand the content. When sites are correctly built and maintained, all of these users can be accommodated without decreasing the usability of the site for non-disabled users.

The needs that Web accessibility aims to address include:

 

1 Web Accessibility. (29 November 2013 at 13:19.). Retrieved from this Wikipedia page

Resources

General Resources

Mobile Applications

Android Applications

Apple Applications

Tools


Campus Accessibility Links

View primary accessibility pages for various Universities around the nation.

Campus:

Other schools:

Web Standards

Section 508 v. Web Content Accessibility Guidelines (WCAG)

Section 508 checklist - Web-based intranet and internet information, video and multimedia, and applications.
 

SECTION 508 Guideline 1194.22 (a) states: “A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc", or in element content).”

  • Related WCAG 2.0 Guidelines:

1.1.1 – “All non-text content that is presented to the user has a text alternative that serves the equivalent purpose.”

SECTION 508 Guideline 1194.22 (b) states: “Equivalent alternatives for any multimedia presentation shall be synchronized with the presentation.

  • Related WCAG 2.0 Guidelines:

1.2 – “Provide alternatives for time-based media.”

1.4—“Make it easier for users to see and hear content including separating foreground from background.”

 

SECTION 508 Guideline 1194.22 (c) states: “Web pages shall be designed so that all information conveyed with color is also available without color, for example from context or markup.

  • Related WCAG 2.0 Guidelines:

1.4—“Make it easier for users to see and hear content including separating foreground from background.”

1.4.1 Use of Color: Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element. (Level A)

 

SECTION 508 Guideline 1194.22 (d) states: “Documents shall be organized so they are readable without requiring an associated style sheet.

  • Related WCAG 2.0 Guidelines:

4.1.1 Parsing: In content implemented using markup languages, elements have complete start and end tags, elements are nested according to their specifications, elements do not contain duplicate attributes, and any IDs are unique, except where the specifications allow these features.

 

SECTION 508 Guideline 1194.22 (e) states: “Redundant text links shall be provided for each active region of a server-side image map.”

  • Related WCAG 2.0 Guidelines:

1.1.1 Non-text Content: All non-text content that is presented to the user has a text alternative that serves the equivalent purpose, except for the situations listed below.

 

SECTION 508 Guideline 1194.22 (f) states: "Client-side image maps shall be provided instead of server-side image maps except where the regions cannot be defined with an available geometric shape."

f.1 Are client-side image maps used instead of server-side except where a geometric shape is not available for a client-side image map?

f.2 Are there meaningful text alternatives for links that are images of text?

f.3 Can keyboard users access text alternatives with the keyboard?

f.4 Are client-side image map links selectable by keyboard/voice?

  • Related WCAG 2.0 Guidelines:

1.1.1 – “All non-text content that is presented to the user has a text alternative that serves the equivalent purpose.”

  • Additional Sources:

Penn State: Image Maps in HTML

 

SECTION 508 Guideline 1194.22 (g) states: "Row and column headers shall be identified for data tables."

g.1 Are row and column headers identified in data tables with a <TH> tag?
g.2 Is the <td> tag used for table data cells?
g.3 Can assistive technology associate row and column headers with data elements when navigated to within a table?
g.4 Are header elements and associated data included in the same table?
g.5 Do all coded header and data cells have content?
g.6 Is the scope attribute used to delineate rows and columns?
g.7 Are colspan and rowspan used for data and header cells that span multiple columns or rows?
g.8 Do cells have only one set of data?

  • Related WCAG 2.0 Guidelines:

2.4.6 – “Headings and labels describe topic or purpose.”

1.3.1 – “Information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text.”

  • Additional sources:

Penn State: Tables for Data in HTML

 

SECTION 508 Guideline 1194.22 (h) states: “Markup shall be used to associate data cells and header cells for data tables that have two or more logical levels of row or column headers.”

h.1 In complex tables, do colspan or rowspan attributes use either the scope attribute or id attributes to associate data with header cells?
h.2 In complex tables, are data cells and header cells associated by using id attributes?

  • Related WCAG 2.0 Guidelines:

2.4.6 – “Headings and labels describe topic or purpose.”

1.3.1 – “Information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text.”

  • Additional sources: see above resource for data tables.

 

SECTION 508 Guideline 1194.22 (i) states: “Frames shall be titled with text that facilitates frame identification and navigation.”

 

i.1 Do all frames have meaningful descriptive titles?
i.2 Are frame names available to assistive technology? (Note this is a function of §1194.31 Functional Performance Criteria)*
i.3 Is navigation to frames with a keyboard equivalent to navigating with a mouse?
i.4 Can voice recognition navigate to frames the same as mouse/keyboard navigation? (Note this is a function of §1194.31 Functional Performance Criteria)*
i.5 Does the website ensure that hidden frames or other elements used for storage or work areas are not spoken or exposed to assistive technologies? (Note this is a function of §1194.31 Functional Performance Criteria)*

  • Related WCAG 2.0 Guidelines:

4.1.2– “For all user interface components (including but not limited to: form elements, links and components generated by scripts), the name and role can be programmatically determined; states, properties, and values that can be set by the user can be programmatically set; and notification of changes to these items is available to user agents, including assistive technologies.”

  • Additional sources:

Penn State: Frames and iFrames

 

SECTION 508 Guideline 1194.22 (j) states: “Pages shall be designed to avoid causing the screen to flicker with a frequency greater than 2 Hz and lower than 55 Hz.”

j.1 Does the page avoid using blinking text and/or images with a frequency greater than 2 Hz and lower than 55 Hz and/or images?

  • Related WCAG 2.0 Guidelines:
  • 2.2 – “Provide users enough time to read and use content.”
  • 2.3 – “Do not design content in a way that is known to cause seizures.”
  • Additional sources:

 

SECTION 508 Guideline 1194.22 (k) states: “A text-only page, with equivalent information or functionality, shall be provided to make a web site comply with the provisions of this part, when compliance cannot be accomplished in any other way. The content of the text-only page shall be updated whenever the primary page changes.”

  •  Related WCAG 1.0 (No WGAG 2.0 Equivalent):

11.4 – “If, after best efforts, you cannot create an accessible page, provide a link to an alternative page that uses W3C technologies, is accessible, has equivalent information (or functionality), and is updated as often as the inaccessible (original) page.”

 

SECTION 508 Guideline 1194.22 (l) states: “When pages utilize scripting languages to display content, or to create interface elements, the information provided by the script shall be identified with the functional text that can be read by assistive technology.”

  • Related WCAG 2.0 Guidelines:

2.1.1 – “Keyboard: All functionality of the content is operable through a keyboard interface without requiring specific timings for individual keystrokes, except where the underlying function requires input that depends on the path of the user’s movement and not just the endpoints.”

Note: (1) This exception relates to the underlying function, not the input technique. For example, if using handwriting to enter text, the input technique (handwriting) requires path-dependent input but the underlying function (text input) does not.

Note (2) This does not forbid and should not discourage providing mouse input or other input methods in addition to keyboard operation.

 

SECTION 508 Guideline 1194.22 (m) states: “When a web page requires that an applet, plug-in or other application be present on the client system to interpret page content, the page must provide a link to a plug-in or applet that complies with §1194.21(a) through (1) .”

  • Related WCAG 2.0 Guidelines:

2.1.1 – “Keyboard: All functionality of the content is operable through a keyboard interface without requiring specific timings for individual keystrokes, except where the underlying function requires input that depends on the path of the user’s movement and not just the endpoints.”

Note: (1) This exception relates to the underlying function, not the input technique. For example, if using handwriting to enter text, the input technique (handwriting) requires path-dependent input but the underlying function (text input) does not.

Note (2) This does not forbid and should not discourage providing mouse input or other input methods in addition to keyboard operation.

 

SECTION 508 Guideline 1194.22 (n) states: “When electronic forms are designed to be completed online, the form shall allow people using assistive technology to access the information, field elements, and functionality required for completion and submission of the form, including all directions and cues.”

  • Related WCAG 2.0 Guidelines:

1.3.1 – “Info and Relationships: Information, structure, and relationships conveyed through presentation can be programmatically determined on are available in text.”

 

SECTION 508 Guideline 1194.22 (0) states: “A method shall be provided that permits users to skip repetitive navigation links.”

  1. Is there a way to skip over a group of repetitive links?
  2. Are links visible or made visible when tabbed?
  3. Does focus go to the first content past the repetitive links after the skip link is invoked?
  • Related WCAG 2.0 Guidelines:

2.4.1 – “A mechanism is available to bypass blocks of content that are repeated on multiple Web pages. ”

  • Additional sources:

Ohio State University: Web Accessibility Standards

Penn State: Skip Navigation

Tom Jewett Webdesign: Mapping Section 508 to WCAG 2.0

 

SECTION 508 Guideline 1194.22 (p) states: “When a timed response is required, the user shall be alerted and given sufficient time to indicate more time is required.

p.1 When a timed response is activated is the user alerted and offered the ability to indicate that more time is needed?

p.2 If there is a “time-out” feature, are users clearly advised up-front in the application that it exists?

p.3 Does the time-out message pop-up, speak, and get focus?

p.4 If users time-out, do they have the capability to return easily to the last addressed page?

p.5 Does the page avoid automatic redirects, automatic refreshing, etc? If not is there a warning that alters the user?

  • Related WCAG 2.0 Guidelines:

2.2.1 – “Timing Adjustable: For each time limit that is set by the content, at least one of the following is true: .”

2.2.2 – “Pause, Stop, Hide: For moving, blinking, scrolling, or auto-updating information, all of the following are true: ”

  • Additional sources:

Ohio State University: Web Accessibility Standards

Penn State: Redirects and Other Timed Responses

Tom Jewett Webdesign: Mapping Section 508 to WCAG 2.0

 

SECTION 508 Guideline 1194.24 (c) states: “All training and informational video and multimedia productions which support the agency's mission, regardless of format, that contain speech or other audio information necessary for the comprehension of the content, shall be open or closed captioned.

c.1 Are all video and multimedia programs that contain speech or meaningful audio information open or closed captioned?

c.2 Are captions synchronized with the speech and audio information?

c.3 Is the current speaker indicated in the captions?

(Note this is a function of §1194.31 Functional Performance Criteria)*

c.4 Is a text transcript provided for audio only presentations?

c.5 Are captions provided for podcasts?

  • Similar WCAG 2.0 Guidelines:

1.2.1 – “Audio-only and Video-only (Prerecorded): For prerecorded audio-only and prerecorded video-only media, the following are true, except when the audio or video is a media alternative for text and is clearly labeled as such: ”

1.2.2 – “Captions (Prerecorded): Captions are provided for all prerecorded audio content in synchronized media, except when the media is a media alternative for text and is clearly labeled as such. ”

1.2.3 – “Audio Description or Media Alternative (Prerecorded): An alternative for time-based media or audio description of the prerecorded video content is provided for synchronized media, except when the media is a media alternative for text and is clearly labeled as such. ”

  • Additional sources:

Penn State: Video Captions and Audio Transcripts

 

SECTION 508 Guideline 1194.24 (d) states: “All training and informational video and multimedia productions which support the agency's mission, regardless of format, that contain visual information necessary for the comprehension of the content, shall be audio described.

d.1 Do all video and multimedia programs have video descriptions for meaningful visual information?

d.2 Is a text transcript provided for video only presentations?

  • Similar WCAG 2.0 Guidelines:

1.2.1 – “Audio-only and Video-only (Prerecorded): For prerecorded audio-only and prerecorded video-only media, the following are true, except when the audio or video is a media alternative for text and is clearly labeled as such: ”

  • Additional sources:

Penn State: Video Captions and Audio Transcripts

 

SECTION 508 Guideline 1194.24 (e) states: “Display or presentation of alternate text presentation or audio descriptions shall be user-selectable unless permanent.

e.1 Can captioning be turned on or off by the viewer?

e.2 Can video descriptions be turned on or off by the viewer?

  • Similar WCAG 2.0 Guidelines:
  • – “Captions (Live): Captions are provided for all live audio content in synchronized media. ”

 

Additional notes from research for Section 508 subsections

What is the difference between the W3C guidelines and the Section 508 standards for web accessibility?

  • A useful historical narrative that offers valuable perspective by describing the development of accessible web content standards.

Webmaster Checklist

Web Accessibility Checklist

"IT'S SO EASY"

1. Reason why Website Accessibility is important…

Web accessibility is important to ensure individuals have equal access and opportunity to information delivered on the internet. For these reasons, our Student Affairs division encourages all departments to provide accessible websites for students with disability to promote active participation to programs and services. As an institution granted government funds for some programs and services, the preferred web accessibility guideline to follow to ensure accessibility is Section 508 (http://www.section508.gov/). You can learn more relating to these guidelines by visiting our Web Standards page.

 

2. Preferred Web Accessibility Tool…

WAVE is a free web accessibility evaluation tool developed by WebAIM. You can "WAVE" the individual pages of your website to evaluate their accessibility by entering your website's URL on WAVE's website and click the arrow. You'll then be presented with your page embedded with icons and indicators regarding your page's accessibility. To the left will be a sidebar where you can review your page's report as well as documentation about the WAVE icons and indicators.

It is most important to make sure your website is free of errors detected by WAVE. These errors are identified by red icons and are typically easier to fix as they relate to missing attributes and elements that should not be used on websites.

Alerts detected by WAVE are identified by yellow icons. Alerts aren't necessarily errors and don't always require fixing, and those that do require fixing might need extra time and attention. Keep in mind that true accessibility can only be determined by a human, so WAVE may indicate alerts on your website to things that may actually be truly accessible. 

For more information on the WAVE tool, refer to their Help page.

 

3. Recommended Screen Readers…

A mouse and a monitor are not useful to a blind person who navigates webpages using only a keyboard and audio. Screen Readers are technologies that interpret text on a webpage and translate it into speech. When developing a site, designers must be mindful that screen readers can’t make meaningful sense out of images, animated text, videos without dialog, or flash player controls if they lack descriptive alternate tags. Content input areas (or forms) must also be logically designed to avoid needless and tedious screen-reader repetition for the blind individual. It is also useful to know that navigation with a screen reader is faster and more efficient when you use headings to build your site.

Examples:

Flash & Flash Controls:

  • YouTube is only partially accessible (buttons not tagged properly).

  • NPR pages have inaccessible controls on their flash players.

Forms:

  • Frequent screen reader access problems exist on Banking websites, e-mail logons, or any site where purchases are made.

Products:

90-95% of blind people who visit your site will be using one of the following products:

 

4. Caption your Videos…

Student Affairs encourages you to make videos, podcasts, and audio files on websites accessible. Websites may include text transcripts and/or captioning feature of these files. You may provide an HTML page containing the transcript or a link to a separate text file or turn on captioning feature. If captioning is turned on, ensure the captioning text on screen is showing at the same time the corresponding video content is displaying on screen. Captioning feature must enable user turn on or off as so desired.

We recommend using YouTube to upload video content and turn on captioning feature. If you use YouTube with its captioning feature to upload video content , please review the captions for accuracy.  If the content is not accurate, professional captioning services may be required.  Contact the Disability Support Service for referral sources.

 

5. Creating Accessibility PDF and Word documents….

508 compliance for PDF is somewhat similar with Website 508 compliance. They both share same tag method for tables, links, images, and charts. However, PDF file is not easy to implement 508 compliant as website.  I used Adobe XI Pro which is included accessibility feature and “read it aloud” to simulate what actual software will do. Although this software has capability to add tag for images and links, it is lack of editing tables and chart. One way to add tag for tables and chart is converting PDF to word document. Another difficulty editing PDF for 508 compliant is table read order.  Adding index tag for table would resolve this issue but it also need to convert PDF to word document. I used vBooz (MAC version) and final result was acceptable.

The best ways to implement 508 compliant for PDF is done in word document before generating PDF version.  Also, I followed PDF file 508 checklist from U.S. Department of Health & Human Services.

 

6. Finding more Help….

The Student Affairs Web Accessibility site provides guidelines and resources to help make web accessibility easy. For more information, visit Frequently Asked Questions, Resources, and Glossary of Terms from the left-side menu.  You can also access related resources available from other organizations for making accessible websites online.  Feel free to share your findings or get further assistance by contacting, sawa-info@umd.edu.

 

7. Let’s Get Started...

Dictionary/Glossary of Terms

Accessibility
Accessibility is a general term used to describe the degree to which a system is usable, perceivable and understandable by as many people as possible. In the context of the Accessibility Technology Initiative, accessibility is the ability to access information and services by minimizing the barriers of distance, cost and usability of the interface. In many countries, this has led to initiatives, laws and regulations that aim toward providing universal access to the internet and to phone systems at reasonable cost to citizens.

ADA
Americans with Disabilities Act

Alternate formats
Alternate formats usable by people with disabilities may include, but are not limited to, Braille, ASCII text, large print, recorded audio and electronic formats that comply with this part.

Alternate methods
Different means of providing information, including product documentation, to people with disabilities. Alternate methods may include, but are not limited to, voice, fax, relay service, TTY, Internet posting, captioning, text-to-speech synthesis and audio description.

Alternative text
Textual information that describes an image on a Web page.

Assistive technology
Any item, piece of equipment, or system, whether acquired commercially, modified, or customized, that is commonly used to increase, maintain or improve functional capabilities of individuals with disabilities.

Browser
A system entity that is used by an end user to access a Web site. A browser provides a run-time environment for distributed application components on the client's device.

Browser (for Non-Visual Output)
Blind and partially sighted people will use one of three possible methods to read pages on the World Wide Web. Users with some sight can use screen magnification software. For users with little or no useful sight the options are Speech Synthesizers or sound card to convert text into speech or a refreshable braille display to convert text into braille.

Captioning
Captions are text versions of the spoken word. Captions allow the content of web audio and video to be accessible to those who do not have access to audio.

CSS
Cascading Style Sheets is a style sheet language used to describe the presentation of a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML, but the language can be applied to any kind of XML document. The CSS specifications are maintained by the World Wide Web Consortium (W3C) (as defined by Wikipedia)

Data table
A table on a Web page that contains information arranged in rows and columns. Data tables must have row and/or column headings.

Dynamic Content
Content that is generated in response to a request. This may be used for content that depends on changing environmental factors such as time (e.g., stock quotes) or place (e.g., nearby gas stations).

Dynamic HTML (DHTML)
DHTML is the marketing term applied to a mixture of standards including HTML, style sheets, the Document Object Model DOM 1 and scripting. However, there is no W3C specification that formally defines DHTML. Most guidelines may be applicable to applications using DHTML, however the following guidelines focus on issues related to scripting and style sheets: WC guideline 1, WC guideline 3, WC guideline 6, WC guideline 7, and WC guideline 9.

Electronic and Information Technology
Includes information technology and any equipment or interconnected system or subsystem of equipment, that is used in the creation, conversion or duplication of data or information.

Element
An "element" is any identifiable object within a document, for example, a character, word, image, paragraph or spreadsheet cell. In HTML4.01 and XML, an element refers to a pair of tags and their content, or an "empty" tag - one that requires no closing tag or content.

Font
A font represents an organized collection of glyphs in which the various glyph representations will share a common look or styling such that, when a string of characters is rendered together, the result is highly legible, conveys a particular artistic style and provides consistent inter-character alignment and spacing.

HTML
Hypertext Markup Language

Information Technology (IT)
Any equipment or interconnected system or subsystem of equipment, that is used in the automatic acquisition, storage, manipulation, management, movement, control, display, switching, interchange, transmission or reception of data or information. The term information technology includes computers, ancillary equipment, software, firmware and similar procedures, services (including support services), and related resources.

JAWS
JAWS is screen reading software. It converts text information on a computer screen to spoken words.

JPG
JPG files, also known as JPEG files, are a common file format for digital photos and other digital graphics. When JPG files are saved, they use "lossy" compression, meaning image quality is lost as file size decreases. JPEG stands for Joint Photographic Experts Group, the committee that created the file type.

Layout table
A layout table is used to position elements on a Web page. Typically, a layout table will consist of one row and several columns. Layout tables should not have row or column headings.

Operable controls
A component of a product that requires physical contact for normal operation. Operable controls include, but are not limited to, mechanically operated controls, input and output trays, card slots, keyboards or keypads.

PDF
Portable Document Format

RFP
Request for Proposal

RFQ
Request for Quotation

RSS
Really Simple Syndication (RSS 2.0)

Section 504
Sec. 504.(a) No otherwise qualified individual with a disability in the United States, as defined in section 7(20), shall, solely by reason of her or his disability, be excluded from the participation in, be denied the benefits of, or be subjected to discrimination under any program or activity receiving Federal financial assistance or under any program or activity conducted by any Executive agency or by the United States Postal Service.

Section 508
Section 508 of the Rehabilitation Act requires access to electronic and information technology procured by Federal agencies. The Access Board developed accessibility standards for the various technologies covered by the law. These standards have been folded into the Federal government's procurement regulations.

Semantic markup
Markup (such as HTML) which describes the meaning of document elements, as opposed to their appearance. Semantic tags include headings (<h1> through <h6>), lists (<ol>, <ul>, and <dl>), <strong> and <em>. Non-semantic tags include <div>, <font>, etc.

TTY
An abbreviation for telephone typewriter or teletypewriter, an electronic device that transmits coded signals across the telephone network. TTYs may include, for example, devices known as TDDs (telecommunication display devices or telecommunication devices for deaf persons) or computers with special modems. TTYs are also called text telephones.

Undue Burden
Undue burden means significant difficulty or expense. In determining whether an action would result in an undue burden, an agency shall consider all resources available to the program for which the product is being developed, procured, maintained or used.

Usability
Usability measures the quality of a user's experience when interacting with a product or system, whether a web site, a software application, mobile technology or any user-operated device.

Validation
Inspection of a web page to ensure that it conforms to the appropriate standard (i.e. HTML 4.0, XHTML 1.0, etc.).

W3C
World Wide Web Consortium

Web Accessibility
Web accessibility in the CSU context is the application of design principles to make web sites, web applications and web content usable by persons with disabilities who may be using assistive technologies to access the site.

WebAIM
WebAIM is a nonprofit organization within the Center for Persons with Disabilities at Utah State University. It provides comprehensive web accessibility solutions.

Web standards
Web standards include HTML, CSS, and JavaScript. Web sites that follow standards are typically more accessible and easier to maintain.

XHTML
eXtensible HyperText Markup Language. XHTML is similar to HTML, but has the additional requirement that XHTML pages also be well-formed XML.

XML
eXtensible Markup Language XML is a general language for describing information. In XML, all tags must be closed.

 

Web Accessibility: 508 in Depth - Glossary

client-side
Functionality that exists on the user's machine rather than handled by the server.

CSS absolute positioning
Taking an element out of the flow of your HTML document and positioning it relative to the top-left corner of your page.

CSS style sheets
CSS, or cascading style sheets, allow you to define how web page elements are displayed. For example, specific colors, fonts, margins, and sizes can be associated with headers, body text, and links. When style sheets are applied to a new page, the elements are changed according to the specifications of the style dictated.

frame
A region in a browser window that can display an HTML document (not a file) independent of what is being displayed in the rest of the browser window. A frame may be scrollable, and resizable, and have a border. You can display a page in a frame by creating a hyperlink to the page and specifying the frame as part of the hyperlink.

header
Distinguishes the column and row titles from the column and row data in a table.

hot area
On a server-side image panel, the area containing a rectangle, object, or text that the user can click to view another panel containing related information.

hot spots
On a client-side image map, the portions of a picture or graphic containing embedded links. You can identify hot spots by mousing over client-side image maps and seeing your cursor change into a pointing hand.

JavaScript
JavaScript can be thought of as an extension to HTML allowing authors to incorporate some functionality in their web pages.

longdesc or long description
Detailed text assigned to an image describing the content of the image. Disabled users are able to comprehend images they cannot see with longdesc tags read when using screen readers. Long descriptions provide more detailed information using an additional HTML page.

mark-up
HTML code added to format the text of a document. For example, you can label headings properly using <h1> name of heading </h1> to make information available for people using screen readers.

screen reader
Voice output technology producing synthesized voice output for text and images displayed on the computer screen, as well as for keystrokes entered on the
keyboard.

server
A computer in a network that is used to provide services to other computers in the network. Examples of services are access to files and routing of e-mail.

server-side
Functionality that is provided by a server rather than a user's machine. With server-side image maps, mouse coordinates are sent to a server, which then decides what action to take.

table
A convenient way to control the layout of text and images on a web page. Tables can be used to show data and/or images in columns and rows.

tag
Commands written into a document specifying how it should be formatted. For example, in HTML, a boldface tag is represented as <b>text</b> replacing "text" with the words you want.

Frequently Asked Questions

What is web accessibility?

Web accessibility in the UMD context is the application of design principles to make web sites, web applications, and web content usable by persons with disabilities who may be using assistive technologies to access the site.

Why is web accessibility important?

Educational institutions are using the Internet and web technologies for information dissemination, service delivery, and course delivery. Additionally, the campus website is used for marketing and branding as a tool to reach prospective students and their families. Because core services and information are delivered via the Web, it is critical that all people are able to access the information on the web, whether they have disabilities or not. Web accessibility should be viewed as a necessity and an investment. Well-designed accessible web sites help expedite the delivery of information and services, and are crucial in helping the university fulfill its educational mission in the digital age.

What is the cost of developing accessible websites?

There has been increasing focus on the cost associated with making web sites accessible. The cost is generally minimal if accessibility principles are incorporated into the development stage. Retrofitting, on the other hand, is far more expensive. Hence, it is critical that campuses find ways to integrate accessible design and conformance testing into the development process. Most of the initial costs will be on training and acquiring the appropriate tools to assist with authoring accessible sites and with conformance testing.

Over a period of time, a well-designed, accessible web site is more cost effective because it takes less time to maintain and update. It is more adaptable to emerging technologies and attracts a larger audience. As more web developers are trained to create accessible site, the costs will diminish.

What are the benefits for making our web site and information technology accessible?

The use of accessible design is beneficial to a wide spectrum of the population. In terms of information technology, accessible web pages are useful to all because they are easier to navigate, easier to use, and faster to download. Accessible hardware and software also address the needs of an aging workforce.

Accessible course design provides access to learning for students with disability, and it can also improve our ability to reach and teach a diverse student population with different learning styles and abilities. All of these factors point to the fact that ensuring access to technology for individuals with disabilities is not only the right thing to do but the smart thing to do.

It is easy to do. It is very simple to re-examine a web site and include many elements that will immediately make the site more accessible. Often this does not require changing the visual appearance or design of the site.

Making your web site work for everyone can make a huge difference to users with disabilities. Making an inaccessible web site means that a potential customer, prospective student, faculty member, etc. might not be able to get the information you are trying to share. You are posting information on your web site with the intent of sharing information, so why would you make it impossible for visitors to use it?

It won't look necessarily different. Making simple changes is often enough to make a site accessible without changing its appearance.

What are the characteristics of an accessible web site?

An accessible web site is one that can be used by everyone, including people with disabilities. Some specific characteristics of an accessible site include: clear and logical navigation; easy to read text and understandable links; text descriptions of essential visual elements; transcripts or captions for audio, video, and multimedia content; and interoperability with assistive technology which may be used to render the web content in a usable format.

What are common accessibility mistakes?

While certainly not an exhaustive list, the following is representative of many common accessibility mistakes.

  • images without alternative text
  • lack of alternative text for imagemap hot-spots
  • audio or video without captions or transcripts
  • lack of alternative information for users who can't access frames or scripts
  • tables that are difficult to decipher when linearized
  • sites where color is the only way to distinguish elements, or with poor color contrast
  • form fields that are not properly labeled
  • pages with long navigation menus without a "Skip-Navigation" link

 

What are some accessible web design principles?

Web sites that are designed to be perceivable, operable, understandable and robust (acronym=POUR) will offer the most flexibility and usefulness for individuals with disabilities as well as many other people. For a good discussion of these principles, access WebAIM’s "Constructing a POUR Website."

Other principles include

  • Separation of content from presentation to allow for modification of presentation style without altering content
  • Transformability of content from one form to another so persons needing different formats may be able to access and use the material
  • Use of open standards to provide compatibility with a wide variety of other technologies
  • Structural markup for efficient and effective navigation

    

What steps should web developers follow when creating an accessible web site?

  1. Know how users with disabilities interact with the web
  2. Understand W3C current technical standards for markup (HTML/XHTML) and stylesheet (CSS) and apply these standards in your design.
  3. Understand Section 508 Standards for Web-based Intranet and Internet Information and Applications (1194.22) (link to document on web accessibility standards) and apply these standards in your design
  4. Build the site to be standards conformant (e.g. XHTML 1.0 strict and CSS)
  5. Choose a standards-conformant accessible authoring tools and use the standards support and accessibility features.
  6. Validate conformance with accessibility standards by using Web Accessibility Evaluation tools and run them against your web page or file. (often a good accessibility evaluation tool will include validation of the codes as well)
  7. Examine pages using Graphical Browsers Internet Explorer, Mozilla Firefox, Netscape Navigator, Opera, and Safari. The following toolbars assist with evaluation:
    • AIS Toolbar for Internet Explorer,
    • WAVE Toolbar for Firefox, Internet Explorer, and Netscape Navigator,
    • Web Developer Extension for Firefox
  8. Use a screen reading program (e.g. JAWS) or a speaking web browser (e.g. IBM Homepage Reader) with the monitor turned off to determine how your web pages are presented auditorally.
  9. Utilize a variety of users, including users with disabilities, to engage in real-world testing of your page.

If we don’t have any employees who are disabled, do we still have to make our intranet accessible?

Yes. Many disabilities are not visible and you therefore may not always know whether a person has a disability or not. In addition, the workplace infrastructure, including its technology infrastructure, should be accessible in preparation for future employees with disabilities so that they are able to be productive from the moment they begin their employment.

While there are many ways for the blind to access the web, they all revolve around providing alternative methods to access information. The most common form is through a screen-reader, software that will convert text on the website into speech. A poorly designed website can be extremely difficult to navigate without visual cues.

Finally, many of the features of accessible web sites also benefit those using other technologies. For example, transformable, standards-based content can be readily transferred to PDAs and cell phones and displayed and utilized in a more effective manner.

Do I have to "dumb down" my site in order to make it accessible?

No. Making a web site accessible is more about including good design elements than removing them. Nearly all sophisticated and visually-attractive web technologies can be rendered in an accessible manner if designed with accessibility in mind. Creative web designers are able to keep the web site visually pleasing and, at the same time, make it accessible for more people to access the site.

Must we make web sites accessible if instead we can accommodate a person with a disability in a non-technical manner? For example, if a person cannot access web-based information, can we direct them to call the office to get the information?

The use of an ‘ad hoc’ approach to accommodating a person with a disability is not ideal; however, there may be times where something cannot be made accessible, in that case providing another accommodation is suggested.  It is recommended that an "ad hoc" approach only be used when when something cannot be made accessible and another reasonable and useable accommodation is available.   In all other situations we should strive to create and maintain an accessible information technology infrastructure.  Student Affairs also suggests including a statement on your web site that gives contact information for users who experience problems using the site.

The percentage of people with disabilities is between 10% and 20%. Not all disabilities affect access to information technologies such as the Web, but many do. Something else to keep in mind... for people with disabilities, online access is sometimes even more critical than for the general population, who may have an easier time accessing traditional sources of information.

There are a whole range of potential disabilities, almost all of which can be mitigated to some extent by accessible coding practices. The hearing disabled, for example, might not be able to listen to a podcast or audiocast, but if you provide transcripts and/or captioning they will still be able to follow along. Motor impairment can make the use of a computer mouse difficult or impossible, so keyboard shortcuts are encouraged as alternative navigation methods. Vision impairment might not mean complete blindness, so creating text elements that can be enlarged through keyboard or CSS might allow them to read the page.

What about the documents that people post onto the site? Do we have to be concerned about the accessibility of these documents?

Yes, an accessible Web site includes the accessibility of all its contents, including documents, forms, and other digital objects (multimedia, graphics, etc.). A process for ensuring the accessibility of the content is critical to a web accessibility policy.

 

Credits:

The California State University: Accessible Technology Initiative

Washington and Lee University: Web Accessibility

Committee Members

Chair:

  • Stephanie Payne-Roberts, Adele H. Stamp Student Union

Members:

  • Lisa Carroll, Office of the VP for Student Affairs
  • Jeffrey Fiory, Transportation Services
  • Bart Hipple, Dining Services
  • David Jensen, Career Center
  • Warren Kelley, Office of the VP for Student Affairs
  • Austin Kim, Dining Services
  • Vania McBean, Campus Recreation Services
  • Dan Newsome, Counseling Center
  • Deanna Romero, Resident Life