Typography: the process of choosing a font. How much will the font cost me? Use a serif font for long texts

There are a million things to consider when creating perfect landing page: choose images, colors, write a catchy title. But one thing that is often underestimated is font. Don't make the same mistake. Right choice font can have a significant impact on the final appearance of your page. After reading this article, you will learn about what to consider when choosing a font for your landing page.

is a set of rules that help the designer create unity of colors, fonts and other website elements. If your brand already has a guidebook, try to follow it in your design. If it doesn’t exist, then you should think about creating it.

You may be tempted to experiment with new fonts when creating your landing page. But you shouldn't do this. Every time a user visits your page or, for example, sees your advertisement, he gets general idea about your brand. If all this is done in different styles, using different color range and fonts, your potential client will feel incoherent and disjointed. That's why it's so important to be consistent when it comes to style, color, and of course, fonts.

Guidelines usually indicate the entire hierarchy of fonts that are used to create a brand’s corporate identity. These rules can be immediately integrated into your design. If another brand is using a font you don't know, you can use the WhatTheFont tool on Myfonts.com. This will help you identify it.

But if your brand has a designer font, then the designer will have to try to find a similar one in order to then use it when creating a landing page. IN different browsers fonts can appear less clear, so website creators use Google Fonts to stay as close to the company's branding as possible.

By the way, from now on you no longer need to open the service Google Fonts to receive third-party fonts on your landing pages, because now fonts are connected directly from . We have added all the fonts from the Google Fonts collection to a visual gallery, and all you need to do is select the appropriate font, click on the connect button and use it for new or existing texts on the landing page:

Does your brand not yet have a corporate identity and font?

Below you will find two key points, which are worth considering when choosing a font for your landing page.

1. Consider your target audience

The font on the landing page should reflect the individual characteristics of your customers. Do you have a traditional business aimed at a more conservative audience, or perhaps, on the contrary, minimalistic and modern, aimed at young people?

Different audiences - different design, including the font

Once you answer the audience question, you will have an understanding of style. Based on this information, you can choose the right font for your landing page.

Let's say you are the owner of a vintage clothing store with a pleasant and modern atmosphere. You can choose a traditional font for headings and a classic sans serif font for the body text. For example, you can use a font like Arvo for headings, and Open Sans, known for its readability, for body text. This will give the entire site a balanced appearance. Plus, it will have a timeless look that will go well with your retro themed company:

Or, say, you own a law firm or a luxury cosmetics brand, and you want the appearance of your website to emphasize your professionalism and inspire trust among potential clients. Then it would be better to use a classic and at the same time elegant font like Frank Ruhl Libre or Playfair Display. In the eyes of potential clients, this will once again emphasize your reliability and first-class level of service.

No matter what font you end up choosing, make sure it's web safe. You can find out which fonts are considered “safe” by reading the information below.

Using a web safe font means that users don't need to install any additional font to their computer so that the text displays correctly in their browser. 10 years ago there were only 13 font families that designers could use when creating websites. The current gold standard for any designer is Google Fonts. These fonts display correctly in any browser.

However, some brands use designer fonts. In this case, it is necessary to resort to the help of special tools for converting to a web safe font. But sometimes even this is no guarantee that your text will look good on screen. This is why designers often face the challenge of finding similar web safe fonts that are free and display correctly in all browsers.

When you're looking for the perfect web safe font, your best bet is to look at the Google Fonts library. In most cases you will find there suitable option. It contains more than 800 free licensed fonts. If you use one of them, you can be absolutely sure that users from any country will see your text correctly in any browser.

When you create a landing page, you most likely want to use more than one font. However, there are some rules for combining them.

First, never use more than three fonts within one landing page. Secondly, make sure they complement each other. And the third rule to follow: determine the hierarchy of the selected fonts.

Here's what it looks like in practice:

1. Decide on the main font you will use for headings. To do this, you can refer to the corporate identity of your brand.

2. Then you need to select an additional font that will be used for the main text. It should be easy to read even on small screens. This, for example, is the Noto Sans font.

3. Finally, your third font should be eye-catching. It can be used on target action buttons or used to highlight certain parts of the text. A font like Montserrat is perfect for this.

Only a competent combination of fonts can have a significant impact on the appearance of your landing page.

See how in the example above, the designer used a unique font to match the martial arts theme and bring the site visitor closer to Japanese culture. The rest of the text is written in a concise, easy-to-read font. The result: a balanced design that draws the user's attention to the right places.

