G61

From Mobile Accessibility Task Force

WCAG 2.0 Technique G61

Status

  • Sent to WCAG Working Group - 09 Oct 2014
  • Accepted as proposed - 21 Oct 2014

Notes on WCAG techniques sections

  • Applicability: no change needed
  • Description: Added a new paragraph
  • Examples: Added a third example
  • Related: no change
  • Tests: modified

- Detlev Fischer, 7 Feb 2014

Original

Description

The objective of this technique is to make content easier to use by making the placement of repeated components more predictable. This technique helps maintain consistent layout or presentation between Web pages by presenting components that are repeated in these Web units in the same relative order each time they appear. Other components can be inserted between them, but their relative order is not changed.

This technique also applies to navigational components that are repeated. Web pages often contain a navigation menu or other navigational component that allows the user to jump to other Web pages. This technique makes the placement of navigational components more predictable by presenting the links or programmatic references inside a navigational component in the same relative order each time the navigational component is repeated. Other links can be removed or inserted between the existing ones, for example to allow navigation inside a subsection of a set of Web pages, but the relative order is not changed.

Examples

  • A Web site has a logo, a title, a search form and a navigation bar at the top of each page; these appear in the same relative order on each page where they are repeated. On one page the search form is missing but the other items are still in the same order.
  • A Web site has a left-hand navigation menu with links to the major sections of the site. When the user follows a link to another section of the site, the links to the major sections appear in the same relative order in the next page. Sometime links are dropped and other links are added, but the other links always stay in the same relative order. For example, on a Web site of a company that sells products and offers training, when a user moves from the section on products to the section on training, the links to individual products are removed from the navigation list, while links to training offerings are added.

Tests

Procedure

  1. List components that are repeated on each Web page in a set of Web pages (for example, on each page in a Web site).
  2. For each component, check that it appears in the same relative order with regard to other repeated components on each Web page where it appears.
  3. For each navigational component, check that the links or programmatic references are always in the same relative order.

Expected Results

  • #2 is true.
  • #3 is true.

Proposed Updates

Description

The objective of this technique is to make content easier to use by making the placement of repeated components more predictable. This technique helps maintain consistent layout or presentation between Web pages by presenting components that are repeated in these Web units in the same relative order each time they appear. Other components can be inserted between them, but their relative order is not changed.

This technique also applies to navigational components that are repeated. Web pages often contain a navigation menu or other navigational component that allows the user to jump to other Web pages. This technique makes the placement of navigational components more predictable by presenting the links or programmatic references inside a navigational component in the same relative order each time the navigational component is repeated. Other links can be removed or inserted between the existing ones, for example to allow navigation inside a subsection of a set of Web pages, but the relative order is not changed.

@@@In responsive web design, where components are arranged based on the device size and screen orientation, the Web pages within a particular view (set size and orientation) should be consistent in terms of the placement of repeated components and navigational components. The technique does not require consistency between the different sizes and screen orientations.@@@

Examples

  • A Web site has a logo, a title, a search form and a navigation bar at the top of each page; these appear in the same relative order on each page where they are repeated. On one page the search form is missing but the other items are still in the same order. @@@When the Web site is viewed on the small screen size in portrait mode, the navigation bar is collapsed into a single icon but entries in the drop-down list that appears when activating the icon are still in same relative order.@@@
  • A Web site has a left-hand navigation menu with links to the major sections of the site. When the user follows a link to another section of the site, the links to the major sections appear in the same relative order in the next page. Sometime links are dropped and other links are added, but the other links always stay in the same relative order. For example, on a Web site of a company that sells products and offers training, when a user moves from the section on products to the section on training, the links to individual products are removed from the navigation list, while links to training offerings are added.
  • @@@ A Web site when viewed on the different screen sizes and in different orientations has some components are hidden or appear in a different order but the components that are shown remain consistent for any particular chosen screen size and orientation.@@@

Tests

Procedure

  1. List components that are repeated on each Web page in a set of Web pages (for example, on each page in a Web site).
  2. For each component @@on a given page size and orientation@@, check that it appears in the same relative order with regard to other repeated components on each Web page where it appears.
  3. For each navigational component, check that the links or programmatic references are always in the same relative order.

Expected Results

  • #2 is true.
  • #3 is true.