Web design glossary

A visual glossary of typography and page layouts, with examples from hand-picked websites.

B

BaselineTypography
The baseline is the imaginary line on which most letters sit. Descenders, such as the lower part of p, extend below it.
Body textTypography
Body text is the main continuous copy that explains a subject, tells a story or provides detail beneath headings.

C

Cap heightTypography
Cap height is the height of a typeface’s flat-topped uppercase letters above the baseline.

D

Display headingTypography
A display heading is prominent text designed to make a strong first impression, often in a hero or major section.
Display typefaceTypography
A display typeface is designed primarily for prominent, usually large text such as headlines, posters or short statements.

F

Fallback fontTypography
A fallback font is an alternative used when a preferred font cannot provide a character or is unavailable.
FontTypography
A font is a usable instance of a typeface, traditionally a particular size and style and, on the web, usually a font resource.
Font familyTypography
A font family groups related styles of a typeface, usually including different weights and sometimes italics or widths.
Font pairingTypography
Font pairing is the deliberate use of two or more typefaces together, with a clear role for each.
Font weightTypography
Font weight describes how light or heavy the strokes of a font appear.

I

ItalicTypography
Italic is a slanted type style, often with letterforms redesigned to work at an angle.

K

KerningTypography
Kerning adjusts the spacing between particular pairs of characters to make the visible gaps feel more balanced.

L

LeadingTypography
Leading is the distance between successive text baselines. On the web it is usually discussed as line height.
LetterformTypography
A letterform is the drawn shape of a letter, including its strokes, curves and internal spaces.
Line lengthTypography
Line length is the horizontal measure of a line of text, often described by its width or approximate number of characters.

M

MonospaceTypography
A monospace typeface gives each character the same advance width, so letters and spaces occupy equal horizontal slots.

S

Sans serifTypography
A sans serif typeface has letterforms without the finishing strokes called serifs.
SerifTypography
A serif is a small finishing stroke on a letter. A serif typeface uses these strokes as part of its letterforms.

T

TrackingTypography
Tracking is an adjustment to the spacing across a run of characters, often called letter spacing in web design.
Type scaleTypography
A type scale is a coordinated set of text sizes used for recurring roles across a design.
TypefaceTypography
A typeface is the design of a set of letters, numbers and symbols, such as Inter or Editorial New.
Typographic hierarchyTypography
Typographic hierarchy makes the relative importance of text clear through differences in size, weight, spacing, placement or style.

V

Variable fontTypography
A variable font stores a range of design variations in one font file, controlled through axes such as weight or width.

W

WebfontTypography
A webfont is a font resource that a website makes available for the browser to use when rendering its text.

X

X-heightTypography
X-height is the height of a typeface’s lowercase x, measured from the baseline.