Above you can see two more examples of clever use of fonts. The first landing page belongs to cashback service. It uses a crisp but slightly angular Open Sans font. Thanks to this, the site takes on a modern appearance. The second example is a tea and gift shop. Its pages use the rarer Bebas Neue Regular font, also sans serif, but due to its vertical “elongation” it looks more original. In both of these examples, the font fits perfectly with the rest of the design elements and perfectly conveys the brand's values. This is the power of the font's influence.

Conclusion

The font you choose depends entirely on the goal you want to achieve. When you're planning your brand identity and design, think about how you want your company to be seen potential clients. Fonts are an ideal image tool. Do you want your company to look classic, serious or traditional? Then you should choose an elegant serif font. Do you want to look stylish and minimalistic? Then a sans serif font is for you. Do you need something in between? Then it’s worth combining several fonts. Simply put, the font you choose tells people a lot about your company, so you should be smart about it.

High conversions to you!

Based on materials from: 99designs.com

Creating stunning type compositions is more of an art than a science. Indeed, the beauty of fonts has no boundaries. And although there are no absolute rules for combining them with each other, it is still good to follow best practices web typography. This article shows best tricks combinations of fonts, as well as traditional errors.

1. Combine serif fonts with sans serif fonts (sans serif and serif)

The most popular typographical technique is to set the title in a sans-serif font and the text in a serif font. This is a classic combination and almost impossible to go wrong with.
The example below shows a typical article layout, using Trade Gothic Bold No.2, and in the text - Bell Gothic. Both fonts are sans serif, however, they have very different personalities. Good rule when creating a layout, do not draw the reader’s undue attention to the type of font. Trade Gothic implies seriousness, and Bell Gothic, on the contrary – dynamics and expressiveness.

The combination of these fonts causes an unwanted design conflict. Trade Gothic wants to get straight to the facts, and Bell Gothic wants to have fun. This kind of tension between fonts is not our goal and should be avoided.
Now let's look at the example on the right. Bell Gothic replaced by font Sabon. Sabon, like a serif font, works very well with Trade Gothic. They both aim for clarity and readability with good x-height (roughly, the height of a lowercase x in a font, it determines the distance between the base line and the top line). So both fonts have the same purpose, making for a great combination.

2. Avoid fonts of the same class

Fonts of the same class, but from different families, can easily cause disagreement when combined. Their pronounced personalities will each pull the blanket over themselves, as a result the layout will become “dirty”.
In the example below, on the left, the font is used in the title Clarendon Bold, which belongs to the class Slab serif. Used in the body of the article Officina Serif which also applies to Slab serif. Class fonts Slab serif They have a strong personality and like to dominate the page. Using two class fonts Slab serif in one place can cause unnecessary stress.

Now pay attention to right side example. Clarendon Bold placed next to a more neutral one in the title New Baskerville. New Baskerville belongs to the universal class Transitional serif with wide characters that go well with bold Clarendon. Font selection different classes will save you from headaches when creating a layout from the very beginning.

3. Give fonts different roles

One simple way to combine fonts is to create a role-based design scheme for each font. In the example below we used Akzidenz Grotesk Bold in capitals for the name of the author of the article. For the title - Rockwell Bold. Introductory paragraph and main text of the article in one font - Bembo, but of different sizes. And finally, the subtitle - Akzidenz Grotesk Medium.

Distinct Rockwell Bold we left it to draw attention to the title. In general, we used the scheme we had already discovered for combining sans serif and serif fonts. And even with this choice, we have a large number of variations in font size, weight and function. A total of 4 fonts from 3 typefaces were used, all resulting in a cohesive, cohesive design as each font has its own role, clearly defined in the typographic hierarchy. So if in doubt, assign roles!

4. Contrasting font weight

Most The best way spoil the layout - not separating text elements from each other according to their hierarchy. In addition to using different sizes, make sure your fonts different weights(weight) to give the reader a “guide” to your design.
In the example on the left we have different sizes font, but insufficient contrast in thickness. Myriad Light Near Minion Bold“disappears” and loses visual authority. Be that as it may, the reader’s eye should primarily highlight the title, and not the preview.

On the right we used Myriad Black above Minion normal thickness. The title may be a bit heavy, but... at least, the reader has no doubt about what to read first.

5. Create different tones of text on the page

