ClickCease

Please wait

Message received
Thank you for your inquiry

. We appreciate that you are considering us for your project. You will be hearing from us within 1-2 days
See you soon

Step 1 / 3

orange landscape
close icon

    Step 1 / 3 - Choose project type

    Let's discuss your next project

    Send an enquiry and get a realistic price estimate of your project idea.

    WebsiteWebshopDigital DesignSeoAdvertisingProgramming

    Step 2 / 3 - Project information

    Describe your project in detail

    Step 3 / 3 - Your contact information

    How should we contact you?

    March 23, 2023

    Examples of good fonts

    Back to Knowledge Universe

    Emelie Carén

    Emelie Carén

    Art Director

    Some examples of good fonts:

    • Roboto
    • Lato
    • Ubuntu
    • Playfair
    • Open Sans

    In this post, I will try to enlighten you about fonts by giving some examples of good fonts and providing advice on readability and what to be particularly aware of when choosing.

    We start with the web, as we are a digital house and therefore focus on the area where we belong and where we are incarnated.

    Frequently used fonts

    Out there in the big world, the most frequently used fonts are:

    • Helvetica
    • Calibri
    • Futura
    • Garamond
    • Times New Roman

    However, for many reasons, which I will elaborate on later, we would not recommend the above fonts for your website.

    Instead, we mostly use the following fonts:

    • Roboto
    • Lato
    • Ubuntu
    • Playfair
    • Open Sans

    We mostly use these because:

    1. They work well digitally, whereas other fonts may be better suited for print.
    2. The shape of the letters makes them easy to read.
    3. They are fairly neutral fonts, so they can fit many different use cases across industries.

    Which font is the most readable?

    All of the above-mentioned fonts belong to the so-called “Sans-serif” family.

    This group of fonts does not have “feet”, making it easier to read on the web where feet can quickly consist of too few pixels and become unclear to the reader.

    On the other hand, fonts from the “Serif” family are easier to read in print, as the feet here are often more distinct than with pixels, and the eyes can “follow” the feet when reading, thus guiding the reader’s gaze through the text.

    Bonus info:

    Open Sans is particularly good for increased web accessibility, including for the visually impaired and dyslexic.

    Readability doesn’t only depend on the font

    If you want to treat your readers (which should always be the goal) with delightful and readable texts, then you also need to be thorough in selecting the formatting of your font.

    Regardless of which font you choose, the color of the font should be selected based on the background it will be used on. For example, you can’t read a completely white font on a black background, as the two are in such violent contrast to each other. The same applies to a completely black font on a chalk-white background.

    Here, one should find some shades of dark gray instead, which complement the white better and thus make it easier on the eyes to read.

     

    Morgan står og er ved at strukturere sit data, for bedre at blive set på Google

    Be mindful when choosing a font

    At Morningtrain, we primarily use Google Fonts because:

    1. They work on all web platforms (and across browsers).
    2. Other fonts may require developers to make it work on the web (read: it can get expensive and cumbersome).
    3. Many fonts cost money per load, or depending on what you want to use it for (print, web, brochure, TV commercials).
    4. And some fonts cannot be used commercially – so you risk not being able to use the same fonts across media and campaigns.

    Serif fonts are more feminine in their expression, so be aware of that when matching the font with the brand.

    Check all formatting

    In addition to colors, you should ensure that all the letters in your font are easy to read and distinguish from each other. Therefore, check the entire alphabet of the font before choosing it.

    The most common pitfalls are:

    • One cannot differentiate between uppercase and lowercase ‘L’ and ‘I’
    • One cannot distinguish between ‘b’ and ‘p’
    • And ‘o’ and ‘0’ look too similar.

    You should also remember to check if the font is suitable for the language you want to write in. Does your font have ÆØÅ, or umlauts (ö, ä, etc.) depending on the language you want to write in.

    Finally, remember to check all the font’s formatting before selecting fonts:

    • Bullet points
    • Italic
    • Bold
    • Underlined
    • Capital and lowercase letters

    Designer’s advice

    Before you embark on exploring fonts and choosing them, don’t miss out on a designer’s advice:

    • Once you have chosen a font, you should choose a line height that enhances the appearance of the font. Our recommended line height is 1.6. Your line height determines how compact your letters will appear in relation to each other. This can ruin even the best font.

    Billede der viser hvor stor betydning "line height" har

    • Do not use more than 2 fonts on your website as using more creates disorder and makes it difficult to read. This is because the brain constantly has to deal with different formatting, and in the end, it will be perceived as disruptive to one’s reading.
    • Bonus: If you have two fonts, the two fonts should have a contrast to each other. For example, you can use a serif font in the heading and a sans-serif font in the body text.

    And a good little reminder that you should definitely take with you: “Use common sense not comic sans” 😉

    That’s it, I hope you now feel equipped to tackle fonts.

    Emelie Carén Art Director
    Emelie Carén
    Art Director
    Hello there
    We can see that you are from Denmark. Would you like to switch to Danish?