This article is a follow-up to: Tips for graphic design and usability alongside internet marketing (part 1)
At the moment, people still write to each other more than they telephone. A good reason to examine the text on your website for readability.
Typographic design determines the look and feel of your website
The typographic design of a website is often underestimated. Typographic design ensures that the text on the website is readable and wants to be read. The choice of font largely determines the appearance of your website. Which company would you rather do business with?
Typographic design recurs everywhere
People read from various media. People read newspapers, packaging, books, traffic signs, street names, billboard advertisements, and screens. For each medium, the reader's situation must be taken into account. To limit it to websites for a moment: the reader is sitting behind a screen. Reading from a screen is perceived as more tiring than reading from paper. Therefore, the choices made regarding typography are different from those for print purposes.
Typographic design on a screen
Unfortunately, there is no unlimited list of fonts for a design agency to choose from. This is because not every font is installed on every computer. There is a list of approximately 8 to 10 fonts that appear on every computer. That is why many websites use the same font. Is that a problem? Absolutely not; readability is paramount. Besides readability, there are many other factors that must be taken into account in typographic design.
A series of tips to view on your own website
1. Use fonts without serifs
All fonts can be divided into two types: serif fonts and sans serif fonts. Serifs are recognizable by the small 'feet' at the ends of the letters (for example, Times New Roman). A sans serif font does not have these small feet (Arial). Serifs are designed to visually assist the user in reading the line. This is practical on paper, but it turns out not to work well on the web. Choose a sans serif font to make the text easily readable on the screen.
2. Line spacing
With a serif font, it takes the visitor slightly more effort to follow a line. The reader can be helped with this by increasing the line spacing (the distance between two lines). This keeps the lines separate and therefore easier to read. Lines that are close together are tiring to read. Avoid this where possible.
3. Use a line length of approximately 55 characters
The length of a line can determine how easy it is for a visitor to read the text. If a line is too long, it becomes more difficult for the visitor to maintain concentration. It is common with wide texts for visitors to start reading the same line again because they have trouble finding the beginning of the next line. A line length of approximately ten to fifteen words is easily readable for a website visitor.
4. Color and contrast
Have you ever tried to read orange text on a blue background? Besides giving you a headache, it looks just like all the letters are dancing. A strong contrast between the background color and the font color ensures that the text is easy to read. Preferably use a white or light-colored background with dark font.
5. Use a clear hierarchy
Nowadays, people read less and scan more. This means that a visitor to your website looks for information that is relevant to them. Ensure that the important sections are provided with clear subheadings to attract the visitor's attention. Use different font sizes and styles for this purpose to clearly distinguish them from the regular text.
6. Consistency within the design ensures recognizability
Using multiple fonts within a design does not cause confusion, provided you limit it to two (maximum three) fonts. Otherwise, there is a risk that the overview will become cluttered. For subheadings and titles, it is perfectly fine to use different fonts to clearly indicate the difference. Ensure that the fonts match. If you choose to use the Cambria font with a size of 14 points for a subheading for the first time, make sure that the subsequent subheading has the same style. Due to this consistency, every subheading is recognized as a subheading by the style. This ensures clarity and structure and is important for the credibility of a website.
7. Use of whitespace
White space is the space between two paragraphs. Use sufficient white space. When all paragraphs are separated, the website has more balance. Additionally, the website becomes clearer through the use of sufficient white space.
8. Underline the hyperlinks in a text
Many designers are not fond of the underline at the bottom of a link. They make the link less conspicuous by making it dark blue instead of black. That way, the text stands out enough, they believe. But many designers forget visitors who cannot distinguish all colors. An estimate (Color blindness is sometimes life-threatening.): 1 in 12 men has a color deficiency, just like 1 in 250 women. That means that, on average, there are 700.000 people walking around in the Netherlands who cannot distinguish all colors. How are they going to see that that specific word in the text is a hyperlink? By underlining it!
Slot
Take a look at your own website after reading these points. Is the text on your website easy for visitors to read?
Previous articles
Tips for graphic design and usability alongside internet marketing (part 1)