Typography is the cornerstone of any design area. Of course, it is one of the most important elements of any project. But contrary to common sense, work on typography is postponed to the very last moment, or not taken into account at all. Many designers are afraid of typography, and the result is either a useless design or the designer is simply obsessed with the using one or two “proven” fonts in his work. This guide aims to make a difference.
Table of Contents:
The ability to correctly present the text on the website’s pages is not a gift from above. Yes, unfortunately or fortunately, but the rules exist even in this field. And to create a successful project, you need to know them. The Internet is text. It is words. And these words should look amazing. If done correctly, typography becomes an incredibly powerful tool. However, this is more than just choosing the right font. This is, first of all, ease of use. It is necessary to choose and combine sizes, types, and styles of fonts to create a graphic hierarchy in the design. Choosing the right typography always displays the certain needs of the project. These are not only aesthetic needs but also technical and functional – you can create very different messages from text fragments. In other words, by optimizing typography you also optimize the user interface.
This guide is intended for anyone who asks the question “How to choose the right font?”. Everything will be very accessible and gradually. It will suit those who don’t have any special artistic or technical education, any coding skills and experience in the web design industry. Nevertheless, it will be also useful if you are engaged in web-design but you still have much to improve. Starting with things already known and taking into consideration the following tips, you will find a font that fits your needs.
So, ladies and gentlemen, welcome to the fonts tutorial for beginners. Take your mouse and sit comfortably at the keyboard – reading promises to be interesting and informative. Coffee brewing is optional, but still worth it.
The first thing I would like to draw your attention to is the main classification of fonts that almost all designers use. Let’s go!
Good typography is a pledge of easily accessible information, while in case of bad typography, you have to make an effort to understand the text. As Oliver Reichenstein notes in the article “Web design is 95% typography”, optimization of typography is the optimization of readability, accessibility, ease of use and the achievement of graphic balance in general. And now, let’s find out what parameters help to achieve all this.
Important text parameters:
First of all, you need to understand the purpose of your design. What message do you want to transfer? By what means? In a good design, typography fits the goal. For example, if you create a design that mainly relies on images, it is better to choose a font that fits the style of illustrations and does not distract all attention to itself. The font should be in harmony with the rest of the design. Just like it does Brainik Font in the example below. If images are the main element of your design, use simple fonts to emphasize the illustration.
In fact, some content is never intended to be read, but only to improve the design or for decoration. In this case, you can make a choice in favor of design over readability. A decorative font that is meant to be “heard”, not read can convey the idea of your design better than a serious font that is meant to be read, not “heard”. But it is important to remember that the fonts with the strangest or most beautiful design are far from the best in terms of reading and convenience.
Having decided on the purpose of design, determine the audience. It is extremely important, as the choice of fonts will depend on the age, interests and cultural background of the audience. Some fonts are more serious, others are more careless and playful, others are more decorative. Knowing your audience can narrow the font area to choose from. When you are planning a corporate identity and design, think about how you want potential customers to see your company.
Do you want your company to look classic, serious or traditional? Then you should choose an elegant serif font. Want to look stylish and minimalist? Then a sans serif font will suit you. Do you need something in between? Then you should combine several fonts. Simply put, the font that you choose says a lot to people about your company, so you should take it wisely.
Using one font is usually quite boring. In this case, it is difficult to create an effective visual separation, only by changing the size and color of the font. For this, it is better to use different combinations of fonts. But how many fonts are you going to use? I would recommend using two or maximum three. When using more than three different fonts, your website loses its structure and looks unprofessional. Remember that abusing font size and style can ruin any project.
Sometimes, due to different styles and weight, it is possible to create the necessary variety even within one typeface.
If you decide to work with more than one font, make sure that the font families match each other in terms of the width of the letters. Here is how it looks in practice:
Consider that the text size should not be less than 13 points. The best choice is within 14–18 points. Not too big and at the same time readable. And if you do not have enough experience and knowledge, do not even try to use unusual, fancy fonts. Keep it simple.
The choice of type and color is a very important part of web design. It depends on how the site visitors will perceive the information, whether the site will be memorable.
Let’s find out how different fonts affect consumer mood.
Color is a kind of “emotions generator” of site visitors. The coloristic design of the text conveys the accents of important information that can cause excitement or stimulate certain actions. This is a powerful factor in manipulating the user’s emotions.
It is best to choose a contrasting background color and text for ease of the text perception. In addition, try to avoid a large number of colors. However, do not neglect them at all to escape being boring. Oddly enough, but the best combination is white and black (dark gray). Bright shades can be difficult to read. Beware of combinations like red-green, blue-yellow, purple-orange.
A marketing specialist Gregory Ciotti points out in his essay “The Psychology of Color in Marketing and Branding”,
“When it comes to picking the ‘right’ color, research has found that predicting consumer reaction to color appropriateness in relation to the product is far more important than the individual color itself. … It’s the feeling, mood, and image that your brand creates that play a role in persuasion. Be sure to recognize that colors only come into play when they can be used to match a brand’s desired personality (i.e., the use of white to communicate Apple’s love of clean, simple design).”
So, when you have already understood all the details of the fonts, it’s time to choose. And here you have doubts again. Expensive premium fonts are not affordable for everyone, especially when it comes to startups or beginning designers. And then the thought creeps into your head: what about a free font? My advice: push this thought away. Free fonts should be used when there is no understanding of why you need a font. But if you value your project and want it to become more expressive by choosing the right font, a free font is a bad idea. In addition, any free font regardless of quality risks to become wiped and recognizable very quickly. But most often you can find low-quality free fonts. And if your goal is to stand out (and every website has such a goal), by using free fonts it is very difficult to do.
Of course, I hope that after reading this guide you will understand how important the font is and the thought about a free font won’t come to your mind. On the other hand, I understand that when I see the cost of some fonts, I want to close my eyes and not look at them. Therefore, as a bonus, I will tell you in this guide where you can get excellent fonts for the price of a cup of coffee at Starbucks. Cheap and awesome! I found MasterBundles recently, and from that time I’m not even looking for other fonts. Here you can find a whole section of font compositions for ridiculous prices! And below you can look at top 5 font bundles of 2018.
With this bundle, you will get three original and widely varying font families for logos, websites, advertising, and even album covers! Usually, you would have to pay $30 for this awesome collection, but on MasterBundles you can get it for only $9!
Here you can see a modern collection of simple clean fonts. 10 creative fonts – less than $1 for a font! This set of fonts will make your design look stylish and visually attractive.
This rich bundle has contains 29 fonts, grouped in 5 extended font families. Nice, modern, bold, they can turn any type of text into an eye-candy piece of writing.
This modern bundle features 8 creative and grunge vintage font families in one mega collection. That’s a total of 18 unique custom fonts done up in a retro, vintage or grunge style.
It looks just like a deal of the year: 52 typefaces including 197 fonts + tons of graphics and logo templates for just $38 (the real value of this bundle is $1163), saving you 97%!
Finding the right fonts for your project can turn into a nightmare, but I believe that a little planning and forethought will help to avoid many troubles. The best font will always be the most suitable for a particular case. This means that a typeface that looks best and, let’s say, occupies not much space, will not necessarily be the right choice. Audience expectations and customer requirements should always be taken into account – a good start for many projects.
The main task of a typeface selection is to attract viewers. Objectives to be achieved through work must always be clearly defined and directed to the target audience. Do not forget about the age category and the interests of the readers.
Fonts cannot be bad or good, rather they are suitable and inappropriate. Don’t select any typeface until it becomes clear who will read the text and what you want to convey to the audience. Good luck and happy hunting for fonts!