Design is very important for your site, regardless of your activity: according to several studies, 90% of Internet users judge a site in the first place for its visual appearance. And among the most important components in web design, there are the fonts.
The font, writing font or font in English, defines the appearance of all your texts on your site: titles, paragraphs, buttons, menus, texts in the images… It is for this reason that the fonts of Writing your site should be readable, enjoyable, highlighting your content while asserting a visual identity.
If you do not yet have a visual identity or the means to have one defined by a professional, it is difficult to choose which font to use for your website.
Here are some information and tips for choosing a font for your site.
1-Types of policies
To start, you should know that there are several types of fonts, including five main categories, standardized by the W3C:
- Serif fonts: they have what are called “serifs”, those little ornaments that make letters more elegant. They are mainly used in the paper press and traditional media but can convey a somewhat old image.
- Sans Serif fonts: conversely, sans-serif has no serif and is therefore more classic. It is the preferred type of font for everything related to the web because it is more readable and adaptable to different screens.
- Cursive fonts: sometimes called script fonts, cursive fonts simulate handwriting, with rounded shapes. They evoke school or childish writing while conveying a more relaxed, not very professional image.
- Fantaisies fonts: Fantaisy fonts are more decorative, and should be avoided for anything other than a title, logo or use in a promotional image.
- Monospace fonts: monospace fonts have only one character width, to facilitate their processing, they generally resemble typewriter or computer terminal fonts. They are soberer and sometimes considered a little strict, but are used more and more, especially for sites related to computers and new technologies.
There are other types of fonts that do not benefit from the generic W3C font standard, but which are widely used on font platforms. For example, handwritten fonts, which evoke a handwritten text “stick”, with letters detached from each other, which can be used for a blog or a communication closer to its audience (many used by lifestyle, travel, cooking sites …).
In general, for the majority of your texts, we advise you to stick to modern fonts, readable on any medium, and therefore adapted to the web, therefore rather Sans Serif fonts (Arial, Roboto, Helvetica…). For less frequent titles or types of texts (citation, code, blog article, etc.), you can consider fonts that are more decorative or adapted to the content you want to present.
2- The criteria to take into account to choose a policy adapted to your site
Once you understand the different types of fonts, it’s time to choose the one that will stick to your site and your business. Here are the main criteria to take into account:
- Your brand identity: Your brand identity is what your company is, the image it gives, and what it conveys. If you are a B2B e-merchant with rather serious content, prefer classic and sober fonts (Serif or Sans-Serif for example). Conversely, if your site is lighter, or more artistic, you can allow yourself more freedom.
- Your target: It goes hand in hand, but you must also adapt your policies to your audience. For example for a rather young and / or connected public, favor modern web fonts.
- Your objectives: Sometimes you also have to choose different fonts depending on what you want to do with the text in question. A call-to-action button on a promotional landing page may require a more readable, thicker, and sans-serif font.
Whatever you choose, keep in mind that typographies that work in print (physical media, print, such as catalogs, flyers, etc.) rarely work on the web.
3- The number of fonts to choose
Know first of all that you will probably not have a single font for your entire site. As said before, your site has several types of text, including at least the titles and content. In general, one is used for the title and one for the content, but never more than 3 fonts on a website.
But certain fonts can be used for rarer and more specific texts, such as quotes, code extracts, emphasis, a call-to-action button, a promotional banner … Be careful however to remain consistent and avoid multiplying the fonts without reason n.
Remember to combine the typography of the titles with that of the content to harmonize the graphic design. Test different font associations, try to be original, creative, and elegant.
To find good combinations of fonts and inspiration, there are platforms like Typespiration, Fontjoy, or Fontpair. Try it out, it can be profitable!
4- Online platforms to choose your fonts
Google Fonts
The main advantage of the Google Fonts platform is its open-source approach, so with fonts that can be used for free. They are also perfectly suited for the web and very useful for graphic site composition.
Integration is facilitated since the fonts remain on Google servers, it is enough to integrate it on its site via an HTML link tag or the CSS rule @import. The first load can be slow if the font is not in the user’s cache, but after all, everything is done to lighten and speed up the load. You can also download the font for local use or host it on your own.
Google Fonts was a mini-revolution in web typography and is often recommended, even if the fonts offered sometimes lack style and originality.
Other platforms: Fontsquirrel, Myfonts…
These platforms have more choices and styles but in the majority of cases, it is necessary to provide a license to pay. This license is more or less expensive, cost per view per page in general, but you can also find licenses with a price per font of a single typo: “regular” “bold” …).
In terms of integration, it depends on the platform, but there are integration methods similar to Google Fonts. There may, therefore, be loading concerns as for Google, we must also be vigilant about compatibility with desktop / mobile browsers.
You can also consider having a charted font specially created for your company, which will be more consistent with your graphic charter and strengthen the brand image. This requires more time, money, and thought in terms of integration and compatibility.
To summarize, in order to choose the best font (s) for your site, you must, therefore:
1. Define your identity, your target, as well as your graphic charter.
2. Define the number of fonts you need.
3. Choose your font type based on these criteria.
4. Select your font on one of the platforms.
5. Try the chosen fonts.
Our advice:
- Follow UX recommendations: choose legible fonts that are suitable for all media;
- Test reading in different sizes and on different media;
- Also check that the fonts have all the necessary styles: at least regular/bold/italic;
- Make sure they include accents;
- Avoid the police exclusively in the capital, this can be seen as aggressive;
- No more than 3 fonts per site, and remember to harmonize them!
Do not hesitate to offer us your favorite fonts!
Comments are closed.