Type Is Design:Fix Your UI with Better Typography and CSS

on YouTube ↗01h 18m

" summary

Claims that typography drives roughly 90% of what users see visually on the web and that small typographic tweaks change comprehension guide the concrete advice: use CSS features like font-variant / font-feature-settings and clamp() to set min/ideal/max sizes, prefer rems and ch for measure, adopt baseline grids and modular scales, and try OpenType and variable fonts to replace many files with one. Examples include Sass-based type systems, JavaScript polyfills (flowtype, fitText, kerning.js), skeleton screens, and a published legal-site build that demonstrates improved readability and stable layouts.

AI-written summary · about

" chapters (51)

1. 0:00Start
2. 0:07Type Is Design
3. 2:05Ariel
4. 3:52Combining Fonts
5. 6:30China Invents Wood Cutting
6. 8:16Examples with Metal Type
7. 12:59Basic Rules of Type and about Typography
8. 13:29Typeface
9. 16:14Monospace
10. 17:53Fake and Real Italics
11. 19:22Tracking versus Kerning
12. 20:29Kerning Js
13. 21:58Font Stretch
14. 22:44Font Scale
15. 23:36Golden Ratio Scale
16. 24:14Modular Scale
17. 26:16Choosing and Pairing Fonts
18. 26:35Why We Choose a Font
19. 27:06Legibility
20. 27:26Readability
21. 29:30Fonts
22. 34:25Open Type for the Web
23. 35:38Lining
24. 37:07Text Transform
25. 37:48Font Feature Settings
26. 38:17Typographically Contextual Alternatives
27. 39:11Ligatures
28. 41:29Grids
29. 43:14Content Markup
30. 47:42Flash of Unstyled Text
31. 50:28Force Justifying
32. 53:27Contrast
33. 54:20White Space in Blank Space
34. 54:39White Space
35. 55:12Form Fields
36. 56:25Paragraph Styles
37. 56:38Character Styles
38. 58:52Character Style
39. 1:01:15Typographic Bass Lines
40. 1:04:04Typographic Baselines
41. 1:05:54Typography Js
42. 1:06:43Javascript Hacks
43. 1:07:16Lettering Js
44. 1:07:40Kerning
45. 1:08:46Font Feature Values
46. 1:09:00Name Your Styles
47. 1:09:15Color Fonts
48. 1:10:26Web Support
49. 1:11:43White Ink Trap
50. 1:13:27Variable Fonts
51. 1:17:14Typography for Lawyers

" related talks

• 50mType-setting in CSS: Using typography to enhance your designMartine Dowden · NDC Oslo 2020
• 53mTypography on the web is like other typography only more interestingIndra Kupferschmid · beyond tellerrand // DÜSSELDORF 2016
• 25mTypography is the foundation of any design systemElliot Jay Stocks · Config 2025
• 47mYou Can Save Web TypographyOliver Schöndorfer · iJS 2018 Spring
• 01h 03mFonts, Form and Function: A Primer on Digital TypographyRobby Ingebretsen · NDC London 2017
• 42mAdvanced Web TypographyIdan Gazit · Write the Docs Prague 2014
• 47mYou can save Web TypographyOliver Schöndorfer · International JavaScript Conference Munich 2017
• 01h 02mDesign for DevelopersLex Lofthouse · NDC London 2025