Just as designing and structuring images, videos, links and all of the individual elements of a web page is an integral part of web accessibility, so too is stepping back and examining the bigger picture. A consistent design and layout across the entire site results in the predictability and usability that users appreciate.
How consistency helps accessibility
Main content will vary but consistent navigation on every page allows people to navigate a site more quickly. Users often rely on their familiarity with the navigation and functions that appear on multiple pages. A site is easier to use if it doesn’t require people to learn new functionality for different sections or pages. Repeated components along with intuitive design and content can be helpful to everyone, and sometimes particularly helpful to some people with disabilities.
Designing for consistency
An inconsistent design creates difficulties and frustration for all types of visitors, making the site appear more complex. A site’s interface can still be uniquely designed, but its functions should be clear. Navigation, forms, search boxes, and other common functions and page properties need to be easily identifiable and work in the way users expect. There may be differences in presentation and order across device types, perhaps on desktop and mobile views, but consistency should strongly considered from page to page.
Some tips for a consistent interface and overall design are:
- Position navigation in the same location on all pages.
- Keep the same order of components within navigational menus.
- Include Skip Navigation and Skip to Navigation links to allow users to go directly to the main content or jump to a page’s navigation. These controls should be located consistently, and preferably among the first links on every page.
- Utilize templates or themes for sites running on Content Management Systems such as WordPress, Joomla, and Drupal. The sample principles can be applied to online courses hosted on Learning Management Systems like Blackboard or Canvas.
- Use functional icons and elements consistently. They should appear and function the same throughout a site. Do not reuse icons and elements to represent different functions on different pages.
- Give every page a title that clearly describes its content and purpose. Page titles are usually the first thing on a page read aloud by screen readers. Titles are used by search engines and serve as labels in browser tabs.
- Use headings consistently. If you use a level 2 heading to begin one new section, do the same for all sections.
Labels and alternative text
Some web users depend more heavily on text alternatives for functions, while others rely on non-text content to interact with a site. Consistency of a site’s components applies not only to appearance and location but also to their text alternatives and labels. Identical functions that are labeled differently on different pages can be confusing and difficult to use. A search function should not be labeled “Search” on one page and “Find” on another. Keeping alternative text, non-text content, and associated labels consistent contributes toward a good accessible design, providing for a more predictable experience and efficient navigation for all users.
Was this content helpful?
Always get the latest by signing up for our blog and newsletter.
