Mind Your Manners
summary
Examines modal dialogs (popups) on the web: compares different ways to implement modals and evaluates them from UX, accessibility (use of aria-hidden), performance, and component-architecture perspectives. Gives practical guidance on how to build accessible, performant modals and how implementation choices affect usability and developer patterns.
AI-written summary · about
chapters (11)
- 0:00Introduction
- 1:50What is a modal
- 5:04Building a modal library
- 6:29Modal accessibility
- 12:35Inert attribute experiment
- 15:38Modal usability and scroll
- 19:19Scroll behavior property
- 21:29Modal performance and paint layers
- 23:39HTML5 dialog element
- 27:37Demo of dialog element
- 28:01Q&A
related talks
16mModal Windows for Everyone
27mMaking Interactions Accessible to All Users
22mAccessible JavaScript patterns
39mAccessible JavaScript In Action
31mDiving into the Toplayer: Where Dialogs, Popovers, and Modals Live
16mDissecting the architectural process for creating reusable Angular components
52mMaking Single Page Apps Accessible: It's easier than you think
26mAccessibleJS