A Guide to Understanding What Makes a Typeface Accessible

And how to make more informed font choices.

Content By The Readability Group

Large classic hand drawn E on graph paper

Typefaces are the foundation of accessible visual reading experiences, so choosing a performant typeface that enhances legibility and readability for people with poor vision, learning disabilities, aphasia, dyslexia or low adult literacy is of paramount importance if you want your written information to be as accessible as possible.

The type design elements in this article form a baseline for accessibility. To be truly accessible type has to be designed in combination with the other best practices but without a good choice of typeface things like colour contrast will have limited impact.

The elements listed below are not the only considerations for typeface accessibility, but they are a foundation to help make informed choices that are based on neuroscience and user data from the formative study. There are some typefaces that claim to be “accessible” for various user groups but are based on little more than hypothesis and anecdote, so check claims before you make a decision.

If learning more about the subject is something you would like to explore further, an extensive list of reliable studies and resources are listed at the end of this article.

BBC Reith and Qalam

When developing and testing BBC Reith and Qalam, the project team included a neuroscientist, Dr Alessia Nicotra MD, PhD Neurology and Neurophysiology, as an expert advisor. This was to help develop an understanding within the team of how different people with different abilities read. This not only informed the approach to developing Reith but it also informed the methodologies used when it came to the various rounds of readability testing.

The user groups in the research included people with moderate to severe vision impairment, dyslexia and people who didn’t identify with any related condition and BBC Reith outperformed the typefaces it was benchmarked against; Helvetica, Ariel, Gill Sans and Tiresias.

BBC Reith Basic Character Set
BBC Reith

Accessibility Features

A byproduct of the research and many rounds of contextual user testing enabled us to identify the following considerations. When these are applied in combination, can inform typeface design or font choices that enable greater legibility, readability and therefore accessibility for people whom either have a learning disability, visual impairment, aphasia or dyslexia, whilst retaining the brand integrity of any organisation’s website or application.

It is worth noting at this point that Dyslexia is not a visual but rather a developmental neurological condition that affects the processing of word sound and comprehension. There are a number of other cognitive traits or conditions such as letter mirroring which affects people without dyslexia too. These include Irlen syndrome or visual discomfort (migraines) that affect a significant percentage of the population including people with dyslexia but not exclusive to the condition. It is also worth noting that the occurrence of dyslexia is significantly impacted by the transparency or opaqueness of language. As a result instances of dyslexia in languages like German or Italian are significantly lower than for English or French.

Some of these traits that are not core to a dyslexia diagnosis are better served through the provision of lower contrast colour schemes or specific colour combinations that support specific visual processing needs.

So here are a few guidelines you can use:

  1. Use a font style that is appropriate to your audience.
  2. Minimise the occurrence of imposter letter shapes that are designed to be very similar to other letter shapes as part of the typeface’s visual style.
  3. Minimise the occurrence of mirroring letter shapes.
  4. Letters should be easily distinguishable from one another.
  5. Humanist typefaces are generally more legible at smaller sizes than grotesque typefaces.
  6. Ensure the typeface has adequate letter spacing.
  7. There should be a visible difference between capital height and ascenders.
  8. Test the suitability of any typeface/font in context.

1. Use a Typeface that is Appropriate to Your Audience and The Organisation’s Brand.

For Children or Adults who are learning to read or have a low reading ability, the less complex shapes of sans serif typefaces can help with character recognition. Serif style typefaces can enable more fluid readability for advanced readers due to the additional disambiguated letter shaping. Serifs form word shapes to enable more fluid readability however sans serif can aid individual character recognition for less advanced readers.

Longer reading experiences can benefit from serifs which enable better saccadic flow of reading, reducing user fatigue and increasing reading speeds and comprehension.

For the youngest readers, adults with low literacy or for people with more profound learning difficulties the single storey ‘a’ (Example in Comic Sans) can be easier to recognise than its double storey variant.

Comic Sans written in the typeface over the image of Nigel Farage
Two Ridiculous Faces © David Bailey

This and the more casual visual style in Comic Sans is popular with organisations that focus on communicating with children or about children. This choice however can undermine an organisation where the tone should be more formal or fashionable, and undermine the organisation’s brand integrity.

