Accessibility question regarding headings and screen readers

Accessibility question regarding headings and screen readers

by Raymond Reid -
Number of replies: 1



Hi,

Please could members of the forum share their advice/expertise on the following.

We are currently looking at the accessibility of our current Moodle theme – specifically we are trying to ensure that the basic Heading on course pages makes sense to anyone using a screen reader.  We wondered if anyone on the forum could advise us on one or two issues that we have come up against.

Based on our current understanding and some experimentation with WAVE (screen reader emulator) and the NVDA screen reader we believe we should aiming to implement the following heading structure.

image showing a sandbox within our moodle and which section has which size headings. H1 is used for the title and H2 for the right hand blocks, but H3 is being used as the header for the top of a the course section. Why is that, it should be using a H2 as well, surely?

The above seems to have a sensible and logical structure that would be easy to follow using appropriate keyboard short cuts in a screen reader.

However, we are finding it really difficult to implement <h2> tags for Section headings.  These seems to be “hard” coded to <h3>. Furthermore, we don’t not seems to be able to detect a <h2> tag on the course page using WAVE or NVDA screen reader.  Given that the ATTO text editor formats lagre headings at <h3> it is difficult to understand why week/topic section headings should also be <h3>.

If anyone can shed any light on either;

  • How to change section headings to <h2>
  • Why section headings should be <h3> from an accessibility perspective and what headings structure we should actually be aiming to implement

We would be very gratefully.

Many thanks,

Ray Reid.

Average of ratings: -
In reply to Raymond Reid

Re: Accessibility question regarding headings and screen readers

by John Provasnik -
Picture of Particularly helpful Moodlers Picture of Testers

Hi Reid. Good questions. 

I'm starting to look into this myself with our set up. All I an say is if you look here (https://docs.moodle.org/dev/HTML_Guidelines#Header) and here (https://docs.moodle.org/dev/Standardize_classnames_and_layout_to_facilitate_theming#Header_usage_should_be_hierarchical_within_page_views) it explains when and why H1 and H2 tags are used and why everything else is H3. I hope that answers some of your above questions.