Readability, Accessibility, and Communicating Through Design

By Carrie Cousins

Thank you to Valley Business FRONT for featuring our Director of Digital Marketing, Carrie Cousins, in their June 2024 issue.

It’s a common thought – and rightly so – that people don’t fully read most things put in front of them. This is especially true when it comes to your website.

What if you are creating a barrier unintentionally almost ensuring that your content doesn’t get read? What if you are turning an audience away or sending a signal that you don’t care because the design is challenging for them to understand?

From readability to accessibility, how you communicate through design speaks volumes about your business and the relationship you have with customers.

But first, let’s dive into two key terms of “designed” communication online:

• Readability: The ease of which someone can scan text quickly and understand the words. Readability relates to everything from the typeface you use to the amount of space between lines of text to how long or short sentences span across the screen.
• Accessibility: The degree to which people with different abilities can access content in a way that they understand. From a design perspective, this can include elements such as color contrast, text size, and making sure everything has a “readable” label.

Both are important because they determine if your website is easy to understand. Clear communication is a key to reading comprehension and even overall website conversions.

Readability and accessibility are pretty complex topics but in the most simple form it comes down to this: Is your communication clear and understandable by all?

While this is by no means an all-inclusive list; here are five things you can do to facilitate readability and accessibility. (We’ll focus everything here on design elements for your website.

• Avoid text effects (or use them sparingly); this includes all caps, underlines, too much centered text, or elaborate or novelty typefaces that make you think to read.
• Give all text elements in the design room to stand alone. You should be able to look at a page and clearly identify different text elements and their groupings, such as headlines, subheaders, body text, or captions. There should be adequate space between lines of text, that’s often 1.25 to 1.5 times the height of the typeface’s characters.
• Pay close attention to color. Text elements should have strong contrast with background elements to ensure they are readable for all people, including those with limited color vision. WebAIM has a great color contrast checker that allows you to enter the color codes for background and text colors to see if they pass basic guidelines.
• The same concept applies to text size. Text on the page should have an obvious and distinct hierarchy, from large to small, using a scale that’s easy for the eyes. Most designers will start with a set of specifications for the body text and scale from there.  
• Use a little math to ensure that your body text size (often the smallest on your website) is easy to read. No matter what typeface you use, the ideal width of a line of copy from left to right is 50 to 75 characters. This means that you probably should not have a text frame that extends all the way across on a desktop screen.

Readability and accessibility are a growing concern for website designs. It’s important to plan new website builds with intention and in a way that makes them work for your target audience. Dive deep into website accessibility with Web Content Accessibility Guidelines (WCAG).

Carrie Cousins is the Director of Digital Marketing at LeadPoint Digital in Roanoke. For 15+ years, she has helped businesses tell their stories and get better results online with practical digital marketing strategies. She also an active leader in AAF, serving on the local and district boards, and is an adjunct professor at Virginia Tech.