Overview
Variable fonts are a transformative evolution of type design that has huge performance and design implications for the web. When coupled with CSS custom properties and calculations, they make for a completely new way to think about typography and UX. This talk will show how these technologies and techniques can be combined in a unique way to enable dynamic, fluidly scaling typography that reacts to screen size and other aspects of user context (light/dark modes for example). It’s a perfect complement for better design systems and accessibility, too.
Objective
To get designers and developers communicating better about typography, variable fonts, and how to design and build better digital experiences.
Target Audience
Developers looking to learn new CSS techniques & designers who want to leverage new capabilities in typography and UX
Assumed Audience Knowledge
Familiarity with HTML & CSS
Level
Intermediate
Five Things Audience Members Will Learn
- What are variable fonts and how to use them
- New developments in web font loading and performance
- How to add support for new capabilities like light/dark mode
- How to use CSS Custom Properties and Calc() to create better scaling typography
- Ways to improve accessibility and UX through better typography and user controls