Introduction
This page is a guide to help you understand web accessibility and make web pages accessible. The following is a list of recommendations for web accessibility at OSU. Each guideline links to corresponding accessibility provisions from the WAI or Section 508. These links provide more detailed explanation of the guidelines below. For technical assistance or guidance regarding these guidelines, please contact Disability Access Services by phone at 737-4098 or by e-mail at:
Guidelines
-
Use language that is as simple and clear as possible.
- Guideline References: W3 (14)
-
Provide text equivalents to all nontext content.
-
Provide a description of all images, sound files, applets, etc. in an ALT TEXT tag. The ALT tag allows you to convey to all users the content and meaning of your page. For example:
<IMG SRC="picture.jpg" alt="OSU Library"> - If your nontext content is dynamic, make sure that equivalents change with the nontext elements.
- If your page cannot contain text equivalents within it, consider creating a parallel text-only version of the page as a last resort.
- Guideline References: W3 (1) | Section 508 (a)
-
Provide a description of all images, sound files, applets, etc. in an ALT TEXT tag. The ALT tag allows you to convey to all users the content and meaning of your page. For example:
-
Make sure that text and graphics make sense without color.
- People who cannot differentiate between colors or who are using devices with noncolor or nonvisual displays will not receive or understand information that relies on color for its meaning. Choose backgrounds that contrast with page text and don't interfere with readability of content. Within the content of a page, it is customary to underline links. In the navigation area of a page, it is acceptable to use a clear, consistent, non-underlined link format such as a specific and distinct font, style, and size.
- Guideline References: W3 (2) | Section 508 (c)
-
Don't use frames.
- Frames are not universally accessible.
- The content of frames may not be searchable by search engines.
- Guideline References: W3 (12) | Section 508 (i)
-
Avoid using server-side image maps.
- Navigation of pages using server-side image maps requires a mouse, which renders the page inaccessible to most visually impaired users.
- If used, consider providing a link to an alternate text version or summary.
- Client-side image maps are accessible because the information is stored locally and can be linked to using a text reader.
- Guideline References: W3 (9) | Section 508 (f)
-
Use descriptive links.
- Instead of denoting a link with the words "Click here" or similar phrase, be descriptive when providing links; for example: "further information from the W3C on Web accessibility."
- Consider allowing such links to stand on their own line or provide an ordered or unordered list of links in HTML.
- Guideline References: W3 (13)
-
Use headings and lists to organize your page and reinforce consistent page structure.
- When possible, use mark-up language (<H1>,e.g.) rather than images or visual cues to emphasize the structure of your page.
- Organize documents so they may be read without style sheets.
- Guideline References: W3 (13)
-
Test pages in multiple browsers, operating systems, and connection speeds.
- Test your pages on older Windows and Macintosh systems in both Netscape and Internet Explorer.
- Pages intended for modem users should be tested for load times on slower connections (56K). A large image that downloads immediately on University computers may take 30 seconds to load on a modem connection.
- Guideline References: W3 (6)
-
Provide alternate routes to information when using interactive technologies.
- Provide captioning and transcripts of audio and descriptions of video.
- Pages that use Flash, Shockwave, or other interactive elements may not be accessible with older browsers. Provide a link to a text-only or non-interactive version of the information. Use special effects with caution and only with good reason.
-
Potential difficulties include:
- May not work (or will work unpredictably) on different systems
- Harder to implement and maintain
- Take longer to download
- Require users to install plug-ins
- Text readers and search functions don't support JavaScript--not ADA compliant
- Guideline References: W3 (1) | Section 508 (a,i)
-
Design for device independence.
- Users may not be able to use a mouse or keyboard.
- Ensure that your site is usable with a keyboard. Generally, if your site works with a keyboard it will also work with screen readers and other inputs devices.
- Guideline References: W3 (9)
Accessibility Tips for Designers
Recommended
- Use high contrast text/background combinations with little or no pattern in background.
- Use proper heading styles to structure a page <H1>, <H2>, etc.
- Use CSS when possible.
- In text, use relative font sizes, e.g. "big," "bigger," "small," "smallest."
- Use "ALT" attributes to describe images
Strongly Discouraged
- Use of red/green combinations
- Designation of headings by using "Bold" formatting
- Use of absolute font sizes in running text, e.g. "10pt."
- Making navigation or other essential information depend solely on images
Accessibility Tips For Users
Having trouble with a site? Here are some recommendations to help you find the content you need.
Browser Settings
- Many browsers allow you to override aspects of a web site's display
- Set a default font size you can easily read
- Set a minimum font size so you can read the smallest text
- Set a default font color that is easily visible to you
- Set a default background color that provides good contrast with the text
- Look in your browser's help menu for shortcut keys to increase text sizes
Screen Magnifiers
- Programs are available for most platforms that allow you to magnify an area of the screen
- For Windows XP: Built in screen magnifier available at Start > Programs > Accessories > Accessibility > Screen Magnifier
- For Macintosh OSX: Built in screen magnifier available at System Preferences > Universal Access > Turn Zoom On, then use Apple Option + or Apple Option - to change the screen magnification
- Text will also appear larger if you decrease the resolution of your monitor
Sources
- Northwestern University Accessibility Recommendations
- W3 Web Content Accessibility Guidelines 1.0
- Section 508: Web-based intranet and internet information and applications
Special thanks to Northwestern University for their help with this document and their dedication to a usable web.