+44(0)1268 906092 Website specialists

Estimated reading time: 4 minutes

Kevin Gordon

Kevin Gordon

Director and founder

Author Kevin is director of Digital Technology Labs and has been published in NET magazine, the UK’s leading Web Design and Development magazine monthly. Here he talks about DTL’s approach to dyslexia testing and accessibility.

TL;DR

We have composed some guides to accessibility and dyslexia testing here at DTL, this is a summary of these guides and an introduction to making your site work for people with dyslexia.

dyslexia testing
When building a website, it’s important to perform Dyslexia testing. This is a dyslexia testing guide I had put together for the DTL team – I do hope this is of use to you.

Making your site usable for someone with Dyslexia

Here is a guide to making a site usable for someone with dyslexia:

https://www.userzoom.com/ux-library/five-ways-to-make-usable-websites-for-people-with-dyslexia/

The main takeaways here are

The main takeaway from this article are:

– You need to make sure the site works with a screen reader

– You should avoid a white background – so intro an off-white colour for the background

Next step – how to the site accessible?

Here is a guide to making a website accessible – making a website accessible follows that it will work with someone with dyslexia:
https://www.dreamhost.com/blog/make-your-website-accessible/

1. Make Sure Your Site Is Keyboard-Friendly

“This is easy to test — simply use your own site without a mouse. If you find that you can’t access certain elements or that navigating is difficult, you can pinpoint those issues and address them. To help you out with this, WebAIM provides a handy guide for keyboard accessibility design.”

3. Add Alt Text to All Images

This is something you should be doing on your site as standard.

4. Choose Your Colors Carefully

This is to ensure a high amount of contrast between background colours and text colours.

5. Use Headers to Structure Your Content Correctly

H1, H2, H3, etc…

6. Design Your Forms for Accessibility

Yes you need to keep this in mind. What’s most important is to ensure that each field is clearly labeled.

7. Don’t Use Tables for Anything Except Tabular Data

Naturally

8. Enable Resizable Text That Doesn’t Break Your Site

A good practice is to avoid absolute units, such as specifying text size using pixels. Instead, use relative sizes, which enable the text to scale depending on other content and screen size.

– Relative sizes use ‘em’ – you ought to do this, and test, by increasing the font sizes in the browser….

How to test with a screen reader:

Here is an article about how to test with a screen reader:

https://medium.com/that-conference/the-why-and-how-of-screen-reader-testing-8a92add2a609

“macOS users have a pretty powerful screen reader built in for free, VoiceOver. To access VoiceOver, Go to System Preferences > Accessibility > VoiceOver.”

Worth having a play with this…

Looks like you can do iPhone screen reading too. Probably worth a test too.

https://support.apple.com/en-gb/guide/iphone/iph96b214f0/ios

Conclusion

Above are several approaches to making your site more accessible for people with dyslexia, and ways for testing different aspects of this. We hope this helps!

Check out other awesome blog content:

How to build a business website for free

How to build a business website for free

How to build a business website for free - I’m going to cover a few methods that can be followed for creating a website for free, and then talk a bit about the advantages and disadvantages of this approach. Approach 1 - The business page route There are many platforms...

read more
A message from our Founder, Kevin Gordon

A message from our Founder, Kevin Gordon

A Message from our Founder, Kevin Gordon These are extraordinary and challenging times, for all of us.I wanted to write to you and let you know how Digital Technology Labs (DTL) is planning accordingly to try and mitigate against any long term effects from Covid-19...

read more

Want to get more help or further guidance?

Thank you.

Thanks for visiting. Cheerio! Cheers and bye for now. So, farewell and hope to see you soon.

We've been Digital Technology Labs.

Bye