Skip to main content

Accessibility of Typography [Infographic]

Designers need to know how to measure typographic accessibility, or how accessible a font is.

This is a pretty fascinating idea to me as it’s not something I’ve thought much about (not a designer!). Choosing an accessible font for your website and collateral is important for all brands. We often consider inclusive design and accessibility enhancements that can be made to our clients’ sites, of course. A fairly easy win for the latter, for example, is to add alt tags for images that are displayed on a website. Alt tags tell someone using a screen reader what an image shows and can increase the ease with which someone who is visually impaired navigates the site.

Fonts used on a webpage should be legible and readable. A typeface that is clear and easy to read helps people with low vision make out the characters more easily as well as reduces the strain of reading for someone with a learning disability.

How do you achieve accessibility in typography?

Is it legible? Clearly, this is the key question.

The below infographic from Fontsmith uses the typeface FSMe as an example as they outline the main features to gauge as you select a font designed specifically with improving legibility in mind.

Here are a few more concepts and principles of readability:

Contrast

Good contrasts help text be read easily and scanned quickly. And you’ve seen poor contrast: anytime a page makes you squint and you can’t read the text well. Pink text on a blue background? Headache!

Line height and letter spacing

The space between individual lines of text is another factor in readability of body text. Sufficient line height makes the text more scannable while too short line height isn’t easy on the eyes.

Similarly, the spacing between letterforms should be balanced as well to aid in ease of reading.

User-friendly characters

Avoid type styles where there is ambiguity between certain characters. Do you capital “L,” lowercase “l,” and “1” all look the same? What about “8” and “B”? Or “0” and “O”? Is your chosen typeface’s lowercase “a” differentiated from the “o”? Any chances you see to eliminate confusion and enhance legibility, take ’em!

~ ~ ~

As Fontsmith smartly points out, this isn’t an exact science. But it’s important to know your audience when designing and to make decisions on what will best fit their needs and wants. Check out the infographic for more great typographic accessibility considerations! And if you need help with inclusive design, drop us a line.

typography accessibility infographic

Leave a Reply

Your email address will not be published. Required fields are marked *