Daily schedule

Full conference schedule →
11:00 am
Michael Taranto

Web fonts, without the jank

Michael Taranto, Design System Engineering Lead SEEK

Fallback fonts. They don't often get much of our attention, after all, they are only a fallback! But their importance is growing with a focus on user experience metrics like Cumulative Layout Shift (CLS) — a metric targeted at improving janky page load experiences.

In this talk, we will explore modern CSS font-face descriptors, such as size-adjust and metric overrides, and leverage fallback fonts for better alignment with web fonts.

To achieve this, we journey through the world of font metric tables and how we can use them to calculate the required CSS, dramatically reducing layout shift on page load — all the design aesthetic of web fonts, without the jank.

11:35 am
Neil Jenkins

Oh, snap! The joy and pain of CSS scroll snapping.

Neil Jenkins, Chief Product Officer Fastmail

With widespread browser support, you can now use CSS to ensure scrolling can only stop at certain positions. This is great for building native-like experiences on mobile and desktop, and we'll look at how easy it is to do this for simple use cases, like a 3-image carousel.

But what if you have 300,000 images instead, and need to combine it with dynamic rendering as you scroll? Or want to allow scrolling in either horizontal or vertical dimension, but not both at once? You'll soon find you're fighting the browser, and the browser fights back hard. We'll discover some clever hacks — and gotchas to avoid — so you too can build the snappiest of UIs.

12:10 pm
Adem Cifcioglu

The Accessible Auto-suggest revisited

Adem Cifcioglu, Co-founder Intopia

At Web Directions Respond in May 2017, I presented “The Anatomy of an Accessible Auto-suggest” which was a step-by-step guide on how to implement an accessible auto-suggest. In December that same year, the W3C made ARIA 1.1 a W3C Recommendation, and changed the requirements for the combobox pattern that formed the foundation of that auto-suggest component. The changes were made with the aim of more accurately representing the semantics of the user interface in the accessibility tree, and while they did solve that problem, unfortunately, they created many other issues.

Fast forward 7 years to 2024, ARIA 1.2 is a W3C Recommendation, and the combobox pattern that runs our auto-suggest has gone back to the future.

In this talk, we’ll look at changes in ARIA using the combobox pattern from ARIA 1.0 through to ARIA 1.2, and recreate our accessible auto-suggest component.