Your comprehensive guide to typography design

We may be impressed by the shape of some letters and words that succeed in attracting our attention and admiration. We often think about the power of the written word, but rarely do we think about the role of the designer who masterfully used typography to create the positive user experience we had. But what is typography? How can it be used?

What is typography?

It is also called typographic design and is the art of crafting and arranging letters and texts in such a way as to make words legible, clear, and visually appealing to the reader. The typographic design includes the type, appearance, and structure of the font, all of which are elements intended to evoke certain feelings and convey specific messages.

The art of typography dates back to the eleventh century, when typography was a specialized craft associated with books and magazines. The first use of typography can be seen in Johannes Gutenberg's Bible. who revolutionized this art through the mass production of printed matter. Before the advent of printing technologies, people wrote books by hand.

In the modern era, with the advent of the Internet, there has been a creative revolution in the art of typography. Designers now have a variety of different fonts with a lot of editing options, which makes the texts more visually diverse.

The importance of typography

As we explained earlier, the idea of ​​​​typography is not only about choosing beautiful fonts but it can be considered a vital element in the form of design. It provides graphic balance to the design, helps shape its personality, and ensures an excellent user experience. There are also more features that we review as follows:

1. Brand recognition

With good use of fonts in the design and in line with your brand, the audience will subconsciously start to recognize the brand easily. Using fonts and distinctively customizing them helps to establish the brand’s look in the minds of the audience.

2. Influencing decision-making

Typography affects the way consumers absorb the information conveyed by the text. There are eye-catching, bold fonts that are more convincing and encouraging to the buying decision than simple fonts that do not fit the message of the text. You find phrases such as “Buy Now” written in bold and clear font and in attractive colors, as well as banners of discounts and clearances.

3. Attract the reader's attention

Typography plays an important role in attracting the attention of the reader and keeping him on the site for a longer period. Depending on how you use the fonts, you are the one who determines whether your visitor will stay on the site for a minute or an hour. So you must use fonts appropriately without overdoing them or misplacing them.

Fundamentals of typography

Before you start using typography in your designs, you must first know its basic elements. There are eight basic elements:

1. Calligraphy and typography

Many people confuse calligraphy with typography and think that they are the same thing or two synonymous terms. But in reality, they are two completely different things. Typefaces is a design style for the shape of lettering and include different types such as normal, bold, extra bold, thin, or italic. Which leaves us with countless different characters. Whereas, a font is a graphical representation of text characters.

2. Contrast

Using contrast helps convey the ideas and messages you want your readers to focus on. It is similar to using warning signs for cars on both sides of the road with bright colors to easily attract attention. But here you don't just rely on bright colors, you can also play around with shapes, patterns, and sizes to create the effect you want.

3. White space

Often referred to as negative space, it is the free space surrounding text or any other design element such as images. Appropriate use of white space helps keep the interface uncluttered, making the text easily readable.

4. Alignment

Alignment is the process of lining up and arranging design elements in such a way that there are equal spaces between each element. Many designers rely on creating margins around elements to make it easier to align elements. Alignment may be left, as in most languages, or it may be right, as in Arabic, or center-aligned if you want the text to be centered on the page.

5. Color

Color is one of the most important and influential elements of typography. Designers can unleash their imagination and be creative in combining colors to create new shades and harmonious color combinations that take design to a new level. However, you must pay attention to the feelings and meanings that each color carries to avoid conveying the wrong message to the audience.

6. Hierarchy

The aim of the typographic hierarchy is to create a clear distinction between the salient and important parts of the text that should be noted and read first, and the rest of the text. A hierarchy can be created using the size and the typographic elements we covered above, namely colors, alignment, and contrast.

One of the most common examples of the use of a size hierarchy is where the two top headings are at a large size and the two headings below it are at a smaller size. The importance of hierarchy is increasing in our current era of speed, as people do not have time to read long articles and rely on quick browsing. Most companies tend to use infographics and apply the hierarchy element instead of traditional publications.

Types of typographic fonts

There are three different classes of typefaces: serif, sans serif, and script. In this section, we will discuss the differences between these categories. You must understand these distinctions to be able to decide whether you need serif, sans serif, or script in your design.


