Never (or almost never) stretch a font!

How many times have you seen around, on a leaflet, a poster, a social graphic, some stretched, elongated, enlarged fonts ... in short, stretched ? Maybe you even thought that it was all in all a fun effect, useful for attracting attention.

Or even (no, come on, really?) you've used stretched fonts in some of your projects: in this case I'm sorry, I have to inform you that you will receive a report for the typographical crime you committed.

Obviously I'm joking! However, if you did, you were wrong. You should (almost) never warp fonts . As always, this is not just a matter of “taste”. There are technical reasons why stretching fonts is a really bad idea.

This article was created to explain to you what these reasons are , and it is also an opportunity to better understand how fonts are designed .

Fonts and aspect ratio

We have talked many times about fonts on our blog. However, one thing that is important to reflect on, in this case, is the importance of the legibility of a character.

In fact, a text, and consequently the characters from which it is composed, has the primary function of communicating a content .

Precisely for this reason, well-designed fonts have a whole series of tricks to ensure that our brain recognizes the various letters with a certain ease , and not confuse them with generic shapes. Or fails to interpret its meaning, as happens when we read a language that uses characters unknown to us, other than those of the Latin alphabet.

To make us recognize and interpret a letter correctly, good fonts are designed with a whole series of tricks and optical corrections . Most of the time we don't even realize that those corrections exist. But when you deform a font, the result you get is to make the efforts made in the design phase to make the character readable completely useless.

Let me give you a concrete example: try to think of a lowercase T, written in a normal sans serif font. It is almost certain that, looking at this letter, you are convinced that the horizontal and vertical strokes are of the same thickness.

Well, you must know that this is not the case: the horizontal shaft of the T is thinner than the vertical one .

Try it backwards: if you try to form a T with two strokes of the same thickness, you will soon realize that the result leaves something to be desired, it seems to you that there is something strange, wrong.

This happens in fonts that we define as "low contrast", i.e. those in which there are no marked differences between the vertical and horizontal rods. In higher contrast fonts, such as many serifs, this difference is much more evident.

And if you look closely at the most famous serifs , you'll realize that what I said to you about horizontal rods also applies to rounded characters . In g , for example, both lowercase and uppercase, or in o , the curve tending to the horizontal rod is thicker than the curve tending to the vertical rod.

But why is this optical correction necessary?

How our eyesight works

It may seem strange to you, but we need the fixes I told you about because our eye evolved to live in the savannah.

In fact, imagine our most ancient ancestors, who moved in a substantially flat environment, with a horizontal line marking the edge of the grass. It was important for them to pay particular attention to everything that could emerge from that line: whether they were potential prey or dangerous predators.

Since then our eye has given an extra "push" to the vertical rods , to make them emerge with even more momentum than on a horizontal plane.

What (really) happens when you warp a font

I anticipated that when you deform a character, for example by stretching it vertically, you alter the aspect ratio between the vertical and horizontal rods . And since that ratio was designed to accommodate our viewing habits and to make the fonts legible, you get an aberrant result , which is both unpretty and hard to read.

Before continuing, a clarification is necessary. This speech applies to all those fonts designed with the aim of making reading simple and pleasant. They really are the majority; however, there are also fonts whose goal is to break the rules , amaze, attract attention, even at the expense of legibility, and they are an exception to what I am illustrating.

Let's go back to font deformation: I've already explained to you why it's a problem to deform them vertically. But it is equally deforming them horizontally : in this way, in fact, you change the relationship between full and empty spaces .

As before I gave you the example of the t , now I can give you that of the lowercase a of a serif font. When you stretch it horizontally, the eyelet, the ratio of solids and voids and the very recognizability of the strokes deform as a result. In practice you get, again, a monster that lacks the characteristic elements on which we rely to correctly recognize and interpret the letters.

The purpose of every designer

It's doing really beautiful things, of course!

I'll explain it to you better: graphic design is used precisely to communicate a concept or message in the most effective and at the same time most pleasant way from an aesthetic point of view .

This is precisely the criterion by which most fonts, or at least quality ones, are designed. This is why any type of deformation is wrong from the point of view of graphic design.

The only exception can be made when the deformation does not concern a whole word, but perhaps a letter that is distorted precisely to recall, for example, the similarity with another recognizable form. It can be useful, for example, as a starting point for a logo.

In all other cases, however, it is a real crime. But then, why do you keep seeing so many, indeed so many stretched fonts around?

Why fonts warp

Character stretchers usually do it for a very simple reason: they don't know they shouldn't do it . Basically, out of ignorance.

For example, sometimes there is a lack of knowledge of how font design works and why it is important to respect certain proportions. This is one of the reasons why on our blog, we have decided to give useful information on different aspects of graphic design.

Other times, however , what is lacking is the mastery of the work tools . Here too I'll give you an example: on Illustr a tor the most immediate way to insert text is to click on the tool , then on the point of the image where you want to insert it and write.

This way you create what is called point text ; it means precisely that it is not bound to a box with precise proportions. So when you go to make it bigger or smaller you can also warp it.

This is why Illustrator users often don't notice that they are warping the font ; maybe you just forgot to hold down shift while dragging the edges of the text area. In this way it often happens that the fonts are deformed without intending it; maybe the difference with the original proportions is minimal. Those who are really obsessed with typography notice it, but even those who do not notice it have the impression that there is something wrong, unpleasant.

To prevent all this from happening, the solution is very simple: whether you're working in Illustrator, or any other graphics software, always create a text area before writing .

In this way, when you want to change the appearance of the text, you don't have to go to work on the edges of the box. Rather select the text inside and make the changes through the font properties : change the weight, change the point size, etc.

This way you are sure that the font will not be distorted.

Your next objection, however, could be that in some cases deforming the font is very convenient, indeed even necessary. To answer you, I'll leave you with my advice so you don't have to stretch the fonts.

How to avoid distorting fonts

Let's say you are in a situation where you want a text to have a fixed aspect ratio. How to not stretch the font? Here are my three suggestions :

1. Change font : luckily there are so many fonts. If you realize that the font you've chosen doesn't have the aspect ratio you're interested in, simply change it! There are many fonts that look alike but are different in terms of proportions : some are narrower and taller, others shorter and wider. You will surely find the one that fits the needs of the project.
2. Choose fonts with many weights : This is a compromise solution. In fact, there are often font families that have already been designed to have many variables; this way it's easier to find the one that fits what you have in mind while maintaining carefully designed proportions.
   
   
   
3. Stretch the fonts, ok, but with creativity : ok, I know this seems like a contradiction to you. I assure you it is not. If you know the rules inside out and understand why, as a rule, you shouldn't stretch fonts, then you can afford to do it. But only to compose something really creative , a graphic work that consciously exploits this effect, to make something really cool, dynamic, interesting from an aesthetic point of view.

Conclusions

Also in this case you have seen that having a good knowledge of the rules of typography and graphic design and knowing how to orient yourself in the functions of the main software allows you to make the right choices .

If that's what you want, even warping characters without committing a crime!