This blog is part of a three-part Design Accessibility for Nonprofit Brands series. Check out parts one and two: What is design accessibility for a nonprofit brand? and How to design an accessible color palette. Do you have a branding project in mind? We’d love to hear about it.
Your organization’s typeface and fonts are a key part of your brand (check out How to choose a typeface for your nonprofit’s brand identity to learn more about what typeface might be right for your organization).
In addition to selecting a typeface that looks great and rings true with your brand attributes, it’s important to carefully consider typography accessibility. For more information on what design accessibility is, check out: What is design accessibility for a nonprofit brand?
The work of creating an accessible color palette directly informs the work of creating accessible typography (e.g. If a specific shade of light blue is inaccessible against a specific shade of light green, light blue type on a light green background will be illegible). Considering color and typography accessibility in tandem will help to craft a visually-compelling brand that serves print, environmental, and digital spaces equally well.
Other factors beyond color, like type weight and size, also play a role in creating accessible typography. A color combination that is accessible for large, bold type may not be accessible for small, fine type.
According to Web Content Accessibility Guidelines (WCAG) 2.1, a website compliant with Level AA guidelines must utilize a contrast ratio of 4:5:1 for normal text, and 3:1 for large text. If that sounds like gobbledygook, don’t worry – online color contrast checkers like this one make checking for accessibility a breeze.
A helpful rule of thumb is: As type size and weight go down, color contrast must go up.
Where smaller type (think body text) may be more utilitarian, display type is a designer’s playground. In terms of design accessibility, this is because a wider range of color combinations have sufficient color contrast for large type.
Those high-contrast color combos required for smaller type may be a striking design choice for bigger, bolder text. Or, larger text with slightly less (but Level AA compliant) color contrast may harmonize better with your brand. The point is that there’s more space to play. As always, framing your design choices around your brand attributes will result in visuals that resonate with your audiences.
If you don’t see a website redesign on the horizon, scalability (the ability of users to scale your website to 200% without disrupting the flow of text) may not feel like a priority. But, like color, it’s important to bear accessibility in mind in the early stages of creative direction in order to avoid the need for disruptive changes later on.
An ultra-wide typeface with super-airy leading, for instance, may not be the most accessible choice. Selecting typefaces with flexibility (e.g. that play well with an underline or offer a wide range of weights) will make the ultimate translation of your brand to digital seamless (e.g. styling type in a way that makes links clearly identifiable).
Thankfully, the world of typography is huge, so designing within the bounds of accessibility guidelines is not overly restrictive – and the payoff is enormous. By considering design accessibility early on, you’ll be able to craft a durable brand that maximizes your impact for years to come.
Missed our first two posts on Design Accessibility for Nonprofit Brands? Check out: What is design accessibility for a nonprofit brand? and How to design an accessible color palette.
