The body text on your website is too small. While desktop monitors and phone screens seem to be increasing in size, body font sizes have seemingly shrunk. While their original size is the same, they feel smaller than ever.
Too often, I find myself squinting at the screen to read content. And it shouldn’t be that way. Today we’re looking at the reasons for this increasing problem, and how you can fix it!
The Case For Larger Text
Small text sizes are an old-school concept in terms of website design. The idea of using 12-point text for body copy dates almost back to the first days of the internet and digital publishing when the default size on word processors was 12 points. (That’s really how designers started using this unofficial guideline.)
But screens were also a lot smaller then. And 12-point type in a location a couple feet from your eyes can be a lot to read.
Oversized headlines and subheads have been trending for quite some time, and your body copy needs to catch up. Even Kissmetrics, a blog about web analytics, marketing and testing, noted that most websites have fonts that are too small. They even called this one of the “7 Deadly Sins of Web Design.”
Here’s the big reason: You have to grab the attention of users right away, and small typefaces just won’t cut it with so many other options available for a user’s time.
Still not convinced? Here are four more reasons your body type should be bigger.
1. It’s Easier to Read
Readability is a big deal. Why would you design a website that is difficult for a user to read?
The first lesson is to ditch the pure numeric measure for body text on the web. It doesn’t really matter whether your text is 12 point or 16 points or 22 points if you can’t read it. (Text sizing is not universal and varies depending on the typeface anyway.) Body text should be proportionate to everything else on the screen and easy for users to see from somewhat of a distance.
The standard for some time has been that 45 to 60 characters per line in a single column (this does include punctuation and spaces) is the ideal length for most readers. So, you need to think about the size of the most common browsers, the width of the column you are using and start with a size of text that falls into that range. Then remember to adjust accordingly for responsive breakpoints.
The range is somewhat tighter for smaller screens where most people agree that larger text is better. (Thank half of that line count range.)
The trick is creating a scale that’s comfortable for reading. And the more body sized-text you have to work with, the more important this becomes. Text that’s too wide can make it hard to focus and move from line to line when reading; text that’s too narrow does not have a good rhythm and cause the eye to move too fast when reading.
The size of text contributes to the overall usability of a website design.
If all text is scaled proportionately, larger body copy also helps bump of the size of other user interface elements such as navigation links or button text. It can help contribute to overall flow.
Larger text will also help you make better decisions about content and edit more selectively, which is always a good thing for users. This streamlining helps bring the most important elements to the forefront of the design. Remember, users have the attention span of a goldfish – if that – so everything they need to understand the design and how to interact with it must be accessible at a glance.
Here’s the other trickle–down bonus of larger type – it will encourage you to rethink padding, photo placement and linespacing as well. Everything in the design will benefit from rethinking type size because it all works congruently to create a put together final product. All that editing and rethinking of how to place parts can result in improved usability because you are actually taking time to evaluate individual elements in the design, rather than just plopping everything down in the same way to usually do.
3. It Reduces Fatigue
User fatigue can be a real problem. Most people look at screens all day long, from glancing at phones to playing games to tablets to working on computers or watching television. Their eyes are tired.
Larger text sizes can help decrease some of this screen fatigue.
Another common source of screen fatigue comes in the form of mobile devices and users having to reach across the screen for elements. Larger phones are decreasing areas that are easy to reach by thumb, but larger elements and body text can help solve this dilemma.
One reason larger sizes for text and other user interface elements is important is because it helps adjust the visual display to match the physical one, providing more comfort for users.
4. It Increases Visual Impact
You want your website design to make a strong first impression. Larger text can have a strong visual presence and impact than smaller text. It’s bolder and more in-your-face. It demands to be read.
These tactics all help grab the user’s attention and hold on it.
The unintended consequence of using larger body type is that most everything else in your design will likely enlarge as well. This is most likely the case with space. Larger type will help you create room for more space in the design. More space often creates a more comfortable user experience and adds an element of contrast that helps draw users to the occupied parts of the design. (It’s design theory at a basic level, but it works.)
Larger type and increased spacing are elements that most users won’t see or talk about, but will just find that they appreciate. The experience will be easier and hopefully will result in an uptick in website analytics such as time on site or pages per visitor. (These measures can be a key factor in determining if the move to larger type is making a difference for users.)
Conclusion
Smashing Magazine published an article in 2011 that asserts that anything less than 16 pixels for body text is too small. I would tend to agree.
And then take it a step further. Test out 18, 20 or even 22 points for your body copy. Even if it seems awkward at first, you’ll find that it is easy to read. It’s easy to digest. And it makes content feel a little less overwhelming. Make it easy for users and they’ll thank you by spending more time on your website.
Source: Design Shack
