Furniture site design
Immediately after the publication of the post with the best examples of furniture sites, we came across an interesting English-language article with a similar theme. It contains a selection of…

Continue reading →

What to write in the text call-to-action on the site?
Practically on any commercial site, whether it be a corporate portal, an online store or a modest site like a “business card”, visitors have a so-called call-to-action - a call…

Continue reading →

The browsers we choose
Now let's talk about browsers. And what to say about them, you say, and so everything is clear - this is the program with which we look at Web pages.…

Continue reading →

7 2018 web design typography trends

Typography is the style, layout, and appearance of block letters / texts on a page. Currently, it has already become an integral element of web design. You will find many interesting articles on the topic in the corresponding section of our blog, which has replenished today with another publication. Consider the design trends that are relevant for this direction that appeared and consolidated in 2018. The material will be a great addition to the web typography record. The post is a translation of this note.

typography trends
The purpose of any site is to attract the attention of visitors. At the same time, it is important not only what you are going to convey to the audience (content), but also how you are going to do it (design). In 2018, content continues to thrive, thanks to enthusiasts of the Content First concept, which implies its primary importance in the design of web projects. Below are the typography trends of 2018, many of which involve placing text in front, in the center, and even across the entire screen.

In 2006, an article by Oliver Reichenstein “Web design is 95% of typography” was published – the second of the sensational phenomena of that period after the comedy “Borat”. According to Reichenstein: “Web design is not just the selection of original fonts, but the techniques for their skillful use.”

1. Catchy, big headlines
A catchy headline in large bold or bold is perhaps the most effective use of text as a meaningful element in web pages. Now there is a tendency to replace the main “Hero-images” with large headings, which connect the main with the brand name or important information.

Currently, the beautiful typography of the site is gradually turning into its design. CreativeDoc, for example, expertly uses a catchy six-letter heading in bold white on a solid black background.

Big headlines
Font: Dharma Gothic Heavy

European innovation company Souffl chose a white bold lettering, vertically elongated, against a dark background with the addition of interspersed color animation.

Original elongated font
Alternatively, see a selection of the top 10 google font fonts for headings.

2. And again serifs
Serifs continue their climb to the heights of popular trends. Sophisticated titles and intricate headlines in popular serif fonts like Calluna and Minion change the minds of even the most inveterate skeptics.

Many web designers are actively using this newfound serif addiction – for example, at Cobble Hill and Gin Lane, they help bring an element of sophistication to minimalistic sites:

Serif fonts
Fonts: Arno Pro and Proxima Nova

Typography serifs
Selected Font: Miller Disp, Lt

3. Skillful use of plain text
The visual revolution, which among other areas is particularly pronounced in journalism, does not reject the importance of text in web design.

Justin Jackson’s Words project has been around for many years as a confirmation of the fact that a lot can be said with ordinary phrases, sentences and words on the net. There are no fonts here, only a browser font with standard methods for its design:

Standard browser font
Some professional designers to this day use only words in their web resources that Jackson calls “the most powerful tool for communication on the network.” In fact, it’s not easy to create a page that consists solely of text content – but if it is well done, we won’t even notice the absence of images.

As an example, the website of the agency B14 from Copenhagen is suitable, where the entire main space is filled with content telling about the activities of the company:

Web page design made of words.
Font: Maison Neue

Images can sometimes speak louder than written letters, but they do not have the same great control over what we perceive by ear – that is, words.

Freelance copywriter Joe Coleman adds a small detail to a page with just one text – an unusual interactive scroll button. This element not only helps to tell the desired story, but (more importantly) captivates the audience in a way inaccessible to many independent visual effects:

Scroll text
Work sans font

The portfolio of designer Max Kaplun confirms that you can attract the attention of an audience not only with massive bright hero-pictures, but also with plain text content. The main contents of the main web page are several suggestions about the author and his professional skills, to which a talented specialist adds different symbols; variations of fonts, sizes and thickness of letters; as well as a color cursor with specific hover effects / actions.

Original typography
4. Monospace font
In 2018, these fonts appear not only in text with small sizes of printed characters, but also as large objects in the design of online projects. Their growing popularity coincided with the emergence of a trend of brutal style.

Usability of an online store: basic requirements for sample pages
Conversion rates for an online store are influenced by a whole group of factors, among which usability can be called one of the main. When developing, paying close attention to…

...

Creating the perfect landing page (for example, successful sites)
There is nothing more exciting in working on a site than when all the specialists join their own efforts to create a new ideal landing page or the main page…

...

Effective website footer design
Developers often overlook that the footer for a site (translation from English footer / basement) is one of its basic elements. It can provide more complete information about the company,…

...

A few words about encodings
Anyone who knows everything about this can skip this article, but I will tell the rest about the causes of various encodings and the problems of web design associated with…

...