Operable content provides flexible navigation options and can be accessed with a variety of input methods. For example, learners with visual impairments may not be able to use a mouse to select options on the screen, but if the content is marked up correctly with descriptive headings they can navigate it with their screen readers using a number of keyboard shortcuts or touch gestures. In addition to screen reader users, learners who have motor or cognitive challenges may also rely on the keyboard or similar devices that emulate keyboard functionality for navigation. Others, such as programmers and power users, may just prefer the keyboard because they are able to navigate faster with it. Due to the many groups it benefits, keyboard accessibility is one of the key principles for creating accessible content.
The following techniques will help you make your content operable:
- Provide a clear structure with properly marked up headings
- Create descriptive links that make sense out of context
- Check for keyboard accessibility
- Provide sufficient time for interaction and response
- Avoid content that can trigger seizures
Access for all people, including people with disabilities, to web environments.View in glossary
The techniques are also summarized in a table with the corresponding Web Content Accessibility Guidelines for your reference.
|Technique||Benefits Learners Who Are||Relevant WCAG Guidelines|
|Provide a clear structure with properly marked up headings||Blind, have learning disabilities||2.4.1 Bypass Blocks (A); 2.4.6 Headings and Labels (AA)|
|Create descriptive links that make sense out of context||Blind||2.4.4 Link Purpose (In Context) (A)|
|Check for keyboard accessibility||Blind; have motor or cognitive challenges; prefer to use the keyboard to speed up navigation||2.1.1 Keyboard; 2.1.2 No Keyboard Trap|
|Provide sufficient time for interaction and response||Have motor difficulties that slow responses; require extra processing time due to cognitive disabilities||2.2.1 Timing Adjustable (A)|
|Avoid content that can trigger seizures||Prone to seizures; easily distracted||2.3.1 Three Flashes or Below Threshold (A)|
Provide a clear structure with properly marked up headings
As previously mentioned, most screen readers support a special keyboard shortcut or touch gesture that allows the user to access a list of the headings in a document. These headings can act as landmarks for the most important sections of the document. By selecting a heading from the list, learners can skip ahead to specific sections of a document. This capability of screen readers significantly improves the efficiency with which learners who are blind can navigate long documents.
For headings to be available as navigation landmarks for screen readers, they need to be properly marked up as such. It is not enough to just select the heading text and use formatting options to make the text bigger and bold. The heading text needs to have a style applied to it in order to make it function as a heading. The following resources describe how to create properly marked up headings in a number of word processing applications:
- Mark Up Headings in Microsoft Word (NC State)
- Mark Up Headings in Pages (Luis Perez)
- Mark Up Headings in Google Docs (Luis Perez)
Along with providing another means of navigation for screen reader users, a logical heading structure can help reveal the structure of the content to learners. For this to work, headings need to be added in the correct order and be properly nested. Generally, a web page or document will have a single first level heading that indicates the title or the main idea. This first level heading is then typically followed by several second level headings that indicate the major sections, with third level headings nested inside these to indicate subsections. When a proper heading structure has been created, the reader should be able to extract a meaningful outline from the content.
Beyond revealing the structure of the content to learners, breaking up long blocks of text into more manageable sections can also make the content less intimidating to learners who struggle with reading. It also makes the content easier to scan, which benefits everyone.
Individuals with Disabilities Education Act (IDEA)
Federal law governing rights of children with disabilities to receive free and appropriate public education in least restrictive environment.View in glossary
Create descriptive links that make sense out of context
As with headings, learners with visual impairments can use a keyboard shortcut or gesture to bring up a list of the links in a document. It will be difficult to determine the desired option if every item on the list reads as “click here” or “learn more.” Similarly, listening to a long URL read aloud can be confusing. Both of these issues are illustrated in the provided videos. For clarity, links should describe the content they reference as much as possible.
To make sure the links make sense when accessed out of context, select descriptive text and make that the link as follows:
- Create Descriptive Links in Microsoft Word (NC State)
- Create Descriptive Links in Pages (Luis Perez)
- Create Descriptive Links in Google Docs (Luis Perez)
Check for keyboard accessibility
Much of the work of ensuring keyboard accessibility involves coding that is beyond the scope of this quick start. However, educators are increasingly involved in creating content that remixes already existing resources, including interactive widgets and forms. At a minimum, you should know how to test these widgets and online forms for keyboard accessibility to ensure when you add them to your content you are not creating barriers for learners.
The test for keyboard accessibility begins with a simple keyboard shortcut: pressing Tab will allow you to navigate the interactive elements (form fields or hyperlinks). Pressing Shift and Tab will allow you to navigate in the opposite direction. As you navigate using the keyboard, it should be clear which element has focus (as indicated by a border or other styling). Also, you should make sure that the focus moves around the content in a logical manner. If keyboard accessibility is not supported, you should consider a different resource that provides equivalent access to the information for those who require alternative input methods. This short video from the W3C explains why keyboard accessibility is so important.
Note: The Safari browser on the Mac requires a preference change to enable Tab key navigation for all interactive elements.
Allow sufficient time for interaction
Regardless of the method they use to interact with the content, learners will vary in their proficiency and comfort with assistive technology. When just starting out with their technology, they may take longer to complete the same interactions as other learners. If timed performance is not essential to the goal of an activity, consider disabling the time limit or at least providing the option for learners to get more time as needed. Extra time may already be an accommodation some learners need to have provided to them when taking test and quizzes. A variety of learning management systems support extra time for these kinds of assessments:
- Provide extra time for quizzes in Canvas (Canvas)
- Provide extra time for exams in Blackboard 9.1 (University of Arkansas, Little Rock)
- Provide extended time in the Quiz Tool for Desire to Learn (University of Wisconsin-Madison)
Synchronous chat can be especially challenging for some learners. Those with learning or cognitive disabilities may have a difficult time keeping up with the multiple conversations taking place at once between chat participants . Users of assistive technology may also not be able to keep up with the fast pace and flow of the conversation due to limitations in either their technology or the accessibility of the chat interface.
You should alert learners as early as possible that an online course requires synchronous chats. Learners can then make an informed decision based on their previous experience with synchronous chat and bring up any concerns they have to the attention of the instructor. Another recommendation is to do a trial run of the chat system with the learner to determine how well the interface works with assistive technology. Based on the findings from the trial, you can do further research into the accessibility of the chat system or consider alternatives. One is to provide a recording of the session along with a transcript of the text chat that can be reviewed later.
Equipment or system where principal function is creation, conversion, duplication, control, display, interchange, transmission, reception, or broadcast of data.View in glossary
LMS (Learning Management System)
Software application or system that provides educational programs and their components.View in glossary
Avoid the use of content with rapid flashing
For many learners, flashing or moving content can distract from the rest of the content. For others, it can actually trigger a seizure that requires some time off before they can return to the content. For these reasons, it is generally just best to avoid animations and other content with rapidly flashing or moving content. Anything that flashes more than three times per minute can lead to the onset of a seizure.