A TIP TO IMPROVE ACCESSIBILITY IN YOUR SINGLE PAGE APPLICATION
Derek Oware

Derek Oware @bugs_bunny

About: Fullstack web developer

Location:
Ghana, Takoradi
Joined:
May 18, 2020

A TIP TO IMPROVE ACCESSIBILITY IN YOUR SINGLE PAGE APPLICATION

Publish Date: Oct 2 '20
9 0

Navigating in a multi-page application is done by refreshing the webpage. In this case, the screen-reader announces to the user when the page is done loading. However, In single-page applications, navigation is done via JavaScript which makes the screen-reader unaware of the navigation.

The solution is easy. When the navigation is done, just set the focus on the <h1></h1> element on the loaded page. The screen-reader will read the text content of the <h1></h1> element, hence making the user aware that the page has finished loading.

Comments 0 total

    Add comment