October is Dyslexia Awareness Month, and throughout the month, organizations like the International Dyslexia Association (IDA) will showcase stories and insights from people who live with dyslexia.
The goal is to build a better understanding of how the condition affects people while dispelling some common myths. Following updates on the IDA’s website and social media channels is a great way to participate.
In the digital accessibility space, dyslexia is often overlooked. People tend to focus on vision- and hearing-related disabilities, which certainly deserve consideration. However, learning disorders can also affect online experiences.
Of course, the goal of web accessibility is to improve the internet for everyone — including those with neurocognitive differences. By learning more about how dyslexia impacts users, you can create more inclusive content.
Dyslexia is a problem with language, not a problem with vision
An estimated 15% of the U.S. population has dyslexia. As the most common learning disorder, dyslexia affects people in profoundly different ways, and myths about dyslexia are common.
For example, dyslexia doesn’t simply reverse the order of letters or flip characters upside down. People with dyslexia sometimes say that letters tend to “jump around" on the page, but dyslexia doesn’t affect vision directly. People with the condition have difficulty relating speech sounds to letters and words.
It’s important to understand that dyslexia does not affect intelligence, vision, or hearing. In fact, some advocates believe that the term “learning disorder" is misleading, since dyslexia doesn’t always affect oral language skills — the term “reading disorder" may be more accurate.
Creating a Better Internet for People with Dyslexia
While there is no cure for dyslexia, many people find ways to adapt. When using the internet, they may change their default font settings or use high-contrast modes (also called dark modes) to make words more readable.
If your website follows the best practices of the Web Content Accessibility Guidelines (WCAG), you’re well positioned to provide these users with a better experience.
WCAG includes requirements that address many aspects of cognitive accessibility, including:
- Providing users with enough time to read content at their own pace (WCAG Guideline 2.2).
- Creating text content that is readable and understandable (Guideline 3.1).
- Making web pages operate in predictable ways (Guideline 3.2).
- Creating content that can be presented in different ways without losing information or structure (Guideline 1.3).
If you’re new to accessibility, consider auditing your website against WCAG’s Level AA success criteria. Below, we’ll discuss some specific ways to tailor your content for users with dyslexia.
Use appropriate color contrast
Color contrast refers to the difference in luminance (light) between text and its background. Low-contrast text is difficult to read — and unfortunately, poor color contrast is one of the most common accessibility barriers.
To meet WCAG requirements, normal text (including images of text) must meet a contrast ratio of at least 4.5:1. Large text (18 point or larger, or 14 point or larger and bold) must meet a contrast ratio of at least 3:1.
To check your website’s color contrast or test color-pairs, you can use a11y® Color Contrast Accessibility Validator, a free instant color contrast analysis provided by the Bureau of Internet Accessibility.
Choose an accessible font
WCAG doesn’t recommend a specific font or set of fonts. That’s partly because the relationship between font choice and accessibility is murky at best — certain fonts might improve readability for some people with dyslexia, but not others.
However, you can make your text more legible by choosing a common, basic font. Sans serif fonts are considered better for accessibility, since they can be displayed on smaller screens without crowding letters together.
Popular options include:
- Lucida Sans
However, it’s far more important to break up paragraphs into smaller “chunks" of content and maintain a consistent visual appearance for all of your text. Avoid using too many different fonts on your website, and present text in a normal size. 12 to 14 points is standard for most web content, but larger text may be helpful when writing content specifically for people with disabilities.
Use images thoughtfully
Avoid using images that contain pictures of text. Some users may zoom in on content to improve readability, and pictures of text may not scale appropriately.
However, you can (and should) use multimedia to support your content. Adding graphs, demonstration photos, and videos can provide people with another way to understand your message without reading through every line of text.
Remember, accessibility is for everyone! Write descriptive alternative text for images and and provide captions and transcripts for videos.
Structure your content and use responsive design
When your website uses appropriate semantic HTML, your visitors have more ways to enjoy your content. They might scale the text to 200%, use a screen reader or other assistive technology, or browse with a keyboard alone — and structural HTML ensures that every user has the same essential experience.
A few quick tips to keep in mind:
- Use headings to break up longer pieces of content. Headings should always nest in sequential order (for instance, <h3> tags should appear under an <h2> tag).
- Make sure each page has a descriptive, unique title tag. This helps people understand the contents of each page.
- Use bulleted lists with appropriate HTML.
- Wherever possible, break up large paragraphs into smaller paragraphs.
Finally, follow the best practices of responsive design. When content is responsive, people can view it on different types of screens without scrolling in two directions.
Related: Responsive Design and Accessibility
Following WCAG improves online experiences for everyone
Dyslexia affects people in profoundly different ways. To provide an optimal experience for every user, you’ll need to follow established standards.
Testing your content against the latest version of WCAG can help you achieve your accessibility goals, opening up the tremendous benefits of accessible design. When you provide a consistent experience to every user, you’ll enjoy improved brand sentiment, more traffic, and even enhanced search engine optimization (SEO).