Increasing the resolution of devices, increasing the speed of the Internet and designers’ access to tools for typing on the web such as Google Fonts and Adobe Typekit, etc., has made this era the golden age of typography. Typography is an art in which the designer tries to change text elements , Such as size, letter spacing, letter shape, line spacing, paragraphing, and the like, created a visual language for typing.
Table of Contents
Benefits of typography
- Advances in technology and users’ use of high-resolution displays (such as Apple Retina) have provided more options for typography
- Provide opportunities to display brand identity
- Upgrade and improve the quality of textual content
- A tool for creating visual hierarchies (especially applicable to CTAs)
6 golden tips of typography in site design
The most important factor; Readability
Never sacrifice readability for a better font, a typographic design that is not readable will not work for anyone.
Simple but effective
A simple typography is easier to read and less time consuming to load, but that does not mean emphasizing the use of minimalist styles in typographic design.
Consider the following points when designing and using typography in web design:
- Increase font size
- Use colors that contrast with the environment in typography to create contrast
- Use bold fonts
- Do not confuse effective typography with gorgeous typography, simple fonts evoke a sense of confidence and clarity.
Serif vs. Sans Serif
A serif is a small line or appendage that is added to the end of a letter, number, or symbol. Fonts that have these small lines are called serif fonts. Sans-serif fonts are also called fonts that do not have these extensions. (sans means “without…” and is a French word)
There is no conclusive evidence that one is more readable than the other. The difference between the two fonts is in their style, the serif makes the text richer and more formal, while the sans serif is simpler.
Some examples of popular serif fonts:
- Caslon
- Garamond
- Freight Text
- Minion
- FF Meta Serif
Here are some examples of popular Senserif fonts:
- Proxima Nova
- Futura
- Avenir
- Open Sans
- Helvetica Neue
Handwritten style on the photo layer
Manuscripts are a good complement to the use of painting in the design of websites. Because handwriting can be difficult to read, try to limit its use to large captions on the photo layer. In creativeblog 48 English handwritten fonts are introduced.
Superimposed / Shared Space
One of the best ways to make the text more visible and to draw attention to the text is to place the text layer (or even part of it) on top of the other layers so that both layers are recognizable(superimposing). Another method that is considered today is to take the text out of its space and enter it into the space of other parts. For example, part of the word is placed on the photo and part of it is outside the photo. In this method, the whole page is combined and increases the prominence of the text.
Do not use multiple font families
In most cases, you do not need more than two font families for each site. To create variety, try using different sizes and shapes of the same font family.