Your website is made up of 70% type... Understand Typography to influence visitors and get your message across clearly.
Families, Faces & Fonts:
A type family is a group of typefaces with similar design characteristics.
A font is a typeface in a particular size.
Some type families have a variety of faces to accommodate a wide range of uses. Example shows faces from the Helvetica Neue family.
Serif & Sans Serif:
Broadly speaking there are two groups of typefaces - serif and sans-serif ('sans' is French for 'without')
What differentiates the two groups, is the serif - a small counterstroke at the end of the main stroke (or stem) of each character
To break it down very simply, Serif fonts are easily readable at small body copy sizes, and Sans Serif fonts really stand out in large titles.
Anatomy Of Type:
- The stroke of a letter which rises above the mean-line, such as 'k', 'd', 'h'.
Baseline - The imaginary line on which all characters rest; descenders hang below the base-line.
Body-size - Size of the type being used; measured from the top of the ascender to the bottom of the descender.
- The stroke of a letter which hangs below the base line such as 'p', 'y', 'g'.
x-height - The distance between base-line and mean-line. The height of lower case letters such as 'x', 'a', 'e'.
- The imaginary line which determines the height of lower case letters.
Points & Picas:
In the year 1898 the English type founders, as a body, adopted a system of casting their type to a fixed standard. - the American pica.
A pica is divided into 12 equal parts called points. Six picas are approximately equal to 25mm which makes the size of a point roughly 0.35mm.
The type size is expressed in points. Originally this referred to the depth of metal body on which the letter appeared. Two type faces in the same point size can appear to differ in size.
If you head over to Moments With Type
Aaron shows good use of type and font sizes when building a website.Tracking & Kerning:
The adjustment of space between the characters in a line of text. It is often used for capital letters to improve readability or aesthetics, or to fill a certain area.
The process of reducing the spacing between certain pairs of letters to improve their appearance. When a font is created, each character is given a width that includes some space around it so that the letters don’t run into each other when displayed or printed.
This can thought of as an invisible box around each character. Some pairs of characters such as A and V look better the boxes overlap slightly, bringing the characters closer together (but still not touching).Leading:
The amount of space between lines of text. This originated from the days when strips of lead were placed between lines of type to increase the space. It is always expressed in points or fractions of a point.
These is no set rule to follow. Too much leading can be as bad as not enough. Generally, typefaces with long ascenders and descenders require more leading. The wider the measure of text, the more leading is required for good readability. Leading is measured from base line to baseline.