The problem with buttons on the web

Frontend First

Sam and Ryan chat about issues with default HTML buttons on the web across different devices and browsers. They talk about the Extensible Web Manifesto, how the React Aria library helps standardize button behavior across platforms, and the difference between state-based and event-based animations.

Topics include:

• 0:00 - Intro
• 2:09 – The problem with default buttons on the web -
• 17:26 – How we got here, and the Extensible Web Manifesto -
• 26:22 – React Aria’s unified Press interface -
• 32:26 – Getting consistent Focus styling -
• 40:30 – Event-based vs. state-based animations -

Links:

• Sam’s video on building an animated button
• React Aria useButton
• Building a Button Part 1: Press Events
• Building a Button Part 2: Hover Interactions
• Building a Button Part 3: Keyboard Focus Behavior
• The Extensible Web Manifesto