Reading Order & Keyboard Navigation
Navigation and order are about the sequence in which users encounter your content and how easily they can move through it. When information is presented in a clear, logical order, people can understand it more quickly and find what they need with less effort. This matters for everyone, and it is especially important for people using screen readers, keyboard navigation, or other assistive technologies.
Key Points to Learn
Navigation and order are not just about menus or links. They include the reading order of text, the sequence of headings and content, the tab order of interactive elements, and how people move through pages, documents, and media.
- Logical reading order: Content should follow a clear, logical sequence from top to bottom and left to right, matching how you expect it to be read. Headings, paragraphs, lists, tables, and images should appear in an order that supports understanding.
- Consistent structure: Similar types of content should be structured in similar ways. When users see the same pattern from page to page or document to document, it is easier for them to predict where to find information.
- Keyboard and screen reader navigation: People using a keyboard or screen reader often navigate by headings, links, or focusable elements. If the underlying order is logical, they can move through content efficiently without getting lost.
- Manual checks: You can often check navigation and order yourself without special tools. For example, use the Tab key to move through links and form fields, or use an outline or navigation pane in documents and slides to confirm that the sequence matches how you intend users to read the content.
Common Mistakes to Avoid
- Visual order that does not match reading order: Placing content in visually appealing positions but leaving the underlying order scrambled, so screen readers and keyboard users encounter content in a confusing sequence.
- Important content out of sequence: Putting instructions, warnings, or key information after unrelated content, or in sidebars that appear late in the reading order.
- Unclear or missing section cues: Jumping between topics without headings or transitions, making it hard for users to know where they are or what comes next.
- Tab order problems: Interactive elements such as links, buttons, and form fields appear in a logical visual layout, but the Tab key moves through them in a different, confusing order.
- Overuse of floating objects: Using text boxes, images, or shapes that float over the page without adjusting their reading order, leading assistive technologies to read them at unexpected times.
Tips for Digital Formats
Arrange page content so the HTML structure follows a logical sequence, starting with key headings, followed by related text, media, and actions. Ensure that navigation menus, main content, and sidebars are ordered in a way that makes sense when read with a screen reader. Check tab order by using the Tab key to move through links and controls, and adjust it if the focus jumps around or skips important elements.
In documents, use headings and styles to create a clear outline, and then review the Navigation Pane or outline view to confirm that sections are in a logical order. Avoid relying on floating text boxes or shapes for important content unless you also ensure the reading order makes sense. When you convert documents to PDF or other formats, double‑check that the structure and reading order still match how you expect people to read the content.
In course sites and modules, organize content in a sequence that matches how you expect students to progress. Use consistent patterns for modules or weeks, and make sure instructions, materials, and activities appear in a logical order. Within pages, use headings and descriptive link text so students using screen readers or keyboard navigation can move through sections without getting lost.
For emails and newsletters, place the most important information near the top and group related content together. Use headings and spacing to create clear sections, and avoid complex multi‑column layouts that can cause screen readers to jump around. Test your messages by reading through them from top to bottom and, if possible, by tabbing through links to ensure the order matches what you intend readers to experience.