The Basics Of Typography In Web Design

What Is Typography?

Typography is simply defined as the art and technique of arranging type to make written language legible, readable, and appealing when displayed. As simple as it may sound, it is not just merely choosing what font to use or how make everything a little more readable. There are a few things to consider in dealing with typography.
Typography is typically done by typesetters or compositors, but actually there are a bunch of other terms for people who do typography depending on the type of arrangement they render. This article is focused on web designs.  Before we dig deeper, let us discuss the important terms frequently used in web design.

ELEMENTS OF TYPOGRAPHY IN WEB DESIGNS

• Typeface

  It is basically a font family. It is a set of fonts with different designs and features. So, this would be something like Arial, Times New Roman, Calibri, Century Gothic, Trebuchet, Comic Sans, etc.

• Font

  It is a set of characters with the same style and size. One example is 11-point Arial in bold or 14-point Times New Roman in italic.

  It is typically measured in points (pt). Points dictate the height of the lettering. There are approximately 72 (72.272) points in one inch or 2.54 cm. An example would be the font size 72 would be about one inch tall, and 36 would be about a half of an inch. This would be the size, particularly the height element of typography.

• Weight

  In typography, weight is defined as any particular styles used to make the characters appear heavier lighter. This affects the size element of typography.

  For example, if you want the text to be extra thin, you have the option to use the weight ‘thin 100’or if you want your text to appear bolder than usual, you may opt to apply the weight ‘extra bold 800’. It depends on how thick or thin you want your text to appear.

• Kerning

  It is simply defined as the process of adjusting the spacing between characters of in a proportional font. This does not only improve legibility or readability, this is also to make it look more appealing and pleasing to look at. However, you do need a separate editing software to use this function.

• Tracking

  It is basically letter-spacing. It refers to an optically consistent degree of increase (or sometimes decrease) of space between letters to affect visual density in a line or block of text. This is not to be confused with kerning because the former is used to adjust the density issues in reading.

• Leading

  If tracking is all about letter-spacing, leading is the line-spacing aspect. It is the distance between two baselines of lines of type. Leading is so named because conventional print shops put strips of lead between lines of type to increase vertical space.

These are only the key elements of typography. There are a lot of things under each of these elements that you need to consider but basically, all you are after is to make your web design more legible, readable, aesthetically pleasing and of course interesting for people to give it a go.