Tags: Shifter

WCEU Session Highlight: Variable fonts: The future of web design

As we look forward to the next WordCamp Europe, we wanted to highlight some of the sessions, topics, workshops, and events happening at this year’s event.

Here is another session we are particularly excited about!

Within the last decade, typography on the web has gone through a revolution. While we once relied on system fonts, we now have a plethora of typographic choices with beautiful fonts widely available from providers like Google fonts and Typekit. Things have certainly never been better for internet typophiles.  However, until recently, it could be argued that the technology behind this typographic revolution has lagged behind this massive growth. With so many fonts at our disposal, each style still requires loading its own file which can lead to restrictions to the number of styles that should be used or even what styles may be available. Designers and developers have been left with options that are more limited than the web and the constant internal question of how to best optimize typography usage. Within the past few years, a new answer has started to emerge: variable fonts.

Variable fonts operate a little differently from traditional web fonts. Instead of only containing a single style, Variable fonts contain two or more characteristics that may be interpolated between. To illustrate, a font could contain two characteristics. The first characteristic is a light weight style. The second characteristic is a bold weight style. Within that font, a user could switch from the first characteristic (the light weight) and the second characteristic (the bold weight) or any style in between the two characteristics, all in a single file. What that translates to is the ability to access thousands of font styles, all without the need to load in multiple files to your site.

All styles from a single file

Try out variable fonts for yourself at Font Playground.

Cutting down on  file size, is an obvious advantage, but one of the most interesting applications of variable fonts is their use in responsive design and accessibility. With the ability to use fonts that can be altered with inherent variables, it’s possible to create fonts that will react to any users need.

That’s why we’re so interested in the session Variable fonts: The future of web design from Ana Cirujano.

Ana is a Spanish designer with a master’s degree in web design and development. She’s been practicing design for over 10 years and leads the Design team in her local WordPress community as well as being  a co-organiser of the Collado Villalba Meetup.

Ana will be discussing ways in which variable fonts on WordPress are the future. Ana will show us how variable fonts work and explain more fully what their advantages are. We’re especially excited that Ana will be showing us some actual examples of how to effectively use variable fonts.

We’re looking forward to Berlin and we hope to see you there!