Everyone can agree that an aesthetic website is great to look at, but what about the content that fills it? An interesting, and equally important, aspect is readability. It doesn’t matter how clever your school marketing is, if no can (or will) read your content.
The unfortunate truth is that website visitors don’t read content anymore. Instead, visitors scan pages, catching only 20-28 percent of all words. This, combined with the rise of mobile web browsing, makes it even more important to make reading easier for your website visitors.
What is Readability and Why is it Important?
Readability measures the complexity of the words and sentence structure on your website. Legibility, the size and contrast of the text, also has an influence on readability.
Readability is important for two main reasons:
It helps website visitors who are scanning content (on desktop or on mobile) quickly find the information they are looking for.
It impacts your website’s overall accessibility — which refers to making your website usable by as many people as possible, including those with disabilities or situational limitations.
1. Choose Typography Wisely
Your typography is the foundation of readability and legibility on any school website. Typography is the combination of fonts, their sizes, and their spacing. You should aim to have a consistent theme with your fonts to avoid confusing the website visitor.
Here are a few tips to help you with your font choices.
Heading tags should be relative in size to each other, starting with large and scale down as you go from H1 to H6
The minimum font size that is comfortable to read is 16px, but please keep in mind that different fonts have different base sizes
2. Use Shorter Sentences and Easy-to-Understand Words
Although prospective parents may be willing to read longer sentences and paragraphs in print, they most likely won’t want to read that much online (especially when browsing from their phones). Short paragraphs make it easier for your website visitors to scan pages.
3. Use Heading Tags Strategically
Your school website’s heading tags (H1, H2, H3, etc) may be styled in a way that inspires you to use them throughout your site, but these tags serve an important function. These are designed to help separate content and explain to the user what is most important to least important information on the page. Each heading should signify an important section of the page and should appear every two to three paragraphs. When heading tags are used correctly, screen readers do a better job at reading the information back to a person with visual impairments.
4. Use Images to Break up Text
Walls of text can be intimidating and difficult to read. Website visitors love photography that compliments what they’re reading. The photos help give the reader a visual break while keeping them engaged. Plus the visuals help them better understand that content they’re reading.
5. Leverage Whitespace
Whitespace is an underrated asset at times. Many people view whitespace as large areas of the screen that are blank. While this is true, another form of whitespace that is even more important is the space between text and letterforms. Here are a few tips to help you create more whitespace.
Use bullet points to break up the text and make it more scannable.
Create a new paragraph every four lines or so with a line of space between the current and next paragraphs.
Use table headers to help define what information is being displayed in the table.
Readability is important to ensure your website’s content is both easy-to-scan and accessible. Work with your website provider to choose typography colors and styles that can help website visitors of all kinds easily scan, read, and enjoy your website’s text content.
ABOUT THE AUTHOR
Keisha is one of Finalsite's many talented web designers and front-end developers. She currently serves on the board of directors for AIGA, a professional design association. On a personal level, Keisha loves interesting fashion, traveling to new places with great art museums, and killer make-up and nail art.