Maintenance Notification: WSB Wiki will be offline April 23rd between 8:00am - 10:00am for planned maintenance

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 8 Next »

All Caps

Avoid using all‑caps as it reduces readability and slows scanning. It works best when applied sparingly and paired with sufficient spacing and contrast.

  • All caps are harder to read because uniform letter shapes reduce word recognition.

  • Avoid using all caps for long headings, paragraphs, or instructions—reserve it for brief labels, buttons, or acronyms.

  • All caps can feel like shouting in some contexts, so use it intentionally and with tone in mind.
  • Ensure strong color contrast and adequate size, since all‑caps text can appear visually denser and heavier.

  • Recommended to increase letter‑spacing (tracking) slightly to improve legibility when all caps are necessary.

Headings

Headings should create a clear visual hierarchy that helps users scan, understand structure, and navigate content quickly. Effective headings balance clarity, consistency, and accessibility so users can grasp meaning at a glance.

  • Use a logical hierarchy (H1 → H2 → H3…) that reflects the content structure, not visual styling alone.

  • Differentiate heading levels with size, weight, and spacing, not color alone or decorative styles.

  • Avoid styling that reduces readability—such as all caps, excessive italics, or low‑contrast colors.

  • Maintain consistent spacing above and below headings to support scannability and rhythm.

  • Apply consistent heading styles across the entire site so users can rely on predictable patterns and quickly understand hierarchy.

Italics

Use italics sparingly and for emphasis, not as a primary typographic style.

  • Use italics only for emphasis, not as the default style for headings or large text blocks.

  • Avoid italicizing entire heading levels, since it reduces scannability and weakens visual hierarchy.

  • Keep italics short and infrequent, as long passages in italics are harder to read.

  • Ensure italics are not the sole indicator of meaning, especially for accessibility.

  • Occasional, purposeful use of italics in headings is fine (such as for Trusted to Lead or other campaigns).

Line height

Line heights should create enough breathing room for the eye to track lines without losing place. Accessibility guidance favors slightly generous line spacing, especially for body text.

  • Recommendations

    • 1.1–1.3 line height for headings

    • 1.4-1.6 line height for body text

  • Tighter line heights reduce readability, especially on small screens or dense layouts.

  • Extra spacing improves comprehension for users with dyslexia or low vision.

  • Maintain consistent line height across similar text types to support predictable scanning.

Serif vs. San-serif

Sans‑serif fonts are preferred for digital interfaces because they remain clearer at small sizes and on varied screens. Serifs can still work well when used intentionally and with strong contrast and sizing.

  • Avoid serif body text at small sizes, where details blur and slow reading.
  • Serifs can be effective for large headings or brand‑driven typography.
  • No labels