Seven Principles of a Skilled Designer (1): Font Design

Seven Principles of a Skilled Designer (1): Font Design
Well, you may be a design guru, or maybe that's too much of a stretch, but at least you can become a skilled designer by following these seven basic principles.
This will be the shortest and most detailed series of blog posts that will teach you how to become a better designer.
Remember: these principles are not laws and can be broken. They are just general guidelines that I usually follow when designing. Follow these simple design principles and you will find your own path to artistic excellence.
Principle 1: Limit your fonts.
You’ll see that a big part of a good design is looking well coordinated. One of the best ways to do this is to use a small number of elements to create a design that looks well coordinated.
The font you choose first may be the one you want to delete. I often eliminate 2 fonts from one work. The first font will probably be thoughtful or artistic and will bring a sixth sense, character or personality to your design. These fonts bring together fragments of all the moods of the time, this fun font with twisted waists looks like a girls' dance party, and this grungy and evil font is a rock band? I will use this fancy font for the title of the text, everywhere it needs to be big enough, this fancy font will be the focus of this piece. You typically use this font sparingly, but it's much larger, so that's the main point people see. The second font should be very ordinary, and the reader won't feel its presence in the entire article. This font needs to be highly readable, as it will occupy a considerable amount of space in the text. Obviously, if those lavish artistic fonts occupy a large amount of space in the text, it will greatly affect the reading experience.
Here’s an example of a design that uses fonts correctly. As you can see, there are only two fonts used here, a fancy artistic font for the title and a very basic font for the content. This looks neat and coordinated.

Here is another failed example. I used a lot of fancy artistic fonts here, which is very inconsistent and the section divisions do not seem to be coordinated with the main title.

Having too many fonts in one design is a big no-no. Nothing can make a flyer look worse than using 8 different fonts. The same is true for using WordArt for body copy. This is an example of incorrect use of fonts.

One last thought before I let you get your hands dirty. If your word art looks very trendy and modern, use a sans serif font for the main text; if your word art looks very formal, use a serif font as a secondary font. .
PS2: Serif or San Serif?
Serif is the end of a character's strokes, such as the beginning and end of the letter M. Serif was developed from Roman inscribed letters to improve the elegance and readability of fonts. They were first written on the stone with a brush and then carved. Serifs survive today because they are beautiful and classic, and they are easier to read. For small text fonts, Serif fonts are very suitable. Conversely, you can use Sans Serif (Sans is French for "nothing") as the font for titles or short articles.
Classification of different fonts Latin characters Square characters Serif fonts
The contrast between thick and thin strokes is obvious, which saves eyesight when reading. Times New Roman
Architect
BalletEngraved
Creedmore
Benjamin
Capshc
New Mingti Songti Biaosong Sans Serif
The strokes are evenly thick and thin, and the contrast is not obvious. The font is more prominent and it is more difficult to read. Alberta
ANNSTONE
Garamond
Nimbus Script
Bold

<<:  Implementation code for saving images to MySQL database and displaying them on the front-end page

>>:  Is the tag li a block-level element?

Recommend

Summary of some practical little magic in Vue practice

How can you forget lazy loading of routes that al...

Vue implements nested routing method example

1. Nested routing is also called sub-routing. In ...

Vue uses echarts to draw an organizational chart

Yesterday, I wrote a blog about the circular prog...

Detailed explanation of the difference between JavaScript onclick and click

Table of contents Why is addEventListener needed?...

How to avoid garbled characters when importing external files (js/vbs/css)

In the page, external files such as js, css, etc. ...

How to use DPlayer.js video playback plug-in

DPlayer.js video player plug-in is easy to use Ma...

Two ways to clear float in HTML

1. Clear floating method 1 Set the height of the ...

Ubuntu 18.04 installs mysql 5.7.23

I installed MySQL smoothly in Ubuntu 16.04 before...

Installation of Docker CE on Ubuntu

This article is used to record the installation o...

Should I use UTF-8 or GB2312 encoding when building a website?

Often when we open foreign websites, garbled char...

About the selection of time date type and string type in MySQL

Table of contents 1. Usage of DATETIME and TIMEST...

Detailed explanation of Jquery datagrid query

Table of contents Add code to the Tree item; 1. S...