What is Web Accessibility?
"Web accessibility means creating digital resources on the web that everyone can use. This involves creating a web that is accessible to people with disabilities that may affect how they use the Web, including but not limited to visual, auditory, physical, speech, cognitive, and neurological disabilities. An accessible web benefits web users and developers regardless of whether or not they have disabilities. An accessible web gives people the flexibility to access digital materials in whatever way they need to." - Web Accessibility Toolkit
Who is responsible?
As content editors of ISU's websites, it is your responsiblitly to ensure the accessability of your pages, images, etc. The Web Communications team is here to guide and assist you.
Tips and resources to help ensure your content is accessible
Your content must be clear and obvious to readers. If it’s obtuse, confusing, complicated, or unintelligible, you’ll lose readers’ attention.
Web writing is one place where creativity and cleverness don’t pay off—especially when it comes to headings. Instead of being clever, be descriptive so that your headings could stand alone out of context and still give your reader an idea of what they will read about.
Minimize the use of jargon, acronyms, abbreviations, a screen reader will try to pronouce them as a word. If they are necessary, then make sure to provide definitions.
Additional Resources:
Heading tags (H1,H2,H3…H6) were developed not to assist formatting but to provide information on the structural hierarchy of a document. In order to facilitate accessibility as well as standards, it is best to use the tags for the intended purpose in the information hierarchy rather than for pure formatting purposes. This will make your document easier to edit as well.
- Do not use text formatting, such as font size or bold to give the visual appearance of headings - use actual heading (
<h1>-<h6>) for all content headings - Do not use headers to achieve visual results only.
Additional Resources:
In TerminalFour, add proper heading structure by clicking Format > Formats > Headings and then selecting Heading 1 through Heading 6.
ALT Tags (Description field in Terminal Four) are invisible descriptions of images which are read aloud to blind users on a screen reader. Adding ALT text allows authors to include images, but still provide the content in an alternative text based format.
Alternative text serves several functions:
- It is read by screen readers in place of images allowing the content and function of the image to be accessible to those with visual or certain cognitive disabilities.
- It is displayed in place of the image in browsers if the image file is not loaded or when the user has chosen not to view images.
- It provides a semantic meaning and description to images which can be read by search engines or be used to later determine the content of the image from page context alone.
Additional Resources:
When an equivalent alternative for a complex image, such as a chart, graph, or map cannot be limited to a succinct alt attribute and is not presented within the context of the page, then the alternative should be provided elsewhere. This is typically done by linking to a separate web page that provides the longer description or placeing the text alternative below the image, chart, graph, etc.
Additional Resources:
Link text should make sense out of context, and should give users an idea of where they will go when they click on the link. A screen reader will inform the user that a piece of text or graphic is a link. For example, a "contact us" link would be read as "link contact us" by the screen reader.
- Phrases such as "click here," "more," "click for details," and so on are ambiguous when read out of context.
- Link text should be short; try not to use the entire URL for the link text, especially if it's lengthy and unintelligble/not human friendly (screen readers read the entire URL out loud).
- Links should be the only text on a page that are underlined.
Additional Resources:
The purpose of data tables is to present tabular information in a grid, or matrix, and to have column or rows that show the meaning of the information in the grid. Sighted users can visually scan a table. They can quickly make visual associations between data in the table and their appropriate row and/or column headers. Someone that cannot see the table cannot make these visual associations, so proper markup must be used to make a programmatic association between elements within the table. When the proper HTML markup is in place, users of screen readers can navigate through data tables one cell at a time, and they will hear the column and row headers spoken to them.
- Do not use tables to control the layout of your page
- Do not merge cells
- Use table headers
Additional Resources:
Captions are text versions of the spoken word presented within multimedia. Captions allow the content of web audio and video to be accessible to those who do not have access to audio. Though captioning is primarily intended for those who cannot hear the audio, it has also been found to be helpful for those that may not be fluent in the language in which the audio is presented.
Captions can be either closed or open. Closed captions can be turned on or off, whereas open captions are always visible.
For assistance with providing captions for your materials, contact the Instructional Technology Resource Center at itrc@isu.edu or 282-5880.
Additional Resources:
ITRC Accessibility Resource Page
WebAim: Captions, Transcripts, and Audio Descriptions
Ensure that every form element (text field, checkbox, dropdown list, etc.) has a label and make sure that label is associated to the correct form element using the <label> element.
Ensure that forms can be completed using only the keyboard. Many users can only use a keyboard to navigate and use the web.
Make sure the user can submit the form and recover from any errors, such as the failure to fill in all required fields.
Additional Resources:
WebAim: Creating Accessible Forms
WebAim: Usable and Accessible Form Validation and Error Recovery