In typography, tonality is achieved different ways– thickness, size, line width, kerning, etc. The easiest way to “see” tonality is to look at the layout not directly, but with peripheral vision. Look at the example below, looking slightly to the right or left of the picture, so that you can no longer read the text, but can see its overall tone. When you look at it this way, you'll notice that the example on the left merges into one gray block of text, slightly darker at the bottom. But the example on the right clearly retains its visual hierarchy. No matter how far you are from the text, you have no doubt about where the heading is and where your eye will go next.

Clever use of text tone reinforces the visual hierarchy on the page, which is directly related to conveying the meaning of the message.

6. Don't mix font moods

One of common mistakes– ignoring the inherent mood of the font. Fonts have their own personality. Sometimes the mood of a font may change depending on the context, but not significantly. One problem is choosing the wrong font for a specific job. But also a big problem– create two fonts with different moods!
In the example on the left we connected Franklin Gothic Bold And Souvenir. General impression of Franklin Gothic– courage, strength, resilience, but with a touch of elegance. It is not pleasing to the eye, but very functional. A Souvenir– playful, frivolous, a little indifferent, but very cute. The combination of these two fonts is like a meeting between a guard guarding Buckingham Palace and a girl. The guardsman obediently ignores the playful girl at his feet, trying to make him smile. This kind of mixing doesn't work well. The different moods of the fonts draw attention to the fonts themselves rather than the content, which indicates a weak design.

On the right in pair Souvenir we installed a more suitable neighbor. U Futura Bold a lot of faces, but it goes very well with Souvenir for many reasons. Firstly, both fonts have high x-heights. Both fonts have rounded shapes and a slight, but nevertheless noticeable, curl at the ends. Neither one dominates the other. Both work to create a cheerful, upbeat mood. There is no tension between them.

7. Combine brights with neutrals

Clean, readable typographic design requires careful attention to intentional and unintentional tension between typefaces. The clash of different font personalities is just one cause of unnecessary tension. If one of the fonts has a strong personality, then the second one should be neutral.
In the example on the left Dax Bold standing next to Bernhard Modern. This is a bad choice for at least two reasons. Firstly, Dax has narrow signs and large x-height, while Bernhard Modern, on the contrary, with a large glyph width, it has one of the lowest x-heights among popular classic typefaces. Secondly, Dax informal, modern and bright. Ideal for presenting text to techies, computer scientists and modern youth in general. Bernhard Modern, on the contrary, is classic, calm, refined and even a little personal. Combine unsuitable ones physical characteristics font with personality, and you'll end up with very poorly functioning typography.

Let's take a look at a better choice. In the right column Dax Bold placed next to Caslon, which belongs to the class Old style, but has been modernized and softened to better fit with other fonts. In this context it looks satisfactory next to Dax. Notice how we see the personality first Dax in the title, and how Caslon steps back and invites us to read. In this example Caslon is a neutral choice to support brighter Dax.

8. Avoid incommensurable combinations

When there is too much contrast between the chosen fonts, it creates a visual imbalance that reflects poorly on the entire design. On the left we put Antique Olive Nord– extremely bold font, - Near Garamond Narrow. The contrast is obvious. In most of these cases, this contrast goes beyond simply attracting attention and creates a feeling of awkwardness. Consequently, it does not convey to the reader the meaning of the text.

On right Antique Olive Nord was replaced by a softer and more restrained one Antique Olive Bold. Garamond Narrow could be replaced with the same one Garamond in the book weight version, but more good choice it seems to us Chaparral. U Chaparral higher x-height than Garamond, and overall it has a more modern and neutral look next to the characteristic Antique Olive Bold.

9. Keep it simple - don't use more than two fonts

Instead of combing through font libraries in search of “that” combination, sometimes it’s better to return to the classic and much more simple option– a combination of serif and serif fonts. Using the example below, we created a clear typographic hierarchy, achieved diversity, got an interesting breakdown of the text’s tone and increased readability. All this was done using just two fonts. Although, strictly speaking, we have five fonts here: three Helvetica Neue and two Garamond.

How to achieve all this without extra effort? Firstly, if you take fonts from the same typeface, you will probably get excellent visual compatibility without even thinking about it. Secondly, we chose a time-tested combination - a combination of a neutral heading font and, again, a neutral font for the text. AND Helvetica Neue, And Garamond have a strong but neutral personality, and they can fit together in complex layouts because we have a strict hierarchy in place from the start. Following the rules when using the right fonts helps you achieve great results without wasting your energy.

10. Use different font sizes

