Appearance
Type Basics
Understanding the core components of typography is necessary for making informed design decisions:
Typeface vs. Font
A typeface is the overall set of characters (e.g. Helvetica), while a font refers to a specific variation in weight, size, or style within that typeface (e.g. Helvetica Bold).
Classifications
- Serif: Distinguished by small lines (serifs) at the ends of strokes; these convey a professional, classic, and formal feeling.
- Sans Serif: Typefaces "without" serifs; they are considered modern, trendy, and clean, making them highly readable on digital screens.
- Script: Based on calligraphy or handwriting; these should be limited to large titles and never used for body copy due to readability issues.
- Decorative: Novelty styles with embellishments; these are best suited for specific themes or events and should be used sparingly.
Styles and Weights
- Italics and Oblique: Italics have script-like design qualities, while oblique fonts are simply slanted versions of the regular typeface.
- Numerical Weights: On the web, weights range from 100 (Thin) to 900 (Black), with 400 typically representing Regular and 700 representing Bold.
Semantic Considerations
Developers should use appropriate HTML tags like <em>, <b> or <strong> to convey meaning, rather than relying solely on CSS for purely aesthetic emphasis.
Resources
- For decorative typefaces, check out the Novelty section on Font Squirrel or 1001 Fonts
- If you want to draw attention to a certain word or words, use the
<b>tag. But if you want to indicate that a certain word or words have more importance than the rest of the text, use<strong>