Higgs Boson Discovery Announcement Made In Comic Sans (https://www.huffingtonpost.co.uk/2012/07/04/higgs-boson-discovery-comic-sans_n_1648494.html

For advanced readers a single storey ‘a’ can be a distraction to the smooth reading experience because of its similarity to other letter shapes such as ‘o’ or ‘c’, or ‘d’ even. Once learned, a double storey ‘a’ provides a better differentiation and aids reading flow.

As children develop their reading ability develops. They start by learning the individual character shapes and associated sounds, then they move to recognising groupings, full words and eventually move to reading in saccades. During a saccade the eye/brain fixates on a single character picking up two to three characters to the left and three to four characters to the right, and eventually jumps to the next fixation point, approx. seven characters ahead. Please be mindful of your intended audience as not everyone may have acquired the same proficiency levels of saccadic reading.

In some instances typeface/font accessibility might be treated as an ‘alternative’ the user can switch to or as with BBC Reith, there are additional characters or font variations so the default can be optimised for children or display in difficult contexts such as a condensed version for data tables.

2. Avoid Imposter Letter Shapes that are Designed to be Very Similar to Other Letter Shapes.

Some typefaces have letterform designs that are virtually identical for multiple letters.

The letters “I1l” (upper case ‘i’, the number one and lower case L in Gill Sans) are a good example of this issue.

I, l and 1 in Gill Sans all look the same
Upper case ‘i’, lower case ‘L’ and 1 in Gill Sans

To avoid this problem choose a typeface or font with distinct features on both the top and/or the bottom of the capital ‘I’ and a short but noticeable arm on the top of the number ‘1’.

I, l and 1 in Verdana are all unique shapes
Upper case ‘i’, lower case ‘L’ and 1 in Verdana

3. Ensure there is no Mirroring.

All sighted young children horizontally flip letters as part of their early neurological development. At around the age of six years old, however, this neurological trait resolves itself as part of ongoing physiological development, however in some children this development stage doesn’t occur and accordingly letter flipping effect is lifelong. In extremely rare occasions the mirroring effect may also be re-introduced because of brain trauma. As such d and b, or q and p, should be obviously unique in shape and have no ambiguous characteristics.

Comparison between dbqp in BBC Reith and Public Sans
BBC Reith on the left has unique shapes whilst Public Sans on the right employs mirroring

4. Letters should be Easily Distinguishable From One Another.

For people with moderate to more severe vision impairment the characters o, c, e or a can be easily confused, which in turn makes words harder to identify.

If the shapes are too closed, or their counters are too small, then they can begin to look very similar. Typefaces with tight apertures can cause the counter to appear fully closed to many readers with moderate to severe vision impairment or lower reading ability. Conversely more open counters within the letterforms themselves can increase legibility by better emphasising the unique shape, and are therefore preferable.

Microsoft Sans and Trebuchet Comparison shows Trebuchet has more original letter shapes
Microsoft Sans on the left and Trebuchet on the right

5. Humanist Typefaces are Generally More Legible at Smaller Sizes than Grotesque Typefaces

Humanist typefaces tend to have more varied character widths. This aids with disambiguated letter shaping, and thus aids in particular with quick and accurate letter recognition. Varied character widths aid character recognition for people with all types of eye condition or learning disabilities.

Calibri is Humanist and Helvetica is Grotesque
Focus on the spaces between the letters

6. Ensure The Typeface Has Adequate Letter Spacing

The tighter the letter spacing is the less people with even mild vision impairments are able to identify the individual characters. Letters can become adjoined such as “ol”, “lo” or “vv”, or simply make the individual letter shapes within tight groupings harder to decode. Tight letter spacing is also causes reduced readability for people with good vision and reading proficiency.

In particular people with vision impairment, reading difficulties or cognitive disabilities struggle with tight letter spacing as it creates visual crowding which can make the job of focusing on and recognising an individual character difficult.

In a comparison between Helvetica Neue and Lucida Sans, Lucida shows better letter spacing
Helvetica Neue on the left and Lucida Sans on the right

7. There Should be a Visible Difference Between Capital Height and Ascenders

Ambiguity can impact character recognition and, accordingly, the quick and correct decoding of characters (legibility). Raising Ascenders above capital heights and other features can greatly improve individual character recognition.

Public Sans has different height ascenders between I and l whereas Microsoft Sans doesnt
Microsoft Sans on the left, Public Sans on the right

8. Test the Suitability of any Typeface/Font in Context

When selecting a typeface/font for use in a website or an app, test readability and legibility in comparison with other candidates. The characteristics in recommendations 1 to 7 provide a starting point for discussion and expert review. However these, like all accessibility guidelines, are of technical nature, whereas usability and effectiveness can only be measured by testing with a broad range of people with and without impairments or disabilities. Recommended conditions to be focused on with the user group are people with Dyslexia as well as Moderate to Severe Vision Impairment, Aphasia and Adult Learning Disabilities.

Testing is recommended to be done in isolation as well as in situ to ensure that the combination of typeface/font, along with it’s design application, does not negatively impact your reading audience, and that the choice is based on a performant typeface as well as typography. This can be approached in a number of ways and function should be measured in combination of preference and performance.

Thanks for input and help with this article goes to my fellow Readability Group collaborators:

Bruno Maag, Chairman of Dalton Maag

David Bailey, Principal Designer (Brand), BBC

Michael Mathews, Senior Research Engineer, Accessibility, BBC

Presentation on BBC Reith and Typeface Accessibility @ Helsinki Design Week 2020
Axe-Con Presentation on the Quant Font Accessibility Preference Research, Don’t Believe The Type!

Related WCAG Design Guidelines

Captions 1.2.2, Colour Contrast 1.4.3, Resizing of Text 1.4.4, Images of Text 1.4.5, Contrast (enhanced)1.4.6, Visual Presentation 1.4.8, Images of Text (no exception) 1.4.9, Text Spacing 1.4.12 and Reading Level 3.1.5

Academic Papers, Web Articles and Blogs

A Practical Handbook on Accessible Graphic Design

Association of Registered Graphic Designers, Canada https://www.rgd.ca/resources/accessibility/access

Anatomy of the Brain

Mayfied Clinic https://mayfieldclinic.com/pe-anatbrain.htm

A Ventral Visual Stream Reading Center Independent of Visual Experience

Lior Reich, Marcin Szwed, Laurent Cohen and Amir Amedi https://www.sciencedirect.com/science/article/pii/S0960982211000637

Department of Medical Neurobiology, Institute for Medical Research Israel-Canada

The Edmond and Lily Safra Center for Brain Sciences The Hebrew University of Jerusalem

ICM Research Center NeuroSpin Center, Commissariat à l’E ́nergie Atomique

Department of Neurology, Assistance Publique–Hôpitaux de Paris, Groupe Hospitalier Pitié -Salpêtrière

Published online: February 17, 2011

BBC Reith — Dalton Maag https://www.daltonmaag.com/work/bbc-reith

BBC’s New Typeface BBC Reith is Designed to Improve Legibility on Screen. Lucy Bourton https://www.itsnicethat.com/news/bbc-reith-typeface-graphic-design-110817

Get To Grips With Accessible Web Typography. Phil Garnham, Netmag https://www.creativebloq.com/features/master-accessible-web-typography

Introducing Reith — the new face of the BBC. David Bailey, BBC https://www.bbc.co.uk/gel/articles/introducing-bbc-reith

It’s About Legibility, Allan Haley, Monotype https://www.fonts.com/content/learning/fontology/level-4/fine-typography/legibility

Legibility and Readability, What’s the Difference? Ilene Strizver https://creativepro.com/legibility-and-readability-whats-the-difference/

Reading in the Brain. Stanislas Dehaene https://readinginthebrain.pagesperso-orange.fr/intro.htm

ISBN 9780143118053

The Dyslexia Debate (Cambridge Studies in Cognitive and Perceptual Development). Julian G. Elliott, Elena L. Grigorenko

ISBN: 9780521135870

Typeface Legibility for Visually Impaired Readers. Sophie Beier https://sofiebeier.dk/

The Science of Word Recognition. Kevin Larson, Microsoft https://docs.microsoft.com/en-us/typography/develop/word-recognition

The Effect of Type Design and Typesetting on Visually Impaired Readers. Eleni Beveratou, Dalton Maag https://www.researchgate.net/publication/309749121_The_effect_of_type_design_and_typesetting_on_visually_impaired_readers

Why do some children learn to read without explicit teaching? Jennifer Buckingham & Anne Castles https://www.nomanis.com.au/post/why-do-some-children-learn-to-read-without-explicit-teaching

Adult Literacy Reports for the UK and US

Specifying a Reading Age for Web Content

by Sarah Richards https://contentdesign.london/reading/specifying-a-reading-age-for-web-content/

Adult Education Survey

Department for Education https://www.gov.uk/government/publications/adult-education-survey-2016

Understanding the Basic Reading Skills of U.S. Adults: Reading Components in the PIAAC Literacy Survey

John Sabatini, Educational Testing Service https://lincs.ed.gov/professional-development/resource-collections/profile-896

#accessibility #a11y #fonts #typefaces #Dyslexia #Neurodiversity #cognitive #design #typography #graphics #inclusion #ADHD #cognition

The UX Collective donates US$1 for each article published in our platform. This story contributed to Bay Area Black Designers: a professional development community for Black people who are digital designers and researchers in the San Francisco Bay Area. By joining together in community, members share inspiration, connection, peer mentorship, professional development, resources, feedback, support, and resilience. Silence against systemic racism is not an option. Build the design community you believe in.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store