When a page loads
NVDA reads out the title of the page first and will then announce the first item it finds in the page body. This could be a non-focusable element like a heading, but in the case of this page you will hear it announce the skip link in the banner region.
Remember if you have not unchecked the Say All option, NVDA will then continue reading all of the content in the page.
Making sure we are at the top of the page
Sometimes when a page loads you might find the screen‐reader starts reading part-way down the page. This can be down to the screen‐reader remembering the last position on a previously visited page (trying to be helpful). However it is worth checking that it is not caused by any local code, such as javascript grabbing the browser focus or aria live regions.
Activity - starting at the top
To start interacting with the page use Ctrl + Home to move to the top of the page.
This is to ensure you start at the top of the page and all the content will follow the intended sequence. This also solves the occasional issue of the screen‐reader starting part-way down the page. When you use this key command you should hear NVDA read out the first element again.
(If you are using Windows as a VM on a Mac you will need to check what Home is mapped to as Macs don't have this key - on Parallels it is mapped to Fn + Left Arrow.)
Moving through a page
There are a few ways you can navigate with a screen‐reader - just as a sighted user might scan the page before reading from the top.
Screen‐readers also allow us to jump around the page using specific shortcuts to navigate. We'll cover these methods too, but for now we are going to read the page sequentially - from the top down. This is the most comprehensive way to test the page and we'll add in shortcuts later to test other things.
Activity - basic navigation commands
To actually start moving through the page you use either down arrow to move forward or up arrow to move backwards. Use those keys now to move through the page.
As you move through the content you want to be aware of the order of the content - does it match the visual order? If not it can be confusing for partially sighted users.
The first thing you will hear is the skip link at the very top of the page.
You will notice a few things get read out which you might not have come across before. We'll talk about all of these in more detail later.
- the page content gets announced as a “main”. This is a landmark
- headings announce what level they are
- this list was announced as a list and it said how many items were in it
- visually different content such as the call-outs above didn't get announced any differently to normal copy
You may also notice that NVDA may stop mid‐sentence and require another down arrow press to finish. This is because down arrow is actuallly the command for next line. To read out complete sentences you can use Ctrl + down arrow.
Insight - why we don't use tab
It is tempting as you are just using a keyboard to navigate using the Tab key (like you would if using a keyboard without a screen‐reader). But tabbing will only take you to the interactive elements on the page like links and buttons. Doing that would mean as a screen‐reader user you would miss out on all of the actual content.
A note about links
You might notice that if a link is by itself you can use Enter and the link will be activated. However if a link is in a list (like the sidebar on this page) or is mid-sentence, then you won't be able to do this, although you will still hear it announced as part of the wider content.
To activate a link which sits inside another element like this you will need to first move to the link. The easiest way to do this is to use the “next link” shortcut.
Activity - getting to a mid-sentence link
Move to the sentence in the example below. You will hear the link announced as part of the sentence. Move to the link by using the k shortcut and action it using Enter.
Now do the same with the list link - even though it is the only item in the list item you will still need to move to it with the shortcut key to be able to action the link.
This is a sentence with an in-page link as part of the content.
Stopping NVDA talking
If you want to temporarily stop NVDA talking, you can use the Ctrl key. This will just work for the current announcement - if you trigger another (for example by moving position), it will start talking again.
Focus
As you move through a page and encounter focussable elements, you will see that the focus state does not get applied to the element as you might expect with a keyboard, but you will be able to trigger the item. This behaviour can be different depending on which screen‐reader you are testing with (with NVDA if you use Tab this will trigger the focus style).
With NVDA you can see where the screen‐reader is currently sitting by the red visual tracking outline box.
Key takeaway
Screen‐readers provide more information to the user than just what you can see. Also remember that the screen‐reader 'focus' is different to the normal browser focus.
Now move to the link below and use enter to activate it.