We saved the simplest principle for last: use different font sizes to achieve contrast between them. In the example on the left, the title and text merge into one gray brick. Use your peripheral vision, the technique described above, to look at both examples. While the left text merges, the right example shows a huge difference between the title and the content.

On the right, the same two fonts were used, but in a different size. TheMix Italic was significantly increased, while New Century Schoolbook reduced to a more normal, though still readable, size. Using fonts various sizes helps to clearly distribute hierarchy and increase tonal diversity in typography.

Finally

There are no hard and quick rules combining fonts, so the process of deciding on the right ones is time-consuming and maybe even a little tedious. However, it is good to have a handy set of principles and rules for selecting fonts, as well as to understand the results of certain typographic situations, in order to avoid mistakes and guide the process towards achieving the desired result.

(Translation by Victoria Shidlovskaya of an article from Smashing Magazine (edited by the author)

From the author: typographic markup is a vast field of activity. People dedicate years of their lives to this ancient craft, and there is always something new to learn. In this article, I will review the main points to consider when choosing a font for your website and a typeface (a set of one or more fonts). Then questions like “Which font should I choose?” they will disappear on their own.

Practical Typographic Markup

When designing for the Web, you need to take into account that content will change. Spending time on kerning (adjusting the spaces between individual letters) of each title of a large website is not even a question. In other words, you give up control.

Today I'm going to focus on practical marking. For me, this means understanding that you will never have complete control over the typography of your websites. Choosing a font typeface, deciding on the size issue - these are all things that we, as designers, can influence. Practical layout means how, and more importantly, why, to organize what you control. Let's start.

Readability when choosing a font

Before choosing a font for your website, you should answer some questions. What do you do with what you write? Reading! Why do so many websites make this so difficult? Whether it's tiny font sizes, haphazard line heights, or even plain ugly fonts, it seems like many sites don't want to give you the chance to read their content properly!

By making what you write readable, you'll immediately be ahead of at least half of your competitors, which is actually great because it's not that hard!

Modern trends and approaches in web development

Learn the algorithm for rapid growth from scratch in website building

How to choose a font typeface?

When deciding which typeface to use on your website, it is important to remember: don't overdo it. I know how many designers don't like using Helvetica because it's so widely used. I agree, but this statement leaves out important data: why. People use Helvetica too much because it terribly good. It fits perfectly into any design you can imagine and works well in both small and huge sizes.

Installing such a reviled font may go against your beliefs, but if it works, then go for it.

The body text is probably the part of the design that needs to be the most readable, so make sure you choose a font that works well at small sizes. What do I mean by this? If you can set the body text to 10px and still be able to see what it says, then that's a great indicator of the readability of the font family.

This applies to the main text, but what about the headings, what font should you choose for them?

It is much easier to calculate the readability of large headings than of body text. If you can immediately discern what it says, then the title is readable enough.

The good thing is that once you've worked on enough projects, you'll have a great idea of ​​which typefaces work and which don't. From then on, you will be able to better judge which fonts to choose.

There is no formula for choosing the right fonts for your website. Often the best way to decide which one to go with is to try each one you think should work and then compare them. The choice of fonts is really instinctive, but it is important to remember that 90% of the time the user will not think about what kind of font was used, so if it is readable, then it is good enough.

Pair selection

It is very rare (if ever) that a situation occurs when it is suitable for use on a website. just one headset The average website uses a lot of text. It can't be that one headset fits them all! The vast majority of well-designed websites use two: one for body text and one for headings.

When choosing a pair of fonts, it is important to consider how they will look together. "Are they similar enough?" "Too similar?" "Not different enough?" You have to ask yourself all these questions. I find the best way to find a couple of fonts that look good together is to just put a bunch of them next to each other and decide which ones are best. You can't know until you try.

Sometimes two sans-serifs will be most appropriate, and other times you will need sans for headings and serif for body text. It doesn't really matter that they look similar, what matters is that they act similar. This, of course, depends on the rest of your project's design. Whatever fonts you choose, they need to convey your message accurately, and if that means contrasting typefaces, then keep it that way.

Although, strictly speaking, not related to typographic markup, color is very important detail each type of website. I'm not talking about color schemes, but more about the contrast needed to ensure the readability of the site. Black text on a white (or light) background is considered the most readable color for text.

I'm not saying you should go out and set everything to black and white, just that when creating a design you should be aware of the contrast of your text. If you are not careful, it may come back to haunt you later.

In my opinion, the use of a grid is the most important idea for practical text layout on the Web. You can have great fonts, spacing, and colors, but if you don't have good layout, you might as well use comic sans.

Using a grid when creating a design with texts ensures a clear balance and geometric structure to your design. This is not a magic fix bad design, but if you create your project on a grid from the start, you can be sure that at least your layout will be solid.

So what role does the grid play in typographic layout? I'll just say: universal. The grid embodies all the basic ideals of typographic layout. It is geometric, constant, easy to use and, moreover: beautiful.

Aligning text to a grid is a key method for establishing visual hierarchy and a great indicator of how big (or small) your text should be.

Selection

As I said before, if your typography is readable, then you are already 50% ahead of your competition, but what about the other half? If you've made it this far, then together we'll leave behind clear, consistent readability rules and enter the dark and mystical world of uniqueness.

Do you want your website to stand out? Step 1: Apply unique typography. Presumably for you this means using unique fonts. But what makes the font unique? In my opinion, this is not a font that is not used too often, but one that has a message or feeling that is not contained in other typefaces.

Selecting a Unique Font - Area sensations. Feels like is this font different? Or does it just look different? When choosing typefaces for any project, you should always take into account the feel of the design. Since this is purely a personal opinion, I can't help you find a unique headset. I can just show examples of fonts.

The Design Cubicle has a very unique logo and design. It's powerful yet classy, ​​eye-catching yet subtle. When I look at this project, I am left with a feeling of high class of this site. He tells me: "I know what I'm doing."

Be non-trivial

How many websites do you know with a logo the size of the entire content? How about an ultra-thin header? Contrary to my last point, being unconventional means looking at what others are doing and then doing the opposite.

The guys at Savvy Belfast are smart. They noticed how cramped most websites looked and decided to replace all the meaningless body text with one sentence.

Even if you take just one glance at their website, you can't help but remember their name.

Match your design

Typographic markup is not a thing in itself. It's a part of web design like any other. Copy is important, yes, but don't forget that it's just part of what makes your project great. You should create the text with the rest of the design in mind.

If you have an intricate background texture, your titles might benefit from a good serif.

My point here is simple: don't forget about context. The field of design is huge, and today I'm only talking about one part of it. To create a successful web design, all the parts need to be mixed together successfully. That's the goal: to create the experience that someone will get from your site. This cannot be done using just one text, or just one color, or even about only content!

So much of an experience is determined by how you feel: happy, sad, surprised, angry, blah blah blah. Human beings have big set emotions, and our job as designers is to awaken these emotions with our designs.

Of all the things I've talked about today, this is by far the most abstract and a little difficult to explain. Instead, let me just show you.

The first time I visited Solid Giant, I smiled. I smiled the next time I saw him, and even the next. Suddenly I felt a kinship with this project. This big, fuzzy "G" is too adorable to forget!

To be honest, I think it's brilliant.

Emotional design cannot be taught, it is something that must be experienced and then played out in your own projects.

Conclusion of the lesson about which font to choose for the website

Well, you've reached the end of the post. I hope you at least learned something, and if you didn't, that's fine too. If there’s one thought I want you to leave with after reading it, it’s this: be readable, and everything else will follow. Moreover, now you don’t have a question about which font to choose for your website

What do you think is the most important thing in the typographic layout of a website? Leave your opinion in the comments!

Advertising food products is a very difficult business. It often uses colorful photographs and the designer's task is to present the product so that its image on the packaging closely matches what is inside. In addition to photographs, fonts play a huge role in food design. Just like the image, the font should in some way correspond to the characteristics of the product, be it coffee, ice cream or cookies.

Here is a simple example of a coffee advertisement. The designer was faced with the task of connecting coffee and the European culture of consumption of this drink. The first coffee shops appeared in Austria, so the font is emphatically strict, with thin strokes and sans serif. It evokes the magnificent architecture of Vienna, but does not connect coffee with centuries-old tradition, showing that coffee is a modern drink that millions of people drink every day.


But for advertising ice cream would be better suited playful cursive, reminiscent of childhood, when ice cream was the most favorite treat. For a product like ice cream, fun, informal fonts are perfect; they can be either handwritten or rounded, hinting at amorphousness and a positive feeling when consumed.

How to choose the right font?

There are several factors that influence a person's perception of a particular font. These are the shape of the letters, font color, size, kerning and much more. There are less obvious factors that also play a role important role. The font must fit into overall design. It should create a mood and perfectly suit your needs target audience. And, of course, it must be easy to read. If the font used in the packaging design is difficult to read in outdoor advertising, this will significantly complicate the promotion of the product on the market. We must not forget that in order to correctly perceive a font, a suitable context is needed.

Before you start looking for a font for advertising a food product, you need to analyze the target audience. Simply put, understand which people will most often use this product. As a rule, you can always find out who exactly is a typical client. What, for example, should the font be for a product with a high fat content? Take French fries, which contain 25.9% fat. Perhaps this is a person who likes to eat this product, washing it down with beer or soda. Or maybe this is a family with small children who stopped for a snack at a small roadside cafe. Depending on the audience and market promotion strategy, the font for advertising French fries may be different, but it is advisable that it not be too strict.

Pizza, as well as hamburgers and sandwiches are classic fast food. There are long-standing traditions in the advertising of these products; the history of fast food began in the 60s of the twentieth century, so vintage fonts would be quite appropriate here. However, the designer’s imagination is not limited in any way; it is possible to create another associative series: pizza is round, pepperoni sausage is also round, therefore, round fonts can be used.

Fonts for beer advertising

When choosing a font for advertising a product such as beer, you must take into account the context. As in the case of fast food, there are certain unwritten font canons and it is necessary to build an associative series so that the font ideally meets the needs of the audience. If the product is somehow related to European culture, then gothic fonts would be a good choice. Gothic style is reminiscent of Bavarian and Czech breweries, which, as it happens, are considered the best manufacturers foamy drink. But the font does not necessarily have to be “antique”; there are many producers of modern beers that position themselves completely differently. Depending on the positioning, the font can be vintage, informal or calligraphic. It can be anything you want, serif or sans serif, the only important thing is that it fits into the context.


"Beer" fonts

Fonts for advertising sweets

Everyone loves sweets, but the main target audience for products such as candy, cookies, ice cream and much more are children. And even if these are adults, you need to remember that every adult is a little child at heart, which means the font for sweet products should not be too formal. The font should evoke associations with the product, so the associative series will be something like this: the product is sweet, tasty, juicy, sticky, stretchy, cold. That is, you need to describe its characteristics and select fonts based on these characteristics. As you know, there are fonts that are ideal for children. Typically, these are handwritten or informal fonts with varying stroke weights. When advertising sweets, you also need to pay attention to the font color - it should resonate with appearance product. For a product such as ice cream, cold shades are better suited, and for candies, on the contrary, warm shades.


"Sweet" fonts

Confectionery fonts

Exists great amount a variety of confectionery products. Creating dough-based products is a great art, so the font should be associated with the smell and taste of baked goods. It is also necessary to take into account, so to speak, the background of the product: the font for advertising a muffin will be different from the font for advertising gingerbread. What is certain is that the font should be positive, pleasing to the eye and evoking positive associations. And, of course, we must not forget about the characteristics of the product. When making an associative series, you need to remember the culture of consumption of the product, its history, shape, filling and much more.


"Confectionery" fonts

Since products can be very different, including not very well-known ones, the search for the target audience can take a long time. In this case, you can use non-standard fonts that may make you want to get to know the product better. Here are three unusual free fonts:

The font is important. Like air that you don’t notice as long as everything is fine. Most people have no idea what fonts are called or how they differ (and that's okay), but they can definitely sense that there's something wrong with your site if the font you're using doesn't suit your project.

What is font weight

Font readability

Whatever font you choose, it should be easy to read. Especially if you are using a background photo. If you put a thin line on a photo with small details, the text will not be read. Always pay attention to this.

What can be done? First, use a photo that is suitable for the background: with large, uniform elements. Secondly, soften the photo using a filter, it will become smoother and the text will be read better. Thirdly, you can increase the saturation of a specific block by applying the “inline style”. This means that you do not set settings for the entire site, but only for part of the text. You need to select the text and set parameters through the editor.

The style that is applied in this way is on top global settings, will always be a priority. Therefore, if suddenly you change parameters in the site settings, but the changes are not visible, it means that an “inline style” has been applied in this place. To remove it, you need to select the text and click the “clear” icon.

Example 1: The text is not very readable

Example 2: The text reads well

If the topic of choosing a font interests you, find good sites close to your project and see what fonts they use. The What Font browser extension will help you determine this.

You can also look at the independent typography archive http://fontsinuse.com/ - a resource where samples of websites and printed publications are collected and sorted by type of font used.