Currently accepting inquiries for Webflow Websites and SEO Projects for Q2.

Typo Thursday: Volume 2

November 12, 2021
Updated:
May 1, 2023

Typo Thursday: Volume 2

Matt Mitchell

The first printing machine was produced back in the 15th century. Since then, typography has been following the same general guidelines on how to improve the readability of text. The most important pieces of type are the size & color, measure, and leading. These things are the foundation of a well-designed typeset. This is where it starts to get tricky; You have typographers that do this for books, graphic designers that do it for other printed media, but when it comes to the web...whose job is it then? it falls somewhere between the developer and the designer.

One of the main mistakes that people make when it comes to websites is making the text too small. One way to check behind yourself is to hold a book at arm's length distance away, and that's how big the text on your website should be. The recommended size of the body font is 16px for anything mobile, and 18-22px for anything desktop. When it comes to type color, we aren’t exactly referring to text color. Type color refers to how heavy your black type is in contrast to how light your background is.

The longer a line of text is, the harder it is on your eyes to read it. Line breaks create constant pauses that your eyes need. Although the pause is short, it’s just enough of a break to keep us going. Ideally, you want about 45-75 characters on a line of text (this includes spaces). If you exceed this length a user's eyes will quickly begin to struggle to read the whole line. Although, there is also a point where your line length is too short that can also bother a readers eyes. When a line is too short, the constant switching on lines that you’re reading can hurt your eyes and cause the reader to not get enough breaks in between lines.

Line height, which is usually referred to as leading, is one of the most important pieces of typography. There are multiple things that can affect line height. Most designers think that line height is something that they set one time, and then they’re done. Line height is affected by the width of the lines. So basically, the longer your line of text is, the more space goes between the lines. Same goes for the size of the text. The bigger the font is, the bigger the space between the lines of text should be.

We don’t read letter per letter, well, unless you’re still 5...which in that case why are you even on the internet anyways kid? Anyways, we read word by word. Line by line. In a nutshell, making these lines too long will cause your eyes to get tired quicker. Making the lines too tight together will cause our eyes to get confused on where to start reading. Always make sure that you are paying extra attention to your type. You may not realize it, but it can literally make or break your work. How can anyone read your stuff if you aren’t following the rules and guidelines? Think about…and come back next week for more tips!

Related Articles