Accessible Text Reader

Inspiration

What it does

Inspiration

We wanted to help people with visual impairments or reading difficulties by creating a simple tool that allows any text to be read aloud. Many screen readers are expensive or complex, so we set out to build an accessible, free alternative.

What it does

The app provides a minimal interface where users can paste or type any text and click “Read Text” to hear it spoken aloud. The page automatically detects the default speech voice available in the browser and uses it to read the content. High‑contrast colors and large fonts make the interface easy to use.

How we built it

We wrote the app using plain HTML and CSS for structure and styling, and JavaScript for the functionality. The Web Speech API’s SpeechSynthesis interface is used to convert the text to speech. We designed the layout to be responsive and tested it in multiple browsers.

Challenges we ran into

One challenge was making sure that the SpeechSynthesis API behaved consistently across browsers. Some browsers provide different default voices or limit the speech rate. We also made sure the text area and buttons were accessible and clearly labeled.

Accomplishments that we're proud of

We managed to build a fully functional and accessible tool entirely in the browser without relying on any frameworks or server components. The simplicity of the code means it can be used on a wide range of devices.

What we learned

Through this project we learned how to use the Web Speech API and how to design web interfaces with accessibility in mind. We also learned about the importance of high contrast and clear typography for users with low vision.

What's next

We plan to add additional features such as the ability to choose different voices, adjust reading speed, support for multiple languages, and uploading files (PDF or text) to be read aloud. We would also like to host the app online so it can be accessed from anywhere.