Things to Consider When Choosing Font for your Website
August 2nd, 2009 by Things to Consider When Choosing Font for your Website
A plethora of elements go into an exceptionally designed website; however, some web developers concentrate more on the art and less on the substance. What is more important than content?! The purpose of nearly all websites is to give information, and the content is what transmits that information. Thus, this is where typography is crucial and must be selected carefully. If people cannot read what you have submitted on your page, or if they find it difficult to understand, annoying, too large or too small, too dark or too light, then this can affect the overall success of your design, and ultimately your business. Moreover, a lot of what goes into web design is psychology. Just like I discussed in “The Meaning of Colors in Design,” font can also have a psychological affect on the reader. Here are some things to consider when selecting font for your webpage. Some of the tips may seem obvious, but in my experience, they are still overlooked my many developers! Hope you find this information useful! Feel free to comment, as I love to hear from fellow web design enthusiasts!
Usability
Usability of the font is absolutely vital is a good design. Jakob Nielsen stated in his “Top Ten Web Design Mistakes of 2005” that legibility was the number one problem viewers voiced about a website, mainly complaining that small font sizes or low contrast between the font and the background, caused limited usability for visitors. Therefore, you can see the importance of using a font that is user friendly. If the font is not comprehensible to the reader, it is worthless! Essentially, the font must be the right size, style, color, and shade in order to allow the user to access the content on the page with ease. Many clients have expressed to me the desire for scripted or decorative fonts, and though there are occasions when this sort of font may be appropriate, I generally stress to my clients that it is more important to use a font and font size that is usable, rather than a font that is stylish. There are many other ways to express your artistic flare into a design, such as color, background, texture, or images. In addition, remember to select a typeface that is easy to read for long periods of time. If you have a blog where you want readers to read long articles or remain on the site for an extended period of time, make sure you select a font that has the right spacing and size. I suggest sticking to the basics when it comes to font, because your user will appreciate it and your site will positively benefit!
Accessibility
Accessibility is key in a successful website. “Web accessibility” is the idea of making websites easily accessed by all types of people including those with certain disabilities, different languages, or lack of access to certain technology. The concept is derived from the fact that all people should be given equal opportunity to access websites regardless of their limitations. Thus, even if you, as the web developer, have thousands of fonts installed on your computer, remember that you are limited by what fonts the users have installed on their computers. If the user does not have the font on their computer, then it may not appear to them as you intended it, or they may not be able to view it at all. Not every user is as technologically savvy as a web developer, so remember to implement a typeface that is universal, so more people can have access to your information. Moreover, with accessibility, you have to remember that the font must be large enough and have enough contrast against the background in order to assist those with problems with sight or the elderly to read with ease.
Conversion/Bounce Rate
Site conversion is the amount of people who go to your site and actually return, end up buying something or use your site. The bounce rate is the percentage of initial viewers to your website who “bounce” away to an alternate site, rather than continue viewing your site. With all websites the goal is to increase viewers, and with some sites, you want viewers to stay for an extended period of time, purchase items, select your business, and ultimately return to your site in the future, become a regular user, or even recommend it to others. A small amount of designers actually recognize that the font can play a significant role in the viewer’s impression of the site, and can considerably affect the overall bounce rate of people coming to and staying on your page. The initial impression is so important to the viewer, and if it is a negative first impression, it can keep the visitor from returning. The bottom line is if the font is to the viewer’s liking, if they find it easy to read, and if it appears professional, it can greatly increase the likelihood of the visitor staying longer and returning in the future.
Target Audience
Who are you targeting in your website? Children, elderly, web developers, lawyers, bankers, teen-agers, or what? Well, the target audience is a huge consideration when designing a website and the font should be no exception. The font you choose should take into account the viewers you expect to come to your site, because that can make a difference as to what font you select. For example, larger easier to read font should be used for the elderly, fun decorative fonts can be used for children if they will not be reading much on the page, and if you want your viewers to feel confident and reassure in your ability, use a more blocked font. Stay tuned for an article that deals with the target audience, and how this should be taken into consideration in all aspects of your site!
Logo
The logo is where you can be as creative as you would like with the font, and this is where you can truly express the feeling or personality of your business. Different fonts can convey different messages about your business and can give the viewer an immediate opinion of your business. The logo is vital to the success of a business, and it is usually the first thing a viewer will notice on a webpage. Moreover, now a days, logos are primarily text based, so the font selection should be carefully considered. The logo speaks for the company, so use a font that expresses the essence of your company. Catherine Perry, a logo designer, says if you are a perfume or wedding business, use scripted fonts for the logo; if you are financial institution, she says to use a square or block typed font; and if you are a children’s store, use a decorative font to entertain the eye.
Style
Style is important in a website but try to keep the style limited when selecting an appropriate typeface for your page. Remember to select a style that goes with your target audience, is easy to read, and is not annoying for viewers. In addition, I suggest only using up to three to four different fonts on a page. One font should be for the headers, one font should be for the logo, and one for content. If you utilize an excess of fonts, it will make your site seem not cohesive and will make your site’s design seem amateurish.
Size
The issue with font size ties in with usability, accessibility, and target audience. You need a font size large enough to read with ease, but not so large as to be bothersome. I recommend a standard 12 to 16 px font in general, if the site contains a significant amount of content. There are times when 10 px font may be appropriate, especially if space on the site is an issue, or if the viewers will not be reading for a long period of time. If the font is too small, it can be straining to the eyes for lengthy posts. If the target audience is older or even children, then try to incorporate a larger font, possibly a 16 px font. However, do not go too large on the font, as that makes the website appear too childish and can annoy the viewer. Also, with size comes spacing. Select a typeface with a suitable spacing for the letters, as some fonts with irregular spacing can make reading difficult.
Color
Try to have a significant contrast between the font color and the background color. For example, try to use your lightest background color on your site for the use of text. Preferably, you should use a white background for content with black text, but if white is not in your design scheme; try to use the lightest color for a background and darkest color for text. This is important because it helps to make the website cleaner and easier to read. If, however, it is impossible to use a light background with your color scheme, use the greatest contrast of colors possible between the background and the text. For example, use a dark blue background with white text. However, never, and I repeat NEVER, use a black background with blue or red text, or a red background with yellow or green text. Those combinations are just design nightmares and are impossible to read!
For Further Reading:
- What Is The Best Font Size To Use In Website Design?
- Which Font Should I Use for My Web Page?
- Save Web Fonts
Teylor Feliz is a well-known XHTML/CSS/JavaScript enthusiast from Santo Domingo, Dominican Republic. He has more than 10 years experience in the computer programming and development world, including 2 years teaching computer science. He is currently living in Louisiana, where he plans to complete his degree in Computer Science, and begin a Masters in the field.
Subscribe to our RSS
Please help us to promote this article.
Sponsors
A Leading B2B platform with 10 years history. Compare & Inquire with Trusted China Suppliers (SGS certified). Log on & Order now!
Thanks for linking to one of our posts
I wonder, why do you use nofollow actually IN your posts content…?
All you are doing is nuking your own pagerank….
@Hobo
Thank you for bringing that to my attention. I did not realize that I had used nofollow in that post. Thankfully, when I check in other post I did not find nofollow in those links. I guess I just was not being careful that post! Thanks again!
yeh right.. great post, Thank You
What font are you using for this article?? This is what I want for my website content. Also, do let us know if you’re using line spacing here – obviously content is important but the way you’ve spaced the text makes it very clear…many thanks – do let me know!!! great article!!
@Beckyb
I am using for content
and for title
I am glad you like the font, and thanks for visiting us!
This article has been shared on favSHARE.net. Go and vote it!
Through you looking for details. It helped me in my responsibility