This font was inspired by traditional handwriting, and it is called the human style or the old style. It features letters with sharp, rounded edges that show some thickness. In the middle of the eighteenth century, a new type emerged that we now call the Transitional style, as this style refers to the transition between the humanistic and modern styles. You see it combines characteristics of both styles.

With the emergence of the concept of advertisements in the mid-nineteenth century, a new style appeared called Egyptian or Slab serif, in which the letters appear in a modern, more streamlined, less sharp, and thicker appearance, which gives strength and boldness to the text to be suitable for advertising purposes.

Because of its classic style, the Serif font can be used if the overall vibe of your design is elegant, serious, or romantic. It's also an excellent option if you want to give your audience a feeling that your brand is trustworthy, as many brands use serif fonts to make customers feel more confident in your brand.

san serif

The sans serif style is more modern than the 20th-century serif style and lacks the sharp edges of the serif style. Hence the word sans, which means without or without in French, refers to the absence of the letters of this style from the edges and additions found in its serif counterpart. Some of the most popular fonts that fall under this style are Helvetica, Open Sans, Calibri, and Verdana.

In the middle of the 20th century, Helvetica, Transitional sans serifs, was created. The letters appeared more solid than the letters previously used and were no longer close to traditional handwriting. The final evolution of the sans serif style is the Geometric font, whose characters take on precise geometric shapes. The letter O is a circle, while the endings of the letters are sharp and strong.

If you want to make a fun and energetic impression, go for the sans-serif style. As companies that provide services or products to the youth category specifically tend to use this pattern, as well as technology companies because of the sense of modernity and development that this pattern reflects. This style is also a favorite for website design for its readability.


This pattern is considered decorative stripes. Look like handwritten or like line art. Thus, fonts under this style cannot be relied upon for use in traditional designs because they are not readable. Because script fonts are more difficult to read, they are best used sparingly. But it's a good option when you want to draw your audience's attention to a specific sentence or when you want to add handwritten text without having to hire a calligrapher or type by hand.

How do you choose the right font for design?

Now that you know the different elements of typography, it's time to put it into practice. Let's talk about how to choose fonts for your design. Having too many lines makes the decision-making process difficult as you get confused and overwhelmed. However, some things will help you make the right decision if you keep them in mind, such as:

Define the design personality

What is the impression you want the audience to make of your design? Or how do you want your audience to see the design? Exhilarating or youthful? Classy or serious? Before you start choosing the fonts that you will use in the design, you must first define the personality of your design, as the fonts reflect and highlight that personality.

Use simple writing techniques

Every designer has his own set of weird fonts that he uses at certain times and situations. For most designs, there is another set of safe, all-purpose fonts. Intricate, inconspicuous styles distract from the design. If a person finds it difficult to read what is written in the design, he will look away from it. Examples of safe fonts that you can use in designs include:

  • Serif fonts such as Georgia, Palatino, and Times New Roman.
  • sans-serif fonts such as Arial, Impact, Lucida Grande, Tahoma, Verdana, and Helvetica. This group is available completely free of charge and is called "Secure Web Fonts".

Find a source of inspiration

If you're not sure how and where to start, take some time to look at other designers' work. Look at the lines you see around you, focus on what they look like, and ask yourself what feelings they convey to you. This will help you understand the lines and explore the style that works for you. Finally, you can follow leading font trends to see what's new and what's popular with people right now.

Test fonts before adopting them in the design

If you have not yet decided on the fonts that you will apply and cannot choose between 6 fonts, for example, that you think are most suitable for the design, or you want to test the fonts that you have chosen before finalizing the design, then there is nothing better than taking advantage of the design services on Fiverr to get the experience of others and ask them about their opinion and impression. And by collecting helpful feedback, you'll get a clearer view of any flaws or bugs to fix.

By understanding the rules about letters and the different ways you can use them, you'll be able to express yourself and your ideas with them in countless ways. We strongly encourage you to move on. Learn, experiment, make mistakes, and start over until you are satisfied with the result. And don't forget to share your unique experience and journey with us in the comments below.