5 Typography Trends You Should Implement In Your Next Web Design

Typography might seem inessential in the whole complexity of building your website but it is a real deal and there’s the whole science around it out there.

Especially if you realize that all websites are mainly composed of 2 things: texts and images. If you make a right choice at the beginning and start with the typography, you’re on the best way a great looking website.

1.Vertical typography: don’t get too attached to the lines

The simple way of describing what vertical typography means would be that it’s a basic layout of texts written on your website. It includes spacing between the paragraphs and headings as well as columns on your website. It is the impression of the first look, even before you start to read.

Vertical typography shouldn’t be too disturbing and one of the recommendations is to strictly aline all your text with an invisible background grid. However, real life isn’t about following 1 line and to catch visitor’s attention, you need to step up. This is where the professional designer’s eye is irreplaceable and the reason why using a theme for building your website is often a good idea. In some themes, you can customize the vertical rhythm by defining paddings for each element.

2. Cropping and over-lapping

These are the trends of minimalistic design. When you crop the part of the letters or overlap text with the pictures, you’re still providing enough for readers to understand what you want to say, but in a non-revealing way. Putting the image in front also engage more of the site visitor’s attention through the visualization. This design looks fresh and modern too.

3. Mobile first designs

Concentrate on who your web visitors are and what device do they use most to browse your website. Mobile internet usage is on the rise and your web typography is the main thing that affects the quality of your mobile web design. Make sure you define the minimum font size for the smallest devices to make website looks good and to be fully legible. Then work your way up to a bigger and bigger device to achieve great results. You can also choose fully responsive theme right at the start so you won’t need to worry about hand-coding and too much customization at the end.

4. Fluid Typography

Fluid Typography is the latest trend in the website design. It means that the font size on the website is fluently changing according to the screen size of the display device. Instead of defining fixed font size in px, you use relative fluid typography units that calculate ideal font size based on the width and height of the screen: Vh (viewport height) and Vw (viewport width). With this method, you can get a nice responsive design. Texts on the website will automatically resize when the site is opened on a different device. Without any jumps in a font size when moving from one screen size to a slightly bigger or smaller screen as it is usually the case with relative units attached to the root font size of a browser (rem) or base font size (em).

5. Don’t use more than 3 different fonts on one website

Choose the fonts and their combination carefully. Most websites use 2 fonts that get along nicely and create a professional looking design. The use of fonts on the website need to be consistent. Remember that each font has a certain number of variations like bold, italic, regular italic etc. Decide in advance which styles will be used and how will you use them. You can have a certain style for highlighting the links only and some other for the most important quotes in the articles. If you want to add the third font to your website, you can. But mixing more than 3 could create a chaotic impression. Remember also that each font has to be loaded by the browser. Some font files are quite large, especially if there are special characters in this font and therefore the loading speed of the website is affected by the number of fonts you use as well as their complexity.

This is a guest post written by Jozef AitThemes Designer & Front-end Developer.