Derek Oware
Posted on October 2, 2020
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.
💖 💪 🙅 🚩
Derek Oware
Posted on October 2, 2020
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.