INCLUSIVE COMPONENTS

Because we often build and deploy under tough deadlines, we tend to break accessibility without even noticing it. Our products become slower, clunkier and more painful to use — often simply unbearable for keyboard- and screen reader users, and as such fragile and vulnerable for legal disputes. Let’s fix it.

We’ve teamed up with Heydon Pickering, a seasoned front-end developer with a focus on accessibility, to examine common web UI patterns through the lens of inclusion. The result is a dozen of accessible and robust solutions for the patterns we author, plug in, and use every day.

At its heart, “Inclusive Components” is a detailed, practical handbook for building fully accessible interfaces. The book examines common interface patterns — accordions, tables, tabs, toggles and everything in-between — through the lens of inclusion. The result is a dozen of fully accessible and robust patterns we author, plug in, and use daily.

The book features 12 common UI components, broken down in detail, one by one. The in-depth explorations are meticulously illustrated and code examples culminate as bulletproof code snippets, applicable to your work right away. Plus a strategy for building accessible interfaces for your own components — all in one book.

You’ll learn how to build:

• accessible buttons and toggle buttons,
• navigation menus and dropdowns,
• keyboard-friendly tooltips,
• “dark mode” themes,
• accessible content sliders,
• inclusive notifications,
• semantic sortable data tables,
• accessible dialogs and modals.

“Inclusive Components is chock-full of practical and comprehensive advice on building accessible UI. It’s my go-to resource after the official WCAG and ARIA documentation. I’ve found it extremely helpful when building our design system!”

~ Sarah Federman, Senior front-end developer