Skip to main content
Accessible Technology

Facilitating Efficient Navigation

Overview

People with normal vision can quickly glance at the layout of a web page or document and easily find the content they’re looking for. If they’re able to use a mouse, they can even click on a link or other control within that section of the page. However, other users, including screen reader users, people who navigate by keyboard, and people using screen magnification, are unable to find and jump to content with similar ease unless the page is coded properly.

Techniques

Good Structure

Using headings properly enables screen readers to jump from heading to heading with a single keystroke (e.g., the letter “H” in some screen readers). Similar keyboard shortcuts are available for jumping to other objects too, such as lists, tables, and buttons. Therefore it is important when creating a web page or document to use built-in features (e.g., proper tags in HTML, toolbar buttons in Microsoft Word) that communicate what each object is. For further details about good structure, see Providing Structure in Web Pages and Documents.

ARIA Landmark Roles

ARIA (“Accessible Rich Internet Applications”) is a W3C specification that makes it possible to make rich, interactive user interfaces more accessible for assistive technology users. One of the easiest ARIA features to implement is landmark roles. These are a set of predefined roles, each representing a block of content that occurs commonly on web pages, such as role=”navigation” for a menu or role=”main” for the main content. ARIA landmark roles are well supported by screen readers, so blind users can easily jump to the section of the page that contains a particular type of content.  For further details about ARIA landmark roles, see Providing Structure in Web Pages and Documents.

“Skip to Main Content” Links

A “skip to main content” link is a same-page link that targets the id of an HTML element containing the main content. This enables screen reader users, keyboard users, and screen magnification users to bypass navigation links and jump directly to the main content of the page.  The benefits for screen reader users are minimal if other techniques are used to accomplish the same thing (i.e., headings and ARIA landmark roles). However, these links are still helpful for keyboard users and screen magnification users, since browsers don’t natively support jumping to ARIA landmarks or headings in the same way that screen readers do.

A common practice is to position the “Skip to main content” link in the top left corner of the page but visibly hide it using CSS, then make it visible on :focus so it appears immediately after users press the Tab key.

Bookmarks

PDF files should have bookmarks for lengthy documents. These enable all users to efficiently jump to a particular chapter or major section. Before adding bookmarks to a PDF, be sure the document is tagged and has good heading structure, with heading levels forming an outline of the document. For more details, see Providing Structure in Web Pages and Documents and Creating Accessible Documents.

After you have a tagged PDF with good structure, select Bookmarks from the Navigation Pane in Adobe Acrobat Pro. Then select “New Bookmarks from Structure…”. A dialog will appear showing the various structural elements that are used in the document. Select H1, H2, and additional levels of headings if desired. When deciding on an appropriate level of detail within your Bookmarks, try to balance the need for navigation with the need for simplicity. Keep in mind  the more bookmarks you have, the longer it will take for screen readers to read through them.

Screen shot of Adobe Acrobat's New Bookmarks menu

References