How to choose the best fonts – 3 key tips.

July 10, 2007

Choosing the right font for your job is not an easy decision

Professional designers spend a large time trying to understand the importance and impact of font in your ad or website.

The decision of which one to use out of the thousands of available fonts is a crucial part of a successful or failure of your campaign. The importance of having the best looking, easiest on the eyes, readable and clear text is, in my opinion, extremely important.

“What differences are there between the font and text of professional designs as opposed to low quality work?

According to the Designers Mind website in their post about choosing the right font for your work, there are 3 key points you need to touch before decide for your font.

Size – Size of font is a direct variation to attention. As a rule of thumb, body text should never be over 16 pixels. Now, this may not be the case 100% of the time, but who wants to have to scroll 3 or 4 times to read a small paragraph? As stated above, size relates to importance in the web design world. The title or header may range anywhere from 20 pixels to generally 28 pixels. This is an appropriate size for the title because it is noticeable, yet not overly distracting or taking away from the overall view. Keep font categories the same. What I mean by this is, don’t have one paragraph with a size of 14 pixels, while another is 12 pixels. Decide on a font size that will stay constant throughout the design. Take a look at this site. Notice the title has the largest font on the page. The sub-titles both share the same features: all-capitalized, large size (but smaller than the main title), orange, and a light gray underline that spans to the end of it’s container. Body text is dark grey and smaller in size than both the title and sub-titles. Links are the same size as the body text, but are blue in color to stand out. All of this helps to create consistency throughout the content.

Color – Colors have always been linked to emotions. The color of text on a website can register many feelings within our bodies. For example, certain colors release calming chemicals. Large amounts of black indicate authority and power. On the opposite spectrum, white is synonymous with purity, safety and neutrality. Often associated with death, taxes or depression, gray may sway your visitors to feel nothing. The color of movement and excitement, is obviously red. Red is attention grabbing and makes a loud impression; therefore use in moderation is necessary. Blue is the most popular favorite color. Loyalty and respect are found to have blue associated with them (like uniforms). All physical activities are said to be superior in blue conditions. Wealth, superiority and nature have links to green. Shades of light greens are used in hospitals as ways of calming their patents. Happiness, sanguinity and good times are symbolized by yellow. Yet, be very careful with over using this color. It may become annoying or cause tempers to flare. Orange is unlike any other color, the most ostentatious or showy. It has traits linked to ambition and a new attitude. Majestic, royal, rich are examples of purple’s power. Used often to create a feeling of mystery. Overused though, and purple causes an artificial affect. Brown is associated with the earth, stability and harvest. Also, brown should be used moderately. As you can see, mere colors can affect a user’s experience before they even read your site.

Typeface – All websites should use typefaces that are practical, easy to read and simple. No one wants to read some impact or space typeface on a professional page. One of the most popular typefaces in web design right now is Arial. Why? Arial is a sans-serif typeface that’s easy to read, has great proportions, and looks great when used with proper vertical spacing. Bold, italicand oblique typefaces draw attention to important information. Normally links or hyperlinks are easy to find because they are underlined and/or colored differently than the rest of the content. Personally, I really love dotted underlines under links. Use these whenever you feel the need to make something stand out, but don’t get caught up using these too much — overuse can ruin a good thing.

By far the two most common types of fonts currently used on the Web are the serif font, Times New Roman and the sans serif font, Arial.

The question is, which one is more legible and at which size?

According to a study from Wichita University the results are:

12 point Arial – the best font for reading. Also the most legible and sharpest font

However

12 point Times New Roman was elected as the fastest font to read. Also users gather more information and better comprehension

Tomorrow I’ll write about best fonts for an effective presentation.

Cheers
Lucio Dias Ribeiro

By the way, Vitaly Friedman compiled a list of 25 best free quality fonts, worth to check.


As Featured On Ezine Articles

Share and Show some Love:
  • email
  • PDF
  • Print
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google Bookmarks
  • Yahoo! Buzz
  • FriendFeed
  • LinkedIn
  • StumbleUpon
  • SphereIt
  • Twitter
  • Technorati
  • HackerNews
  • Netvibes
  • Ping.fm
  • Posterous
  • Reddit

No related posts.

Related posts brought to you by Yet Another Related Posts Plugin.

{ 2 comments… read them below or add one }

1 Divyang February 11, 2010 at 8:13 am

Choosing fonts for your website or blog is very important, because it’s the identity of your website. You explained this well in detail. I’ve gathered 70+ fonts for headlines and titles which are elegant yet simple. You can find it here

2 maggie July 27, 2010 at 1:40 pm

thanks thats great :)

Leave a Comment

Powered by WP Hashcash

Previous post: Convert your documents using your email

Next post: Best fonts for your presentations