📜 ⬆️ ⬇️

Opinion: body text at 16px

Not so long ago, an article was published in the beloved SmashingMagazine, in which the author cites his theory of 16 pixels as the size of the main text, and argues for its defense. The article caused a rather heated discussion, and today we post its translation.

Translation provided by Naikom web design blog.

For the main text, anything less than 16 is a terrible mistake.


I know what you're thinking right now: “Did he just say 16 pixels? For the main text? Awful lot! 12 pixels is perfect for most websites. ”
I would like to convince you otherwise.

Usability expert Oliver Reichenstein (Oliver Reichenstein) in the article " The 100% Easy-2-Read Standard " said:
“16 pixels is not much. This is the default text size in the browser. Browsers were designed to show this size ... At first glance, it seems a bit much, but as soon as you try, you will immediately understand why all browser developers chose this default text size. ”
')
In this article I will explain why 16 pixels is the minimum size for the main text in modern web design. If you do not change your opinion, then please express your arguments in the comments.

You see, in most cases, if you create a website with a font size between 10 and 15 pixels, you spend money on the client . And that's why.

Readers is income

If you create a website for someone - even for yourself - most likely, your goal is to make money.

Maybe sell the product directly, or offer a service, or just to get clicks. In any case, this is a business asset, and ultimately it must pay back your investments. It should be profitable.
Thus, each element must be designed to achieve this goal. Including the text. Especially the text - because the text convinces visitors to do what you want.
Think about it. If you do not explain what people should do, and why they should do it, then of course they will not do it. And the only way to tell them is text. And the text implies reading.

Important facts about reading

There are some facts that are crucial for issues such as readers, reading and understanding, and this is all about the text. If people don't read it, or if they can't read or understand it, then what's the point of it, isn't it?

  1. In 40 years, only half the light passes to the retina, in contrast to 20 years. For 60-year-olds - only 20%.
  2. Almost 9% of all Americans complain of poor eyesight (I would not be surprised if this indicator is worse in Russia), that is, their vision cannot be completely corrected with lenses.
  3. From the distance at which we can read characters, the intelligibility and speed of reading depends. The greater the distance, the greater the understanding. The most important factor that determines how far this distance can increase is in font size. Remember billboards, for example.
  4. Most people are about 50 centimeters from the computer screen. In fact, the recommended distance is 60 centimeters , because at this distance you can avoid excessive eye strain. This is much more than the distance at which we read the printed text - most people do not keep a magazine at arm's length!
  5. 16-pixel text on the screen is about the same size as text printed in a book or magazine. Since we read the print quite closely — often just a few tens of centimeters away — there, as a rule, the font is set at about 10pts. If you read at arm's length, it would be the same size as 16 pixels on all screens:

    image
    16px text on a 24 'monitor and 12pt text in a book

    image
    16px text on 15.4 'monitor and 12pt text in book

  6. In 2005, a survey was conducted about web design problems, and a bad font received almost twice as many votes as other problems; two thirds of the respondents complained about the small font size. If you think the situation has improved since then, think again. I did a random sample of some of the SiteInspire designs and found that the average font size for the body text is a measly 12 pixels. Some projects even used even less - 10 pixels. None of the fonts exceeded 14 pixels. Similarly, if you make random samples from the popular Elegant Themes and ThemeForest today , you will find that the text of each sample will be 12 or 13 pixels in size.

    image



Fact: Most users hate “normal” font size.

Let me ask you: What percentage of your readers are people over 40? To read the text, their eyes must work twice as much as the eyes of a 20-year-old. If their age approaches 60, the eyes should work four times as much.
Nearly 1 in 10 of your readers have eye problems. And even those who have no problems will still have to strain to read a text less than 16 pixels in size , even if they do not notice that they are doing so. (How often do you notice that you are pressed to the screen?) And if they have to bend down, then, most likely, they will be embarrassed and uncomfortable. Natural posture in front of the computer - at least at arm's length from the screen!
In short, the average user reading is annoying.
The harder it is to read your text, the less meaning will be understood. 10 pixels will be useless. 12 pixels is still too small for most readers. Even 14 pixels can scare off visitors who otherwise would have remained.
Thus, we can conclude that if you want to achieve the maximum number of readers, then you need to set its minimum size to 16 pixels.

"But users can enlarge the text"

“If you make the right code, people with visual problems can always use the approximation function to enlarge the text,” said one web designer in a dispute on this issue. In fact, it is not. Users who need to change the settings, as a rule, do not know how to do this. And those who can ... most likely, they will choose an easier way, simply by pressing the "Back" button. It goes without saying that we should not use the money of our clients to create an inconvenient design for users. Our personal tastes should not be put above usability.

Web design is not only what designers like. It's about what users want and what will help you achieve our customers' goals.

If the goal of the website is to generate income, then our role as designers is to come up with something to achieve this goal as efficiently as possible. Choosing a font size that will make reading difficult will lead to a reduction in readership, so you do not need to save on font size due to conversion.
In the design of prints, font size 8 will be the perfect compromise between ease of reading and cost, because you have to pay for every millimeter of paper. On the Internet, you do not pay anything for the use of space - provided that readers enjoy your text.
So, the question is, are you willing to spend the money of your customers for the sake of what only you like?

16 pixels is not much

Our design tastes and aesthetic preferences are more flexible than we think. What we like is largely the result of what we have already seen with other designers and what we expect.
Unfortunately, on most websites, the texts are tiny, because once the screens were tiny, and the designers have not yet abandoned this habit.
The original of this article is written in a 19px font. This size was chosen because even 16-18 pixels seemed too small: if you get comfortable in a chair, at a distance of 70 cm from the screen, you may find that you have to squint to look at the text. If I used the Georgia or Verdana font, 16 pixels might be appropriate: these fonts were designed with a large height of letters, and therefore they look bigger on the screen.

Now take a look at the footer and see if you have to lean forward to the screen, squint or wrinkle to view the text. After all, its size is 11 pixels. If after all this I still have not convinced you, explain to me the reasons in the comments.

Source: https://habr.com/ru/post/135746/


All Articles