July 2, 2014

211 Views

Typeface: The art of making a person read in between the words

Well said by an artist, “creativity and hunger have no bounds....it can compel a man do the impossible”.

I won’t talk about hunger here, but I will talk about the second most important thing next to being alive i.e. creativity. In visual designing, choosing the right typeface is essential to express the product’s concept succinctly in words.

Typography – “A typeface (also known as font family) is a set of one or more fonts each composed of glyphs that share common design features.” - Wikipedia

From my viewpoint, choosing a correct typeface is critical to convey the right message to the end users.  For good understanding, I always make sure that the typeface should look as clear, simple, and readable as possible. The simpler a type design, the more legible it is.

The Typeface used in a visual design has a significant impact on the readers. Before selecting an appropriate typeface for your design, it is important to understand its principles. It helps to create a design that portrays the vision and mood of user interface. Good typefaces are designed for a good purpose, but not even the very best types are suited to every situation. Depending upon the project background typeface should be used. Choosing the right typeface can capture the feelings of the viewer.

For example, I have to create a logo for the banking sector. From a finance point of view, font to be used should be one which creates a sense of professional, security, protection and looks more convincing. A user wants to connect with those people who can manage their money and this should be predicted by font selection.

 Below, I used different types of fonts for logo. You can easily see which one is the better choice for banking sector. The Font “Hobo Std” is considered an art style.

Following points to keep in mind while choosing an appropriate typeface:

  1. Readability is arranging words and a set of words in such a manner that the viewer can easily read the sentence.  Choose readable typefaces for headlines and body content. Select suitable font size and make sure the line height should be greater than the point size of your typeface.
     
  2. Legibility is the ability where the viewer can easily distinguish individual letters without any effort. It can be the font size chosen, transparency of typeface. The simpler a type design is, the more legible it is.
     
  3. Plan typeface hierarchy by changing the font sizes. Select those fonts which provide enough variations with bold, italic, and Caps. White space also plays an important role in the hierarchy. Different variations of font and white space can easily distinct the text in a good hierarchy.
     
  4. Limit the number of typeface used in a project. Use only one or two fonts in your designs.
     
  5. Avoid using too small text in layout that is not properly readable. A viewer should never need to “pinch and zoom” to navigate or read any part of a site.
     
  6. Be cautious while placing text on a dark background. Always work on the background where you have to place the typeface. It is an important factor that represents readability.

In current times we have more options to select a typeface for body content. Days have gone when we have to select only Web Safe Fonts, which were commonly available in all the systems.  Now we can think beyond web safe fonts. We have more option when it comes to use fonts and can buy any font we wish to use or use it directly from free font libraries like “Google Fonts”. Web Designers just need to include these font file or font paths in the HTML code and it will be automatically downloaded in the client system as and when needed.  These fonts are defined within the CSS3 via @font-face rule property.

The types of fonts that can be used are

  • TrueType Fonts (TTF),
  • OpenType Fonts (OTF),
  • The Web Open Font Format (WOFF),
  • SVG Fonts/Shapes and
  • Embedded OpenType Fonts (EOT)

I hope most of you will agree with me that Typeface is the art of making a person read easily in between the words. Do leave your suggestions and thoughts in the comments section.

References:

http://www.smashingmagazine.com/2011/03/24/how-to-choose-a-typeface/

http://design.tutsplus.com/articles/10-rules-for-choosing-the-perfect-typeface--vector-12548