Fonts and Browser Extensions That Help Those with Dyslexia Read the Web
Dyslexia is a learning condition characterized by difficulties with reading and, to a lesser extent, writing. As the web is full of written content, the right fonts and extensions can make consuming digital content much easier for those with dyslexia.
Anything that’s written in a digital format must use a font. Whether it’s a Word document, a web page, a spreadsheet, subtitles on a video, or any words written down, they all use a font.
People with dyslexia often “see” letters swapping places, turning back to front, melting together, or just generally changing in ways that make it difficult or impossible to read. The right font can help stop these problems, or at least alleviate them enough that reading is possible.
If you’ve never installed a font before, we’ve written a guide that covers Windows, Mac, and Linux, and also a guide for iPads and iPhones. After you’ve installed your font, you can change the default font in your web browser, Word, PowerPoint, Excel, Outlook, and many other apps you use regularly.
If you want to know more about dyslexia-friendly fonts, including other options, the science behind the readability of different fonts, and more, Read & Spell has a comprehensive article for you.
Browser Extensions for Chrome and Firefox
So much of modern life is mediated through the internet that making your browser more dyslexia-friendly is a must.
Helperbird has a wide range of options, including changing fonts to dyslexia-friendly ones such as OpenDyslexic, changing colors, text-to-speech, tint overlay, and much more.
This is all great stuff, but the downside is that Helperbird’s free version includes only a few of the options. If you want all of the functionality, it’ll set you back $4.99 a month. This might be easily worth it, or you might feel it’s not.
If you want a free alternative to Helperbird, you’ll have to install multiple extensions.
There are different font-changing options for Chrome and Firefox. For Chrome, Dyslexia Friendly changes the font to a dyslexia-friendly font (OpenDyslexic or Comic Sans), provides contrasting colors for odd and even paragraphs, and adds a reading ruler.
For Firefox, Mobile Dyslexic changes the font to OpenDyslexic and does nothing else. If you want a reading ruler in Firefox, try Ruler. This does one simple thing very well: It adds a line under text that your cursor is on to help your eyes stay on the right line.
It will let you change colors, color schemes, brightness, saturation, contrast, hues, and much more. It works on anything you open in your browser, including PDFs.
This open-source extension features multiple male and female voices and lets you control the speed and pitch of the reading. It also highlights the text as it’s read and will read PDFs that you open in your browser.
The extension is free. If you’re concerned it says in-app purchases are available, know that these are for people who want to use text-to-speech cloud service providers, such as Google Wavenet, Amazon Polly, IBM Watson, and Microsoft.
If you don’t know what that means, you’ll never use them, so don’t worry. Everything you need in this app is free.
If these do enough for you, there’s no need to splash out on Helperbird, although the free version on its own will almost certainly be useful.
Features Built In to Microsoft Edge
Microsoft’s Edge browser natively has several accessibility features, so you won’t need much in the way of extensions.
Across all the Office suite—which includes Edge—Microsoft has embedded Learning Tools that give users the ability to have content read aloud. These tools also allow users to adjust settings to break the words into syllables and alter text size or background colors.
The main learning tool is what Microsoft calls “immersive reader.” This is where text-to-speech, text size and spacing, and speech highlighting are provided. You can read about how to use it in Edge here.
This all sounds good in theory, but in practice, there’s one glaring problem: Nowhere in Edge does it explain how to turn any of the features on. The only exception to this is a “Read Aloud” option in the main menu. It turns on text-to-speech; to access all of the other tools, you need to click Ctrl+Shift+R to put Edge into “Reading View,” which displays a toolbar of options.
From here, you can do things like turn on line focus, change the background color, set font spacing, and use grammar tools to break words into syllables and highlight words to show if they’re nouns, verbs, or adjectives.
This is all great stuff, and Microsoft should be getting plaudits for including it by default. Instead, it’s hidden behind a keyboard shortcut that no one would ever know about without being told. However, let’s focus on the positives here: Edge provides good accessibility tools by default and for free, without you needing any extensions.
Features Built In to Safari
Safari makes use of your Mac’s built-in text-to-speech functionality. It also provides a Reader view that strips away extraneous noise and lets you change the font, font size, and background color (but only to white, black, gray, or sepia).
This functionality is definitely better than nothing, but it’s not as good as Edge. We were also unable to find a single dyslexia-friendly browser extension for Safari, let alone anything that would match up to Helperbird or Midnight Lizard.
However, if you have an iPad or iPhone, there’s an alternative. ER Browser has been designed specifically to cater for dyslexia and visual stress and allows you to change the font (to OpenDyslexic, Arial, Verdana, or others), font size, letter spacing, and website background colors.
It’s not a fully-featured browser like Safari, Chrome, or Firefox, but for simple reading, it’ll give you better functionality than Safari. Given all the options though, we’d recommend using Chrome, Firefox, or Edge rather than an alternative browser.