Screen reader not reading headings with only 1 character

Question

I am fairly new to working with accessibility and am encountering an issue with JAWS and Narrator screen readers wherein it couldn't read numbers/letters that consist of only 1 character.

Below is a sample code snippet of what I'm trying to resolve wherein Notes is being read but 1 is not.

<div class="box">
    <h2 class="name" aria-label="Notes">Notes</h2>
    <h1 class="description" aria-label="1">1</h1>
</div>

When I try to do traverse through it per character, 1 is being read as blank .

There are 2 things I noticed:

• this behavior would only happen on 1 character and JAWS would read be able to read it if the number/character becomes at least 2 digits.
• NVDA does not have an issue with this and is able to read it properly.

Answer 1

A big piece missing from your question is how you are navigating with the screen reader.

There are many ways to navigate a webpage using a screen reader. For JAWS and NVDA (which have similar shortcut keys), you can use:

• up/down arrow to go to the prev/next DOM element (it's really the next element in the accessibility tree but for now just think of it as a way to navigate the DOM). This is how a user can access every piece of text on the page.
• left/right arrow key to go to the prev/next character, one at a time
• H to navigate to the next heading (and Shift + H to navigate headings backwards)
• 1 , 2 , 3 to navigate to the next H1, H2, H3, etc (and Shift versions to go backwards)
• Ins + F6 to see a list of headings and optionally to navigate to one of them.

I used all these ways to navigate your example and every time I heard "1" for the heading.

Now, one thing that might make it sound like the letter is not being read is with NVDA, but you said the problem was with JAWS and Narrator. With NVDA, if I use the right arrow to navigate one character at a time, NVDA will announce the type of element it is before saying the one letter, so if you're not listening carefully, you might not hear the letter.

Here's what NVDA says as I use the right arrow:

• "heading level 2, N"
• "o"
• "t"
• "e"
• "s"
• "out of heading, heading level 1, 1 "

Notice at the end NVDA told me I left the heading ("out of heading") as I right arrowed out of the "Notes" heading but in the same breath told me I entered a new heading ("heading level 1") and that it's a "level 1" heading and has the character "1". If you're not listening closely, you might not hear the final "1".

JAWS does not tell me the element type ("heading") as I right arrow. It only says the character:

• "N"
• "o"
• "t"
• "e"
• "s"
• "1"