Welcome to e-Typography. Typography Give You Another Unexpected View. Feel free to leave comments. Thank You.

Thursday, February 3, 2011

Basic rules of typography for web design

Typography plays a very important role in web design. About 95% of web design consists of the font; therefore the knowledge of typography should be a top priority for web designers and web developers. Selecting the best fonts is essential for any image or design. Fonts can either make or destroy the design, so it is critical for designers to choose the right font that will suit to your design.
The following is a brief explanation about the fonts used in web design:

Serif Fonts

This is one of the oldest types of fonts around since the year 1200. One kind of Serif font family that often we know it is Times New Roman, Georgia, Book Antiqua, Palatino, and Garamond. Serif fonts are also commonly referred to as the letter 'shoes' because it has a lengthening of the serif her (see picture above). These fonts reflect the quality and firmness. Serif font is more readable, memorable, and easily absorbed by the brain. This font is often used in Newspapers and Magazines. The Serif fonts are more suitable for use in offline media high-resolution (300 dpi), such as books and newspapers, where they can perform detailed and more readable. They are not suitable for online text except when it is set larger than normal.

[Source: http://www.gravisware.com/tutorial/128-dasar-dasar-tipografi-dalam-web-design.html]

Slab-Serif Fonts
Slab-serif font is a subclass of serif fonts. Serif fonts such as fonts but have a firm straight line (not curved). This font is no good to be presented in small size because it will lose the details and become difficult to read. One type of Slab-Serif font that is quite popular is Rockwell.

[Source: http://www.gravisware.com/tutorial/128-dasar-dasar-tipografi-dalam-web-design.html]

Sans-Serif Fonts

Sans-serif font family is the most suitable font for use in web design. This is because the font is still comfortable to read on the screen. Sans-serif font also suitable for the title, because they are quite prominent and readable from a distance. Sans-serif font family of the most frequently used is Helvetica (known as Arial in Windows), Trebuchet MS, Lucida Grande, and Verdana. Despite its small size, all these fonts have characters that are 'clean' and easy to read.

[Source: http://www.gravisware.com/tutorial/128-dasar-dasar-tipografi-dalam-web-design.html]

Character Proportion

'Character Proportion' is a font that has the same wide character, no matter the letter 'w' or 'i' are all printed in the same width. This makes the character more difficult to read in normal size because of the letters are less proportional.
Courier New is the family of Character Proportion fonts. This font is not suitable for use as the main typography on the web. However, this font type shall be used in programming or presentation of the HTML codes because it has the same width of letters and spaces easily calculated.

[Source: http://www.gravisware.com/tutorial/128-dasar-dasar-tipografi-dalam-web-design.html]

Cursive and Fantasy Fonts
Two other font families are most often used is Cursive and Fantasy. Two font families are special fonts that are not suitable for use in the body text but quite accurate when use for the title or header.

[Source: http://www.gravisware.com/tutorial/128-dasar-dasar-tipografi-dalam-web-design.html]

Can you think of what are the font types suitable for Advertising, Logo, Apparels, Assignments, and Newspapers?


Online References:
gravisware website company, Dasar-Dasar Tipografi dalam Web Design,[Online], Retrieved 2nd FEB 2011.


back to top