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

Dashboard block headings should be h3, not h5; and there should be an overall block heading



    • 0
    • Internationals - 4.0 Sprint 1, HQ Team International Sprint 2, HQ Team International Sprint 3, HQ Team International Sprint 4


      The Dashboard blocks all use h5 tags for their headings. This results in a page that fails WCAG 2.1 level AA guidelines.

      Heading markup allows assistive technologies to present the heading status of text to a user. A screen reader can recognize the code and announce the text as a heading with its level, beep or provide some other auditory indicator. Screen readers are also able to navigate heading markup which can be an effective way for screen reader users to more quickly find the content of interest. Assistive technologies that alter the authored visual display will also be able to provide an appropriate alternate visual display for headings that can be identified by heading markup.

      Use case: Imagine you are blind. As such, you have no monitor or it is turned off. All you have are speakers and screen reading software installed on your computer. The dashboard is loaded. You it a special keyboard combination to start navigating H1 sections in the page. However the screen reader doesn't find any. So you take a chance on H2s. None are found either. H3s, H4s? Nothing. Personally, by this point, I would start to suspect that there are no headers at all on this page. What do you think the chances are that someone who relies alone on the screen reader to find information will think to themselves "Hey, maybe I should try H5 and H6 too just in case!".

      In this particular case, the heading level was obviously chosen for its size instead of its relationship to the content. I am not suggesting that we change the size of the headings. The solution here would be to use a H2 instead of H5 (H1 for the page title) and add class="h5" to keep the text size.

      Visually, it will look exactly the same. But to a person who relies on a screen reader, it will make a world of a difference.

      Additional information:


        Issue Links



              lucaboesch Luca Bösch
              michael-milette Michael Milette
              Susanna Susanna
              Jun Pataleta Jun Pataleta
              Kim Jared Lucas Kim Jared Lucas
              6 Vote for this issue
              27 Start watching this issue



                Time Tracking

                  Original Estimate - 0 minutes
                  Remaining Estimate - 0 minutes
                  Time Spent - 6 hours, 20 minutes
                  6h 20m


                    Error rendering 'clockify-timesheets-time-tracking-reports:timer-sidebar'. Please contact your Jira administrators.