Syntax Highlight Everything
summary
Demonstrates exactly which OpenType features matter for web text and how to enable them with CSS and small tooling: shows live uses of ligatures, contextual alternates, small caps, oldstyle/tabular numbers and when each improves readability, explains browser support (modern browsers, Safari 10+), and warns that using font-feature-settings vs font-variant-ligatures affects cascade behavior. Presents a ready npm-able helper called utility open type, an emoji font for secret messages used in a real campaign, and links to practical resources like stateofwtype.com.
AI-written summary · about
chapters (10)
- 0:00Intro
- 1:32Similarity through Color
- 7:16ligatures
- 10:59discretionary ligatures
- 11:50contextual alternates
- 14:50language specific considerations
- 15:48stylistic alternates
- 16:50case sensitive forms
- 17:31small caps
- 20:11proportional vs tabular
related talks
29mThe State of WebFonts
51mProblems solved by OpenType
26mThe State of Web Typography
30mWhen East meets West: web typography and how it can inspire modern layouts
51mTypography on the Web
45mOnce Upon a Drop Cap: A Look at Typography as UX
53mTypography on the web is like other typography only more interesting
01h 18mType Is Design:Fix Your UI with Better Typography and CSS