Friday Open-House for prospective students and their parents on all Fridays 2:00pm – 4:00pm. Call 09871383633 to book your appointment. Click here to know more.

ABC’s of Typography

6 February 2017, By

‘Typography’ refers to the style and appearance of printed matter. While text is usually laid out to have the best visual effect, typography should also contribute to the context in which the text is being written. The below article attempts to explain a few rules and tricks to understanding the art of typography. It can involve playing with typefaces, point sizes, line lengths, the space between letters and creating type glyphs. It is a specialised occupation of sorts and can be as meaningful as its designer desires.

Take a look at these typefaces below.

{The word High in a vertically elongated font}|ABC's of Typography

Image Source: Pinterest

{The words High and Low}|ABC's of Typography

Image Source: Pinterest

{The word High in brick font}|ABC's of Typography

Image Source: Font generated via fontspace.com

{The word High in a smoky font}|ABC's of Typography

Image Source: Image generated via Picture to People

The above is an instance of how the same word in different typefaces can imply different meanings. ‘High’ in the first image implies height and gives a feeling of elongation. It almost makes you feel small. ‘High’ in the second image resembles a ramp or a slope, implying something is above the ground. In the third image, the same word manages to evoke feelings of something being built, probably due to its texture and look that resembles bricks. ‘High’ in the last image implies intoxication and hints at a lack of control. Because of the specific meanings created, each typeface above would only be suitable for usage in a specific circumstance. Such is the power of typography.

The design of each typeface is relevant to what and how it communicates. In the simplest terms, typography is a visual manifestation of the written word, carrying some information to the reader. It aids in communication also because its appearance itself is endowed with meaning, as illustrated by the examples above. Good typography is one that conveys a verbal and visual meaning through its legibility, readability and appeal. As typography evokes emotions, it is an essential component of communication design.

As a student of communication design, one must be able to control the outcome of his/her visuals to communicate effectively. In order to grasp control of typography, one must heed to the laws of a few basic type elements, which are listed below:

Fonts

While there’s a buffet of fonts available for use on the internet, it is important to consider where the font is being used and what purpose it would serve.

{Serif and Sans Serif}|ABC's of Typography

Image Source: Alex Poole

There is a lot of variety between fonts, but generally they are either serif or sans serif, referring to the finishing strokes on the ends of characters. Serif is generally perceived as a bit more formal, and sans-serif is more clean, minimal and elegant. Both serif and sans serif are generally used for larger chunks of body text as they are easier to read on the web as well as in print. Specifically, serif fonts are extensively used in print publishing as the ‘serif’ or brackets and bars aid in enhancing readability of printed texts. Sans (without) serif fonts are recommended in a digital format as the ‘serif’ in digital display causes fatigue in reading.

{Psychology behind different font types}|ABC's of Typography

Image Source: Creative Market

Size

{Poster for the motion picture, Black Swan}|ABC's of Typography

Image Source: Pinterest

{Poster examples for typography}|ABC's of Typography

Image Source: Pinterest

As illustrated by the above posters, size in typography can be used to communicate a hierarchy – drawing attention to certain headlines, peaking curiosity and inviting readers to move on to the smaller text. Alternatively, size can also be used to communicate volume. A poster with a larger font size, for instance, appears louder than that with a smaller font size. Using a contrast of sizes can also create dynamism, while increasing legibility.

Tracking

Tracking refers to the uniform space between letters, and can also be used creatively to communicate a message better. This is best illustrated with the below image.

{Example for tracking}|ABC's of Typography

Image Source: Brian Coale

{Example for Tracking}|ABC's of Typography

Image Source: 1001 Fonts

{Example for Tracking}|ABC's of Typography

Image Source: 1001 Fonts

By applying tracking, the typeface appears to be neater and more consistent. The second image communicates the idea of ‘breathing’ better than the image above it simply because it is more airy, less restrictive and adds a certain lightness to the typeface.

Kerning

Kerning refers to the spacing between two characters, that is each letter. This is different from tracking, in that, it is done on a case-by-case basis where the space between specific characters is to be changed. It prevents misunderstandings and/or improves the visual appeal of the font, as illustrated below.

{Example for Kerning}|ABC's of Typography

Image Source: Joogput

Leading

Leading is the space between the lines of the text, and it also affects legibility. While a more compact leading lessens readability, it is appropriate in certain circumstances. After all, design is an important component of typography because both form and function of the written word must be considered before creating or using a typeface in a specific circumstance.

{Example for Leading}|ABC's of Typography

Image Source: The University of Arizona Brand

Leading can also be used with other graphic design elements in typography. Understanding the images below, the poster on the right plays with leading to extend the title of the poster across the entire length of it.

Colour

Colour in typography plays an important role as different colours evoke different feelings. Colours may also remind readers of a specific life experience or have cultural significance.

{Example for importance of colour in typography}|ABC's of Typography

Image Source: Pinterest

{Example for importance of colour in typography}|ABC's of Typography

Image Source: Pinterest

The use of colour in the image above creates a playful and fun feeling, capturing positive feelings that the weekend usually brings. The same typeface, tracking, leading and font size would not have the same effect in black and white.

{Pastel colour graphics}|ABC's of Typography

Image Source: Pinterest

The pastel colours in the image above create a soft, gentle mood.

{Poster Design}|ABC's of Typography

Image Source: Pinterest

The play of colours above create a futuristic, dynamic mood. The use of a reverse colour scheme, where the background is black and the text white, also accentuates the same atmosphere.

Creating an experience and meaning

Respecting the six basic elements of font choice, size, tracking, kerning, leading and colour, design communication would be more effective if the typography itself creates an experience for the reader. Take a look at the posters below:-

{Poster design for Canon}|ABC's of Typography

Image Source: Max Boam

{Poster design for BBC}|ABC's of Typography

Image Source: Form Fifty Five

{Poster design for McDonalds}|ABC's of Typography

Image Source: Pinterest

{Poster design for brasas.com}|ABC's of Typography

Image Source: Pinterest

{Typography poster design}|ABC's of Typography

Image Source: Pinterest

By combining all the basic elements of typography and choosing to pay attention to the visual and verbal meanings generated by the typographical design, these posters communicate more than just what they appear to be on the surface. They’re playful and creative, resulting in impactful communication.

Hence, while making decisions related to typography and by following the basic rules, one can ensure certain creative outcomes. Having said that, designers must also be contextually aware and think about the cultural meanings that the visuals may create – this will help them make sound design decisions to evoke the intended response from the end-user.

Leave a Reply