When designing our blogs and graphics, we tend to focus on making our designs look pretty. Sometimes, as a result, readability gets compromised.
As a blogger, I’m sure you want your posts to be read by as many people as possible. But before that can happen, you have to make sure that your words are easy to read.
Create a comfortable reading experience for all your blog readers by avoiding the following typography mistakes!
1. Using too many fonts.
Using too many fonts can be distracting and make your design look like a ransom note.
Stick to 2–3 fonts at most, and you’re good.
2. Stretching text disproportionately.
Don’t do this! It just looks ugly. 😵
Hold down the shift key while resizing your text in Photoshop (or other design apps) to make it proportionate.
3. Using heavy drop shadow.
Drop shadows often get misused, even in the hands of pro designers.
While they’re an easy way to add depth to your designs, you have to be careful not to overdo them!
Back in design school, I learnt that the secret to great design is subtlety. And it definitely applies to drop shadows.
Good drop shadows look natural and almost unnoticeable.
4. Using ALL CAPS with cursive/script fonts.
Cursive and script fonts just aren’t meant to be used with all caps.
Just like cursive writing IRL, almost all letters should connect to each other, which doesn’t happen if you only use capital letters.
5. Not using light fonts properly.
While light fonts are great for elegant and modern designs, they easily cause readability issues.
As a general rule, avoid using them in small sizes and against dark backgrounds.
If the font you’re using has several font weights (such as Raleway, as seen in the image below), it’s best not to go for the extra-light or thin versions. The only exception to this is if you’re using them for large (and I mean LARGE!) headlines.
6. Completely ignoring hierarchy.
With visual hierarchy, you can guide viewers’ eyes through information in your design, in order of importance. This is accomplished through strategic placement of visual elements.
In the image above, notice how the graphic on the right is soooo much easier to read than the left? That’s what clear visual hierarchy does. 😉
A few ways to create visual hierarchy:
- Size up elements you want to draw attention to (e.g. headlines).
- Use contrast (in colour, shape, texture, etc.) to highlight important areas.
- Position visual elements in a logical manner (e.g. top to bottom/left to right, in order of importance).
7. Centering body text
Unless it’s a poem or lyrics to a song, don’t center your whole body text.
It makes your post awkward and hard to read, because each line starts at a different point.
It’s fine to center small sections of your text, such as quotes or click-to-tweets. Just don’t do it for the whole damn thing!
8. Justifying body text.
Justifying your text creates odd gaps between certain words, which disrupts the reading flow for your users. So stick to good ol’ left alignment.
9. Using a fancy font for body text.
Now this is just torture for all your readers.
Fancy fonts are fine for headings, but when it comes to body text, the simpler the better.
Use a sans-serif font for a modern feel, or a serif font for a more traditional look.
10. Using light text on dark background for body text.
Using light text on dark background for your whole blog post can strain your readers’ eyes. It’s just not ideal for text-heavy content.
To recap, here are the 10 typography mistakes that make your blog unreadable:
- Using too many fonts.
- Stretching text disproportionately.
- Using heavy drop shadow.
- Using ALL CAPS with cursive/script fonts.
- Not using light fonts properly.
- Completely ignoring hierarchy.
- Centering body text.
- Justifying body text.
- Using a fancy font for body text.
- Using light text on dark background for body text.
For more tips on designing your blog for readability, check out 7 Colour Combinations You Should NEVER Use on Your Blog!