Interface Components Are Out of Order

Short Description

There should be a hierarchy of the element followed by information about or actions on it

Long Description

  • A screen reader user navigates the contents of a page in a sequential manner, regardless of the visual layout. Content should be presented to the screen reader in an order that makes the most sense, the main element followed by any information about or possible actions on it.
  • If information appears to the screen reader before the main element, then it is out of context and does not make sense.
  • If a possible action appears to the screen reader before the element being acted on, then a screen reader user has to navigate past the action, learn what the main element is, and then back track to the action.
  • If there are multiple elements with correlating information and actions, the lack of proper hierarchy can lead to confusion over which button, check box, hint, etc. belongs to which element.

    Example of Issue

    Accessibility/Usability

    Accessibility
    Usability

    Impacted Assistive Technology

    Screen Reader

    Impacted Type of Device

    Computer
    Mobile

    Recommendations

    • When determining the order of elements and related content, consider what would make the most sense if reading them one at a time.