LETTERED: A BEGINNER’S GUIDE TO TYPOGRAPHY

Words are an unavoidable part of our life.

As basic units of communication, they exist in everyday existence in all sorts of forms: spoken, written, and even thought!

From the newspaper you read with your morning chai, the number of the bus you take to work, to this blog words, letters and numbers are by your side constantly.

Naturally, due to this ability of transference, they play a crucial role in design as well.

Good design, it is said, must effectively communicate the idea that the designer wants to convey to the audience.

And as basic units of any means of communication, words are an indispensable part of design.

What is typography?

Typography is, in simple words, the art and technique of arranging written or typed text in a way that makes it easy to read and understand, as well in a manner that is appealing to look at.

The term is also applied to the style, arrangement and appearance of individual letters, numbers and symbols – thereby associating it with type design, which is the art of designing such written characters for use in written text.

Typography involves a number of aesthetic and technical aspects such as selection of typefaces (commonly known as font faces), letter and text sizing (font size), line lengths, line spacing (called leading; rhymes with wedding), the space between characters in a line (tracking), and the gaps between every pair of characters (kerning).

Originally, typography as an art was practiced by specialists who created hand-written manuscripts.

With the invention of printing technology and automation, it became the work of typesetters and was used by book publishers and newspaper houses.

As the years passed and the digital age came to be, the applications of typography have expanded greatly.

Due to its aesthetic appeal, it is often applied beyond strictly text-based media. Today, book cover illustrators, graffiti artists, comic and manga illustrators, film and theatre art directors, and graphic designers too find use for typography.

And it’s not just limited to physical media – there are brilliant examples of typography on the internet as well.

Using typography effectively in design

Design is a visual means of communication, combining images with words (whether written or implied) to pass along a message. It is around us on paper and in virtual space.

From coins we use to make our daily purchases to advertisements broadcast on the television and printed in the newspaper, videos we see on our mobile screens, websites we visit or the books we read, design is an essential part of our lives.

Around 95% of content on the internet is comprised of text, making it invaluable to know how to shape and arrange text in an effective way so that the end user can easily find the content they are interested in.

In typography, the beginning lies in planning out the overall arrangement of the text.

This is called macro typography, and is similar to the discipline of information design.

In this stage, we decide on the arrangement of the content: how many columns, where there should be space for images, column width, where there should be white space, etc.

Effective typography follows the basic principles of design and is readable, appealing to look at with harmonious individual elements, and has a balanced arrangement.

Once the arrangement of the chunks of text on the page is fixed, we move on to the aspects of micro typography.

The most obvious of these is the appearance of the text itself, which is defined by the font face or typeface.

A common concern is the number of font faces that may be used. Typically, two or three different font faces are more than enough.

The point to keep in mind here is harmony.

The fonts should be different from and still complement each other.

For instance, if the heading is a serif font, the text of the body could be in a sans serif font to add contrast and still maintain harmony.

Alternatively, the heading could use a bold or italic variant of a font while the body uses a regular variant of the same font.

Using standard fonts makes it easier for readers as they are more likely to be familiar with the font face.

Capital letters are better avoided, especially for the body of the content.

Just as too little text can hinder the message being communicated, too much text is also not helpful.

It is important to find a balance between text and white space.

As a general rule of thumb, gaps for leading and kerning should be around 125%-150% of the corresponding line of text to avoid the words and letters looking too cramped or too spaced out.

Lines should not be too long, nor should they be too short. Shorter lines, however, are acceptable for mobile layouts (more on that in a bit).

Colour is another element of typography that could be a perfect choice or end up horribly wrong.

Contrast is always welcome, but inverse contrast (such as white text on a black background) can make reading a tedious experience.

The key, again, is to use complementary colours for different parts of text.

Smaller text should have a contrast ratio of at least 5:1 against the background, while for larger text the recommended minimum is 3:1.

Lastly, since typography is a universal art, cross-platform layouts have to be kept in mind.

The average user accesses content on a desktop as well on a tablet or mobile phone.

These have different screen sizes, and maintaining equal readability requires that the text be rearranged to suit each of these platforms.

As a result, most web content is designed in two layouts: full-size for a desktop and reader-friendly shorter lines for mobile phones and tablet computers with smaller screen space.

The same applies for print media design: a smaller canvas often needs text to be resized to be readable in the way it would on a larger sized printout.

Rearranging often follows to maintain the design aesthetic.

A lot of websites, like Google or eBay treat text as the primary user interface.

They serve as good examples of what to and no to do with text.

If you’re running out of inspiration for creative text arrangements, you can take a trip to London and explore the graffiti on Lake Street.