Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-67863

Ensure keyboard focus order is efficient and logical

    XMLWordPrintable

    Details

    • Testing Instructions:
      Hide

      Testing: Boost theme

      1. Login as admin
      2. Navigate to a course
      3. Keep the nav-drawer open
      4. On page load, use your tab key to navigate to the page
      5. Verify the tab order is: Navbar > Nav drawer > Page content > Footer
      6. Close the nav-drawer and reload the page
      7. Verify the tab order is: Navbar > Page content > Footer

      Testing: Classic theme

      1. Login as admin
      2. Set classic as the default theme
      3. Navigate to a course
      4. On page load, use your tab key to navigate to the page
      5. Verify the tab order is: Navbar > Header > Main content > Blocks left > Blocks right
      Show
      Testing: Boost theme Login as admin Navigate to a course Keep the nav-drawer open On page load, use your tab key to navigate to the page Verify  the tab order is: Navbar > Nav drawer > Page content > Footer Close the nav-drawer and reload the page Verify  the tab order is: Navbar > Page content > Footer Testing: Classic theme Login as admin Set classic as the default theme Navigate to a course On page load, use your tab key to navigate to the page Verify  the tab order is: Navbar > Header > Main content > Blocks left > Blocks right
    • Affected Branches:
      MOODLE_37_STABLE
    • Fixed Branches:
      MOODLE_37_STABLE, MOODLE_38_STABLE
    • Pull from Repository:
    • Pull 3.7 Branch:
    • Pull 3.8 Branch:
    • Pull Master Branch:
      MDL-67863-master

      Description

      From the audit report...

      Issue

      Focus Order

      Keyboard focus does not move in an efficient or logical order around the page.
      Focus moves through the main content first before then navigating to the main menu and then the footer. An example of logical focus order would be starting at the main menu before then following through to the main content and finally the footer.
      Fig. 0.02

      Impact on users

      Lack of logical order makes it very difficult for keyboard users to work out where they are on the page.

      Guidelines affected
      • 2.4.3 Focus Order (A)
        • If a Web page can be navigated sequentially and the navigation sequences affect meaning or operation, focusable components receive focus in an order that preserves meaning and operability
      Recommendation

      Ensure keyboard focus is efficient and logical

        Attachments

        1. Boost.png
          Boost.png
          117 kB
        2. Classic.png
          Classic.png
          97 kB
        3. Fig. 0.02.png
          Fig. 0.02.png
          91 kB

          Issue Links

            Activity

              People

              Assignee:
              basbrands Bas Brands
              Reporter:
              jpataleta Jun Pataleta
              Peer reviewer:
              Peter Dias
              Integrator:
              Sara Arjona (@sarjona)
              Tester:
              Janelle Barcega
              Participants:
              Component watchers:
              Adrian Greeve, Jake Dallimore, Mathew May, Mihail Geshoski, Peter Dias
              Votes:
              0 Vote for this issue
              Watchers:
              8 Start watching this issue

                Dates

                Created:
                Updated:
                Resolved:
                Fix Release Date:
                9/Mar/20

                  Time Tracking

                  Estimated:
                  Original Estimate - 0 minutes
                  0m
                  Remaining:
                  Remaining Estimate - 0 minutes
                  0m
                  Logged:
                  Time Spent - 4 hours, 46 minutes
                  4h 46m