Understandable Guideline 3.2 Predictable

3.2.3 Consistent Navigation

Keep repeated menus in the same order on every page

Level AA Needs a person to check

What it asks for, in plain English

Navigation that appears on more than one page (the main menu, a sidebar, a footer, the search box, a skip link) should sit in the same relative order each time. Items can be added or removed as the context changes, and a section can be collapsed, but the order of what remains should not be shuffled.

It applies within a set of pages that belong together, such as one site or one application. A separate product with its own design is a separate set.

The person can still change the order themselves, for example by pinning favourites. That is their choice, not yours.

This is an independent explanation. The binding wording is the W3C Recommendation, and the W3C's own Understanding 3.2.3 page has the full intent, techniques and definitions.

Who it affects

A person with a learning disability or memory impairment learns that Contact is the fourth link and relies on that; move it and they have to start again on every page.

A screen reader user learns to press Tab a known number of times or to jump past the menu; if the order changes they land somewhere unexpected.

Someone using screen magnification sees a small window of the page and finds the menu by its position; a reordered menu disappears from where they expected it.

Example

Broken

Same four links, different order on the second page. Anyone who learned the first layout has to start again.

Fixed

Same order on both pages. Fourth link is Contact everywhere.

Show the markup behind both examples
Broken
<style>body{margin:0;padding:12px;font-family:system-ui;font-size:13px}.site{border:1px solid #d1d5db;border-radius:6px;margin-bottom:10px;overflow:hidden}.bar{display:flex;gap:14px;align-items:center;padding:8px 12px;background:#1f2937}.bar b{color:#fff;margin-right:auto}.bar a{color:#e5e7eb;text-decoration:none}.site p{margin:0;padding:8px 12px;color:#6b7280}</style>
<div class="site"><nav class="bar"><b>Hollowmere Garden Centre</b><a href="#">Home</a><a href="#">Plants</a><a href="#">Advice</a><a href="#">Contact</a></nav><p>Home page</p></div>
<div class="site"><nav class="bar"><b>Hollowmere Garden Centre</b><a href="#">Contact</a><a href="#">Home</a><a href="#">Advice</a><a href="#">Plants</a></nav><p>Advice page</p></div>
Fixed
<style>body{margin:0;padding:12px;font-family:system-ui;font-size:13px}.site{border:1px solid #d1d5db;border-radius:6px;margin-bottom:10px;overflow:hidden}.bar{display:flex;gap:14px;align-items:center;padding:8px 12px;background:#1f2937}.bar b{color:#fff;margin-right:auto}.bar a{color:#e5e7eb;text-decoration:none}.site p{margin:0;padding:8px 12px;color:#6b7280}</style>
<div class="site"><nav class="bar"><b>Hollowmere Garden Centre</b><a href="#">Home</a><a href="#">Plants</a><a href="#">Advice</a><a href="#">Contact</a></nav><p>Home page</p></div>
<div class="site"><nav class="bar"><b>Hollowmere Garden Centre</b><a href="#">Home</a><a href="#">Plants</a><a href="#">Advice</a><a href="#">Contact</a></nav><p>Advice page</p></div>

How to check it

  1. Open four or five pages from different parts of the site, including a deep page and a form page.
  2. Compare the main menu, footer links and any sidebar. Items should appear in the same order on each page, even if some are missing.
  3. Check the search box, skip link and sign-in link sit in the same place relative to the rest.
  4. Do the same on a phone; collapsed menus should keep the same order as the desktop ones.

What Websight checks for 3.2.3

Websight has no automated check for this criterion. It lists it in the manual checklist that comes with every report, so it is not forgotten.

Only a person can check this, because it means comparing pages against each other. Websight scans one page at a time and lists this in its manual checklist.

Practical tips

  • Drive every repeated menu from one shared component or template so it cannot drift.
  • Remove items you do not need on a page rather than reordering them; removing keeps the sequence intact.
  • When you redesign the menu, change it everywhere at once.

Scan your page and see where 3.2.3 stands

Websight gives a score out of 100, explains each automated finding in plain English, and lists the checks a person still needs to do.

Add Websight to Chrome

Free scans, no account, nothing leaves your computer. Automated tools find only part of the problems; the extension says so on every report.