Editor’s note: Choose fonts that match your design, create visual layers, use serifs and non-serifs together, avoid font conflicts, avoid similar font combinations, limit the number of fonts you use… This translation summarizes the use of good font design principles, are basic but can not be ignored, suitable for beginners to learn or review.
Example Teaching series:
01. Choose a font that matches your design
Many fonts have simple, cheerful, formal, tasteful characters that are different from other moods or personalities. To establish the atmosphere of font design, it is necessary to confirm first.
Round fonts, for example, are perfect for an invitation to a child’s birthday party, but not for a company newsletter.
Review images
Because people tend to be very diverse and diverse (such as Introverted or Extroverted), they tend to be attractive. Fonts with strong personality can be balanced by combining them with simple fonts.
In the following project, a distinctive hand-painted style font, combined with a sans serif font, does not interfere with the main font while maintaining readability in the small type below.
Review images
You may feel like playing an association Game when deciding on two or more fonts. For the most part, we rely on our intuition, and that’s okay.
Whether it is web pages, magazines, store posters, or product packaging, what kind of font combination is good, what kind is not good, we all start from lenovo fonts.
Review images
02. Show visual layers
A newspaper or magazine that was published a long time ago is a great example of the layering of typography. Title, subtitle, text, commentary and other elements rely on the combination of fonts, to divide the visual.
The Size of the font (English: Size) Boldness, word-spacing adjustments (Leading, Kerning) guide the eye and focus them on the specific part you want.
Review images
Hierarchy, where you can create a variety of different types of designs outside of the header body layout. When choosing a font for your project, think about where you want the user to see it from the start.
Another is deciding what information is important. What pops out first (the title of the company’s name, special offers, etc.), then decide what’s not important. Then we decide on the size, style and composition of the font. In general,
The important stuff is in big, bold type.
Review images
03. Think carefully about whether you should use it
You need to know what context, what use, what font to use and what font to be comfortable with. Legibility is very important in terms of actual presentation size, and even very small text needs to be legible. In the following case, no matter where the small text or large text is recorded, there is a specific space between the text, which is emphasized to ensure its legibility.
Review images
Then, font size affects reading. When choosing a font from the start, you should consider whether its design and readability match. (Rule 1 states, consider the character of the text.)
In the process of text selection, it is very important to choose the font used in the title (display Typefaces), a characteristic font or a Neutral font. In the following magazine layout, two fonts are used for the title and a sans serif font for the body.
Review images
Fonts can be chosen from historical backgrounds or genres. You can simply research the historical background of the font and when it was created. Or, knowing when the font was used, you can see if it matches your design.
For example, when designing the cover of a book depicting the life of US President Abraham Lincoln, we can use Caslon or Clarendon from the American Civil War (1861-1865).
Review images
Another example, the type of font, plays a big role in the overall design. In this case, the font was used for advertising or signage because it wanted to show the retro feel of the 1950s.
Review images
04. Serif and non-serif are used together
If you run out of time, you need to decide on two fonts immediately. At that time, we could choose to use Serif text for part of the text and Sans Serif text for part of the text. Such combinations tend to work well in general, especially when the font sizes are different.
Review images
It is also important to add that there is a big difference in typography in the world today as to which is easier to read, serif or non-serif. Numerous texts and articles have shown that serif fonts can effectively distract the eye and speed up reading, especially in print. The research article is quoted here, and those who know English should understand: www.fonts.com
Non-serif fonts, on the other hand, have a simple style that works well online or on screen, making images feel sharper.
Review images
05. Be aware of contrast
Another reason to combine serif and non – serif bodies is that they are comparative. There is a lot of relevance involved in this comparison, and we need to carefully consider the layering of the fonts, their complementarity, and so on.
Contrast can be achieved in a variety of ways, such as font type, size, font, text spacing, color, etc. The following sample case is a combination of bold and fine characters. These two styles, which are almost 180 degrees, work well together.
Because each font is different, each font has a different meaning. In addition, the bold use of pink, which makes it twice as big as the title, can not be missed, he does a good job of highlighting very fine words.
Review images
06. Avoid font conflicts
Contrast is important when combining fonts, and it is important to avoid conflicts. Just because fonts are different doesn’t mean they match up well. In general, several fonts with similar styles, the same proportion, very uniform height of small type (often referred to as X-height) and so on are noteworthy. In this way, even if their appearance is different, the design is very unified as a whole.
Review images
Take a look at the following font combinations. Because it’s serif and non-serif, it’s very different in style. The top font is very round and has a little bit of space, while the bottom font is a little bit longer and more crowded, and we can see the contrast is very large. More care should be taken to emphasize the contrast between hairlike serifs and very thin non-serifs.
Review images
07. Avoid using similar font combinations
This is also mentioned in the fifth introduction of comparison. Too similar font combinations can also be a problem. Since there is not much difference, it becomes the first problem when creating layers. And the difference between font and font, the purpose for which it was chosen, and the fact that it looked like he had chosen it wrong.
However, there is no need to choose a completely different font. Comparing the weight and shape of fonts is very important. Too similar fonts, especially when used in the same size, can confuse the user and blur the whole content.
Choose two fonts side by side, and let’s analyze them bit by bit. If the fonts are essentially the same in appearance, this is also a good indicator of design due to the excellent contrast between the types of fonts chosen.
Review images
08. Use the same family of fonts
It’s always a safe bet to use the same family of fonts. We can find a variety of fonts (different weights, styles, sizes of text, etc.) in a series to fully express our design projects.
Review images
Combine fonts from the same family, using different sizes, styles, weights (Light, Regular, Bold, etc.), and show their contrast.
Review images
Using font families such as European italics or Extended versions can create endless possibilities for your design.
If there is only one font, it has the advantage of making the design more efficient. Reduces the time it takes to find the perfect combination of fonts.
09. Limit the number of fonts you use
You don’t have to stick to two or three fonts per project. If you’ve ever worked as a magazine editor, you can probably get some more experience, but there’s no hard and fast rule.
Review images
For example, if you’re referring to a flamboyant Victorian style, you’ll need to think carefully about the font combinations when referring to a distinctive design style like this. Use a large number of fonts, in harmony with the design, and whether the result is balanced or chaotic is something you need to pay attention to.
Review images
But what kind of design elements, what kind of font is appropriate, need a lot of design projects to practice. Every design project has a different perspective on what font to choose. If you use a lot of fonts, you don’t have to answer when someone asks you to get to the bottom of it.
10. Practice
In the end, I think this is a well-intentioned suggestion rather than a rule. Use the fonts you know to combine them. Through constant effort and error, you will eventually gain the ability to innovate. There may be perfect font combinations, but not perfect formulae.
Be fearless, believe in yourself and meet more challenges. Or if you have a different idea of the rules, but your font composition doesn’t feel right, it’s important to think about what went wrong and learn from your failures. This introduction is just some typesetting basics, also hope you can have better work design. Let’s feel the fun of design
Welcome to pay attention to my micro blog: @crazy sixteen night sleepers
Wechat Official Account:
Review images
【 skills more not pressure body designers have a high salary!
Original address: PhotoshopVIP
[Yushi.com original article submission email: [email protected]]
= = = = = = = = = = = = = = = = nets about optimal set = = = = = = = = = = = = = = = = “optimal set uisdc.com” is the most popular web designers learning platform, dedicated to share web pages design, wireless terminal design and PS tutorials. 100 Books designers Need to Read: The most comprehensive Guide to Designer books ever: hao.uisdc.com/book/. Design micro blog: with 1.5 million fans of the popular micro blog @excellent web design, welcome to pay attention to get web design resources, download the top design materials. Design navigation: the world’s top design website recommended, designers must navigation: hao.uisdc.com