Dyslexia

Dyslexia is a learning disorder that is found in certain genes that affect parts of the brain that processes reading and language. This hinders the person’s ability to identify speech sounds and decoding letters and words. In 2017, 5-10% of the world’s population has dyslexia, according to Dyslexia International, which is around 700 million people. There is no cure for dyslexia but there are ways in which typographic designers can help those with it.


Designing for Dyslexia:

Fonts
  • Sans serif typefaces are best suited for those with dyslexia
  • They provide a simple design which allows ease for reading
  • This includes the default typefaces in many programs such as InDesign (Myriad Pro) and Microsoft Word (Arial)
Content design
  • Using 1.5 – 2 line spacing can help with reading large body copies
  • Breaking up paragraphs to be shorter helps with the issue of losing track of where the viewer is
  • Avoid unnecessary italics, underlining, or all caps as it disrupts the readability
  • Use a consistent heading and structure to help with navigation
Layout and graphics
  • Avoid using a white background because it creates too high of a contrast
  • Left align text, no justification
  • Utilize images and diagrams to support your text and rest the viewer’s eyes
  • Enable the user’s ability to customize text colour, size, or typeface to better suit their specific needs
Things to keep in mind while designing
  • Readable fonts
  • Headings and structure
  • Colour
  • Layout
  • Writing style

What has been done:

Christian Boer, a graphic designer with dyslexia designed a typeface to specifically combat dyslexia and help those who suffer from it. When designing his dyslexia-friendly typeface, Boer implemented numerous changes, such as:

  • Heavier bottoms

  • Different shapes

screen-shot-2020-12-17-at-6-25-51-pm

  • Longer stems

screen-shot-2020-12-17-at-6-28-26-pm

  • Emphasize punctuation and capital letters

screen-shot-2020-12-17-at-6-34-18-pm

  • Inclined letters

screen-shot-2020-12-17-at-6-40-40-pm

  • Bigger counters

screen-shot-2020-12-17-at-7-59-08-pm

  • Varying heights

screen-shot-2020-12-17-at-7-41-15-pm

  • Higher x-height

screen-shot-2020-12-17-at-7-49-22-pm

List of dyslexia-friendly typefaces:

  • Dyslexie
  • OpenDyslexic
  • Lexia Readable
  • Read regular
  • Tiresias
  • Sassoon
  • Barrington stroke
  • Myriad pro
  • Century gothic
  • Comic Sans
  • Verdana
  • Arial

What to avoid when designing for dyslexia:

Justified text

  • Large, uneven spaces between words make the white space too distracting for the viewer

screen-shot-2020-12-17-at-5-06-30-pm

Double-space

  • Most websites use typefaces that are proportionately spaced, using a double space, disrupts the consistency
  • Using a double space after a period can create “rivers” which makes it difficult for the reader to locate the end of a sentence

screen-shot-2020-12-17-at-6-12-24-pm

Pure black text on white background

  • The contrast is so high, to some it may cause the text to become warped

screen-shot-2020-12-17-at-5-37-48-pm

Long paragraphs

  • Can get lost with no breaks in a large body copy

screen-shot-2020-12-17-at-6-04-03-pm

Serif fonts

  • The serifs obscure the shape of the glyphs

screen-shot-2020-12-17-at-5-51-33-pm

Italics

  • The tilt in the letterform makes it hard to read

screen-shot-2020-12-17-at-5-55-21-pm


Helpful resources for designing: 

A free way to check if your website is accessible:

https://www.boia.org/products/free-wcag-2-0-aa-report/ 

Dyslexia friendly style guide that goes more in-depth:

https://www.bdadyslexia.org.uk/advice/employers/creating-a-dyslexia-friendly-workplace/dyslexia-friendly-style-guide#:~:text=Readable%20fonts,may%20request%20a%20larger%20font


Citations:

Anthony, et al. “6 Surprising Bad Practices That Hurt Dyslexic Users.” UX Movement, 11 Dec. 2017, uxmovement.com/content/6-surprising-bad-practices-that-hurt-dyslexic-users/.

“Dyslexia – the Facts.” CACHE, www.cache.org.uk/news-media/dyslexia-the-facts.

“Dyslexia.” Mayo Clinic, Mayo Foundation for Medical Education and Research, 22 July 2017, www.mayoclinic.org/diseases-conditions/dyslexia/symptoms-causes/syc-20353552.

Font, Dyslexie. “A UNIQUE TYPEFACE – BETTER READING FOR EVERYBODY.” Dyslexie Font – Better Reading for Everybody, www.dyslexiefont.com/en/typeface/.

“How to Create Accessible Content and Designs for People with Dyslexia.” Bureau of Internet Accessibility, www.boia.org/blog/how-to-create-accessible-content-and-designs-for-people-with-dyslexia.