This test belongs to 3.2.3 Consistent Navigation.
This test checks if the order of navigational components and repeated links within a set of Web pages remains consistent.
- G61: Presenting repeated components in the same relative order each time they appear
- F66: Failure of Success Criterion 3.2.3 due to presenting navigation links in a different relative order on different pages
- WCAG2 defines same relative order as follows: "Same relative order means that secondary navigation items may be in between the link items on some pages. They can be present without affecting the outcome of this test."
- This test assumes that the order of navigational elements on the page was not changed by the user.
- This test assumes that comparing a page to the pages that are linked from it is sufficient to judge the applicability of the success criterion.
- If one page has a different menu structure, all pages that are linked from it would get a failed result which might exaggerate the overall results and this is intentional.
- This test checks only navigational components that are matched by the selector. Other navigational components like search boxes are not checked.
|Success Criterion||3.2.3 Consistent Navigation|
|Test name||Presentation of navigational components|
|Test environment||HTML source or DOM|
|Test subject||Multiple web pages|
|User expertise and skills|
Select the following elements:
- elements with
<ol>elements that contain
<li>elements with internal links and the list does not contain any other text, images or user input elements outside of links. Sometimes the active menu item (current page) is a text and not a link. If the list contains one item that is not a link, this list should still be selected.
- Lists nested within other lists are considered a single list. From them the outermost list element or nav element is selected.
N1 = list of all selected elements.
If there are internal links on the current page (P1)
If all lists N2 ... Nn are empty, return
Else continue with #Step 3.
The elements on list Nj are identified by the element type and the id of the element or the id of the first ancestor with an id. If there is no ancestor with id, the id is left empty.
Compare N1 to N2 ... Nn. (Both the element type and the id are compared.)
If N1 does not have the same relative order as N2 ... Nn, return
|ErrorMessage||Navigational components of pages are not in the same relative order.|
else continue with #Step 4
Lj = list of link texts of all the navigational links in Nj.
Note that Lj is a flat list that contains all navigational links from page Pj in DOM order.
Only the link text, i.e.
link.textContent is extracted.
Compare L1 to L2 ... Ln.
If L1 does not have the same relative order as L2 ... Ln, return
|ErrorMessage||Navigational links of pages are not in the same relative order.|