Intro to graphic design styles part 5: Typography
Typography is the art of styling words and fonts by using techniques to adjust stylistic variations in a layout. What’s changed by these stylistic variations is a font’s appeal, or how appealing is it to look at, and it’s legibility, from somewhat illegible (think graffiti) to easily read (think of the font in a book).
Typography has a deep anatomy. Each letter consists of many structures, which include its spacing, weight and layout within the paragraph./image: 1-structure-of-typography-1024x470 /
As you can see above, there are many elements that make up the structure of a letter and how each letter interacts with one another to create words.
The structure of each font is made up of varying elements that require consistency across the each letter. Each font has a set of guidelines, e.g., the baseline and cap height set the overall size of the font. By varying the x-height, ascender height and descender line, you can dramatically change the overall style of the font. So, too, do the structural elements, such as the stem thickness and each intersection, adjust the fonts style./Image: 2-font-weight-typography-1024x133/
The weight of the font adjust the thickness different fonts have. When you use a thin or ultra thin font, you can imply subtlety, luxury and a sort of femininity. Whereas a bold or ultra bold font is often associated with the impactive, loud and the masculine./image: 3-serif-vs-san-serif-typography-1024x315/
A serif is the small line or accent end cap that is added to the top and bottom of each letter. Serifs are not applied to oval letters such as “O and C” and are not applied to the curved portion of letters, such as “R and P”. Serif fonts are typically associated with luxury, and decorative and ornate.
A sans serif font excludes the accent end cap found in serif fonts. Sans Serif fonts are often associated with being light, simple, clean and uncomplicated. Sans serif fonts are particularity popular as a default paragraph web font because it’s easy to read on a computer screen./image: 4-kerning-vs-tracking-typography-1024x305/
Kerning is the modification to the amount space between two individual letters / characters that step across each characters line. When kerning is done right it produces a pleasant, visual balance.
Tracking is similar to kerning, however, instead of adjusting the spacing between individual letters, tracking globally adjusts the spacing across all letters inside a text block. Increasing the tracking substantially affects legibility./image: 5-alignment-typography-1024x289/
1) Centre alignment: all of the text is aligned to the centre of the area. Centre aligned text is great for headlines, quotes or a short amount of information.
2) Right alignment: all of the text is aligned to the right of the area. Right aligned text is the universal standard for paragraph text. This is largely due to the English language reading from right to left.
3) Left alignment: all of the text is aligned to the left of the area. Left aligned text works well to display a short amount of information, such as notations or quick points./Missed a part? Part 1: Intro to graphic design. Part 2: Intro to graphic design: Vintage & retro Part 3: Intro to graphic design: Minimalist Part 4: Intro to graphic design: Art deco Part 5: Intro to graphic design: Typography.