|
#1
12-17-2009, 11:51 AM
|
|||
|
|||
The Fine Art of Font Choices
I am currently working on redeveloping a lot of my individual sites. As I looked into redeveloping these sites, I started to wonder about what font-type was the most readable for my users.
This may seem like a rather trivial question after all, how much of a difference would an Arial 10pt font make over a Verdana 11px size font? However, when approaching a website project it is always good even necessary to do so from a \'big picture\' view. You may have read recently how a web user will judge a website in less than a blink of an eye. I know from personal experience that if I chance upon a website that does not \'look\' like what I am looking for, I may not even let it fully load before I hit my back ****on. Every aspect of your website, from the layout to the colors to the font selection plays a role in the ultimate presentation of your website. The truth is, most experienced web surfers have learned how to distinguish a quality website from an unprofessional website. It does not take much to turn off a web surfer. Because of this, it is absolutely essential that you present your website in the best manner possible. This includes looking at the font that you use. Extreme Examples On occasion a website owner will submit a review to the Site Review Please section of the Site Reference Forums that sports a website with an absolutely horrible font choice. These sites may have a very unique font choice (usually a highly stylized font) or a font that is all in italics, bolded, or even all capitalized. Let\'s make one thing clear: all bold text, non-standard fonts (standards being Arial, Verdana, Times New Roman, or even Georgia), or other highly stylized fonts are NOT acceptable when building your website. Although standard fonts may seem \'boring\', they are easy to read, and readability should be the goal of every website. How Long is Too Long, and How Short is Too Short? While I started my plans to redevelop my sites, I happened to come across a few studies which looked at line lengths. I never considered exactly how line lengths would effect the readability of a website, but as I considered the topic further I realized that line lengths make a significant impact on just how readable a website actually is. Consider the following example: Can you This sentence is much easier to read as you do not have to look at a new line every two to three words.Although that example is a bit extreme, numerous studies have consistently shown that line length affects how quickly a reader can read a document. Furthermore, line length also affects how the user perceives their experience reading that site. After doing some research, I found this study which showed that the optimal line length for adults was 65-75 characters per line. For children that line length was shortened to 45 characters per line. How true is this in regards to your website? It is fairly easy to test if you use CSS. Take a section of your web page whose width is declared explicitely through CSS (as an example, a DIV tag with a significant amount of text that has an explicit width of 500 pixels). Change the width of that section to 35em (em's represent approximately the width of one character). This should make your line length approximately 70 characters. If you would like to test what that same section looks like at 50 characters per line, change the width to 25em's (the relationship here is 1em = 2 characters). Judge for yourself which length is more readable. Which Font is the Most Readable? Along with reading about optimal line length, I spent quite a bit of time looking up information on which font style was the most readable. Many people claim that Verdana is the most readable font for the web while others swear by Arial. Yet tradition holds that Times New Roman is the most readable font (as well as its close relative Georgia). Unfortunately I could not find a consensus among the several studies that I read. Each had their own methodologies which came to differing conclusions on the specific font-size and font style (ironically enough, verdana was never listed as the most readable font, although it usually tested as one of the most readable fonts). Some measured the performance of readers while others asked users for their actual experience in reading the website. The result was recommendations for just about every combination of Arial, Verdana, and Times New Romain with varying font sizes. This lead me to several conclusions about fonts: - Arial, Verdana, and Georgia are all very readable fonts. Times New Roman, while highly readable, is often looked upon as "unformatted" and viewed as "unprofessional" on the Internet. -Larger text is not always better. Readers had trouble reading text that was too large fonts such as Verdana lend themselves to a smaller relative pixel size (for example, the largest text size that should ever be used in a standard paragraph is a 12pt font probably 10pt for verdana) -Line height (as controlled by CSS) can impact a font\'s readability. A line height of 120% was recommended by more than one study, although I have found that line heights as large as 200% can be very readable. -The length of a page and surrounding elements also impact a page\'s readability keeping space between the \'readable\' portion and navigational elements is essential (often referred to as the gutter). A Practical Application of Fonts The problem with font usability studies is that they all try to measure the usefulness of fonts according to a specific model. Websites, unfortunately, are not all built according to one model. Some websites are setup as online guides, blogs, or news sites which are content-heavy while others are setup to sell a product or service and thus are more presentation/stylistically designed. Although all websites should aim to be readable, sometimes readability can be sacrificed for building the proper image. A good friend of mine, who has owned a hosting company since 1998, swears by using 9pt Arial justified font for all of his websites. His goal has always been to present a cleanly styled website that is not cluttered, uses cool, relaxing colors, and gives an air of simple sophistication. For that purpose, 9pt Arial justified font works fine, although I would challenge any person to find a study that shows this to be the most readable font styling. Although readability can sometimes be pushed aside for style, this does not mean that it is ever acceptable to present an entire website in bold text or some font that is greatly different than an Arial, Verdana, or Times New Roman font. It may be tempting to choose a creative font for the purposes of being different, but the reality is (beyond the technical problems of browsers rendering a custom font) that readers are only willing to sacrifice so much readability for the production of a marketing image on your website. My Choice for the Best Font Although I personally have not conducted any scientific study to determine which fonts can be read the fastest, or which fonts are most pleasing to users, I know that users want to be able to read the content on a website with relative ease. Furthermore, I know that it is necessary to convey a sense of professionalism and pride in my website. As a result I will probably continue with an Arial font at around the 10pt font-size (11-12 pixels). Verdana is a close second behind Arial. Times New Roman, although highly readable, gives a sense of being 'unformatted' since it is the default font format of the Internet, and Georgia simply seems pretentious to me. I will also stick with the 70 character per line recommendation. 
|
|
#2
12-17-2009, 11:51 AM
|
|||
|
|||
|
Why did I choose this font? Ultimately it was subjective. However, I do know that Arial fonts, especially at the 10pt size (or 11 -12 pixels) are easy to read. I also like the look of Arial, although Verdana has a nice sleek look as well (which is why it was a close second).
Ultimately your font selection is a subjective decision that will come down to the image you are trying to present for your website. Just remember that part of that image is painted by the words you use and the ability of your users to read your website. Take the time today to play around with different font styles, font sizes, line lengths and line heights. You may find that your site suddenly becomes sleeker with Verdana, more sophisticated with a light, well-spaces Arial, or more formal with a well presented Georgia font. And that difference may be all that is needed to take your website to the next level.
|
