7 important tips for typography in web design

Graphic Design Marbella

Chances are that someone who visits your website does not attach importance to your incredibly well thought-out color palette, your perfectly exposed images that obviously respect the golden cuts meticulously or the strategically mapped content hierarchy, but simply start reading immediately. Then you may have already launched the most beautiful, most innovative website, ultimately everything revolves around text when it comes to conveying the message.

Typography Web Design

For those reasons alone, typography, the art of designing text, should be a top priority for any web designer. And, a readable website is a better website, something that every marketer likes to work with. In this blog post, we will review 7 simple rules that you remember best for your next project.

1. KEEP THE NUMBER OF FONTS MINIMUM

When using 3 different fonts you get the feeling that the website is unstructured and unprofessional. Also keep in mind that different sizes and styles will benefit your layout apart from each other. Try to limit the number of font families (two is a lot, one is often sufficient) and stay through the entire website with your choice. If you use more than one font then make sure that they complement each other on the basis of their letter width. The combination of Georgia and Verdana are made for each other while Baskerville and Impact will never know a ‘happy ending’.

typography web design

2. CHOOSE STANDARD FONTS

Services such as Google Web Fonts and typekit have made it possible to use sexy and exotic fonts that can give your website that extra fresh, unexpected touch. But people are simply the habit of reading animals and texts with a familiar letter type easier and easier. If your website has a valid argument for an alternative font, such as branding or creating a compelling experience, you should stay with standard fonts such as Arial or Calibri.

3. REST LIMIT LENGTH

To promote readability it is very important to use the correct number of characters per line. Do not let design decide on the width of your texts. A pleasant average is 60 characters per line. If a line is too short, the eye must constantly move forward, which disrupts the reading rhythm of the user. If the rule is too long, the eye has difficulties to focus on the right rule and it strays quickly. For smaller screens, we recommend 30-40 characters per line. Below we see an example of 2 mobile websites. The first one uses 50-75 characters per line (which is ok for print and desktop), while the second website uses 30-40 characters.

typography web designtypography web design

Read more about web design 

1.What makes a web design and development agency good?

2.Website Builder: 8 characteristics of an effective website

 

4. CHOOSE A FONT THAT WORKS FOR ALL THE BIGS

More and more people visit your website mobile, which ensures that you have to take into account different sizes and resolutions. Many interface elements are scalable (buttons, labels, headers, etc.). It is important to choose a font that is readable in different formats. The standard format for websites is 16pt. Do not be tempted by the sexy curves of Vivaldi and avoid cursive fonts at all times. Always go for the most readable option.typography web design

5. SELECT A FONT TYPE WITH DISTINCTIVE LETTERS

Many fonts have similar characteristics for letters, especially i’s and l’s are a problem. Another problem that often occurs is between r and n. Due to a limited number of letters, it seems that both letters form an m.

typography web design

6. DO NOT REDUCE THE SET DISTANCE 

A correct line spacing promotes reading. It has even been proven that a correct line spacing also benefits reading comprehension by 20%. A good line spacing is 30% larger than the font size. Some factors that play a role in the line spacing are: size, thickness, capitalization, spacing, etc.

typography web design

7. CARE FOR SUFFICIENT CONTRAST

Ensure sufficient contrast between the color of your font and the background. The more contrast the text is, the faster the user can read your message. Do not forget to test on different screens. Each screen has its own specifications regarding contrast, saturation, sharpness, color temperature, etc.

typography web design

Open chat
Scan the code
Hello
Can we help you?

Latest Reviews

FML Marketing

Customer Reviews

Minoek Egberink 10-10-2023

Google
FML Marketing provided pleasant communication, clear agreements and great solutions for my revised business website. An accompanying marketing plan has now also been drawn up and implemented. The leads and conversions have increased measurably and this has entered a new phase of growth for my company!

C F 05-10-2023

Google
Ken and Michelle have saved my business many times over the years.
They are top people who always deliver their work honestly and punctually.
I recommend them to everyone.
If there was a 6th star available they would definitely have gotten it.
Thanks for everything.

Anna Ch. 11-10-2020

Google
Have been working with Ken and Michelle at FML marketing for the best part of a year now - they're a fantastic team. We've launched two new websites, 3 marketing campaigns across all social media platforms and created endless amount of additional marketing collateral like videos and infographics with their help. The communication has been fantastic, and there's hasn't been a single idea that we haven't been able to successfully implement without their help. Would highly recommend to anyone looking for a creative, professional service.

Maurice Elst 23-04-2020

Google
Excellent company providing social media and marketing services. High quality design, reliable team, excellent communiction. Well impressed with our new real estate website and social media channels and campaigns.

Irene Pais 11-04-2020

Google
We are very satisfied with FML Marketing. They created 2 websites for us, help with our SEO and do the marketing for our company. Ken and Michelle always think along with us, give good advice and always respond quickly to our questions.We recommend FML Marketing to everyone. Besides that they are super professional, you can also have a laugh with them.