Accessible Typography Essentials

Accessible Typography Essentials

Hello! Carie Fisher, MS, CPWA Sr. Accessibility Consultant & Trainer HCI Ph.D. Student at Iowa State University

Accessible Typography = Inclusion

01 Color & Contrast

Color & Contrast Takeaways 01 02 03 Small text (14 pt or smaller) must have a contrast ratio of 4.5:1 Large text (14 pt bold or 18pt) must have a contrast ratio of 3:1 Icons and essential images must have a contrast ratio of 3:1 04 05 06 Use solid color backgrounds to help with readability Do not rely on color alone to convey information Avoid certain color combinations like red + green and shades of gray

02 Typeface & Styling

Typeface & Styling Takeaways 01 02 03 Use common fonts like Arial or Open Sans whenever possible Avoid using speciality typefaces that target certain disabilities Pick a typeface that has unique characteristics 04 05 06 Font size for copy needs to be minimum of 14 pts (bonus points if larger) Limit the number of typeface variations to increase readability Avoid using only color, ALL CAPS, or italic styling to emphasize a word

03 Structure & Layout

Structure & Layout Takeaways 01 02 03 Use elements like headings to break up the page into sections Add visual elements like lists, numbers, and quotations Try not to exceed 80 characters per paragraph line 04 05 06 Line height needs to be 1.5X the typeface, and paragraph spacing is 2X Letter spacing should be 0.12X the typeface, and word spacing is 0.16X Avoid justified paragraph alignment which create “rivers of space”

Thanks! @cariefisher /in/cariefisher cariefisher.com