Web accessibility means people with disabilities can use the Web -- more specifically, they can perceive, understand, navigate, interact and contribute to the Web. Web accessibility supports inclusion for people with a wide range of needs. People who benefit include those with:
- Vision impairment (blind, color-blind, far-sighted, etc.)
- Hearing or physically impairment
- Slow Internet connections
- Non-conventional browsing devices such as screen readers, mobile devices, etc.
- Tell people what to expect. Be explicit about what someone will find when they visit a page or download a file, use descriptive link text, for example: view the August Gardening Calendar (PDF)
- Don't open links in new windows or tabs. Read the article "Should Links Open in New Windows?" by Vitaly Friedman. This article summarizes the work by top usability experts.
- Don't rely on color alone to mark special content, such as web links. Instead use bold or place items in a bulleted list, etc.
- Break content into small chunks with headings for each.
- Use heading tags (h2, h3). Nested headings facilitate access for blind users with screen readers as well as helps with scannability.
- ONLY use tables for tablature data. When used provide id and headers attributes to improve the accessibility of table data
Image, video and audio guidelines
Images can be quite valuable when they communicate something that can’t easily be communicated in words. However all people don’t have access to the information within the images. Some users may have vision problems and need assistive technology such as a screen reader to read websites content to them.
Also, search engines send out spiders and robots to catalog web pages for their indexes and databases; such programs do not access the information within your images.
When using images, be aware of the needs of people with various levels of visual impairment:
- Don't rely on images to convey information. If graphics and/or media is used to convey meaning, provide alternate text equivalent of the content is provide.
- Include an alt attribute with a brief description of the content.
- Or for images containing extensive information, provide a long description attribute, which links to a file with a full text description of the content of the image.
- Make images as small as practical, to speed download time. Resize images in appropriate software to fit the desired space, rather than setting the image width and height in the web page, which will cause the browser to download a much larger image than necessary.
- Don’t use image maps, Google custom maps are easy to set up if you want to display information on a map; and there are other ways than image maps to display information.
- Keep background images muted, even lightly textured backgrounds reduce legibility of plain text. Different browsers or different versions of the same browser differ considerably in the amount of contrast displayed in a background. What looks OK to you might not be legible to someone else.
- Provide captions and/or alt tags for audio or video for each file used.
In summary, provide text-based ways to view all information. If an image, audio or video is used, provide alternative text in the form of an alt tag or video caption.
Keep in mind:
- Images take longer to download. Download time is an important consideration if you want people to access your site when they may have only a dial-up connection.
- Images take more time to create and maintain than plain text.
- Images don’t zoom well. Browsers let you zoom in or set a larger default font size, but if the text is in an image, you’re stuck with whatever size was initially saved.
- It is harder to read text in an image than to read plain text of the same size, color, and font.
- You can’t copy and paste text from an image.
Accessibility at OSU provides a full list of website accessibility issues to consider.