Overview
Scalable systems with modern CSS techniques.
Newer developments in CSS make it easier than ever to create robust, scalable, elegant typographic systems on the web and in apps. But the fun really starts when you add variable fonts. The design, technical, and performance benefits are really exciting—but when you combine them with other CSS capabilities like custom properties, calculations, and grid—it’s a whole new way to think about design and development. Jason will show how they work together by using some variable fonts in layouts that work across screen dimensions, accessibility needs, design requirements, and even network speeds—better than you thought possible.
Objective
To educate about variable fonts and what they can do, and how to combine them with other modern CSS techniques to create a more robust, scalable, performant typographic system for the web and in apps.
Target Audience
Designers and developers who care about performance and user experience
Assumed Audience Knowledge
Solid familiarity with HTML & CSS
Level
Intermediate
Five Things Audience Members Will Learn
- What are variable fonts and why they matter
- How to implement them now, and in the future
- How to use CSS custom properties (a.k.a. ‘variables’) and calculations for typography
- Where to find fonts and resources
- How to help improve the standards and implementations
