Typography
@font-face and Web Fonts: Self-Hosting, WOFF2 and font-display
Use @font-face with one WOFF2 file, a variable font, font-display and a preload. Compare self-hosting with Google Fonts and Adobe Fonts, and…
Topic
Typography
Web fonts, type scales and text styling for readable, characterful pages.
Typography
CSS @font-face Guide: WOFF2, Variable Fonts and Fallbacks
How to use @font-face today: ship WOFF2, use one variable font file, choose font-display deliberately, preload the critical file and build fallbacks…
Typography
A Brief History of Western Typography for Web Designers
A practical tour of Western typography, from blackletter and Venetian roman to Didone, grotesque sans serifs and variable fonts, with notes on…
Typography
Force Text to Wrap in CSS: overflow-wrap, hyphens and text-wrap
Use overflow-wrap: anywhere for flex and grid children, break-word for shrink-to-fit boxes, and polish line breaks with hyphens and text-wrap.
Typography
HTML Symbol Entities: Characters, Arrows and Quotes the Modern Way
Named and numeric character references, UTF-8, CSS content escapes and when to use SVG instead, with accessible examples for quotes, arrows, breadcrumbs…
Typography
Typographic Contrast and Flow in Modern CSS
Seven ways to build typographic contrast and reading flow, rewritten with fluid type, variable fonts, OKLCH color and text-wrap, plus copyable CSS.