What is WebReader
Underneath, WebReader relies on the Web Speech API to offer speech recognition and speech synthesis functionality.
It integrates a subset of the features provided by classic screen readers.
A major advantage of WebReader is that it does not require any additional software to be installed on a user's machine, apart from a supported web browser.
It is built with the hope to help users with disabilities better interact with web pages.
The intention is not to replace screen readers, but with basic features embedded into a web page, any user with an internet connection and a headset will be able to browse a website.
It frees people form constantly looking at the screen which is useful for anyone which is on the move.
Find where you are on the page; what elements and how many are there.
Read specific elements on the page; with navigation to the next and previous elements.
Focus just on the main content; in future also locate elements containing specific words.
Follow links; jump to other elements and pages.
How to embed WebReader
1. Include the
web-reader.min.js file into your website before the closing
2. Add a
script tag after the one referencing the library and paste the following lines:
var webReader = new WebReader(); webReader.enableShortcuts();
How to use WebReader
CTRL + SPACE or touch the floating WebReader icon on the screen. WebReader is now listening. The WebReader icon will pulse and an audio clue will be provided.
2. Speak a command. WebReader will listen, decipher and respond. You can repeat the interaction to begin a new query or perform a related query.
To view planned features, please visit the GitHub repository.
Checkout the feature list and backlog for an up to date list and please suggest features if they aren’t already listed.
Commands you can trial
Read all the headers.
Say:Read all headers
Read all the headers of a given type (e.g. H1).
Say:Read all H1
Read all the links.
Say:Read all links
Read all the links inside an element (e.g. header)
Say:Read links inside header
Read the main content.
Say:Read main content
Read the page title.
Say:Read page title
Read a summary of the page.
Say:Read page summary
Search and focus on the main content.
Say:Find main content
Go to the previous page.
Say:Go to previous page
Go to the next page.
Say:Go to next page
Go to the homepage.
Say:Go to homepage
Follow a link.
Say:Go to link
Read the current element again.
Read the previous element.
Read the next element.
We plan to further enrich WebReader’s with more useful features in the months to come.
We welcome your comments, ideas and feedback. Please help solve the challenges we have and help us create a truly useful, universal and free resource.