Using an un-web-friendly type can be keeping your business’s website from being seen. It is imperative that your website is easy to understand. Here are 10 typography rules to keep in mind when creating your website:
1. Keep the Number of Fonts Used at a Minimum
Resist using more than 3 different types of fonts for your website. If you use too many it runs the risk of looking like a broken site, which in turn, leads to high bounce-rates. Usually there is one font used for heading, one for body copy, and one for your main home display image. You may have seen fancy websites that have a bunch of fonts and look cool, but those clusters of fonts are usually images and are not meant to be read. They often don’t have any important info about the company’s product or service.
2. Use Standard Fonts
If you are wondering “how can you tell what type of fonts you can use for web?” Well, Google Web Fonts and Typekit have you covered. They have downloadable fonts that are guaranteed safe for web usage. Whether you are custom coding or using a web template from a site like WordPress these fonts can be integrated. Keep in mind the other rules mentioned and not get too crazy with downloading too many fonts.
3. Limit the Number of Lines
If you have a have a lot of content you want to share, make sure to limit the number lines of text. A wall of text can easily tire out a user. A general rule is to break up paragraphs every 6-8 sentences and break up paragraphs with supporting graphics. Different types of fonts can also eat up width space so before going live test out your website on different browser, screens, and mobile devices.
4. Choose a Typeface That Works Well in Various Sizes
Sometimes all you need is one font that comes in regular, bold, and italic. Find a font that has different weights, and you can use it for your body copy and headings. This will allow for easy contrast, and you don’t have to worry about mixing up fonts.
5. Use Fonts with Distinguishable Letters
Certain fonts make letters too indistinguishable. Take the word “Illusion”. Can you tell which the capital “I” and which is the lowercase “l”? If your target market has vision problems or doesn’t use English as their first language you may want to find a clearer font. You are more likely to find fonts with distinguishable letters if your search for “serif fonts”.
6. Avoid All Caps
If you have a short headline or one word that you to emphasize using all caps it is fine. Avoid using all caps for any sentence longer than 3 words. Not only is it hard to read, but it looks like you are “yelling” at the user. Depending on what you are selling this can be a huge turn off. For example, you are selling psych services for people with anxiety. Which sentence looks more inviting:
“We here to help you calm down. Our company deals with patients with anxiety get back to living their lives.”
“WE HERE TO HELP YOU CALM DOWN. OUR COMPANY DEALS WITH PATIENTS WITH ANXIETY GET BACK TO LIVING THEIR LIVES.”
7. Have a Reasonable Space Between Lines
In paragraphs spaces between lines, it is possible to be too tight or too far away. Usually, your template or code will default to even spacing, but you still want to check on mobile and other computer devices. If lines are running into each other or are too far away that they don’t look like the info is together, then this will negatively impact the user experience.
8. Have Color Contrast
No light text on a light background and no dark text on dark background. If your logo or brand colors involve hard to read colors incorporate a neutral color (black, white, grey) into the web design. Neutral colors rarely destroy brand consistency. It is very important for text, especially if you want users to read it, to be in color that the majority of the population can see.
9. Avoid Coloring Text in Red or Green
Speaking of hard to read text colors, red and green. Individuals that are colorblind cannot read red or green text, especially if it small. Avoid at all costs for body copy. You might be able to get away with large headings if your background is white, but it is best to avoid these colors. If these are your brand colors, incorporate them into the graphics instead.
10. Avoid Using Blinking Text
While it fun to use flashing text for social media marketing or online ads, it is best to avoid on your actual website. Flashes or flickers can cause headaches or worse trigger seizures in certain individuals prone to seizures. Users want to able to read important info without interruption.
Let us create a type-friendly website for you. Call 248.528.3600.