Accessibility-flavored React components make your design system delicious!

Design systems are a popular way for teams to flavor their design and development workflow. However, an often-missing ingredient in many design systems is a focus on accessibility best practices — especially when component libraries are involved.

In this talk, we'll take a look at how you can mix some commonly-used components with the ingredients of accessibility. Pair this with best practices guidance in your documentation, and you'll have the recipe for a delectably inclusive design system.

Vorkenntnisse

In this session you’ll learn how to combine semantic HTML with accessibility “seasonings" into some common React components including icons, buttons, and inputs.

You’ll also learn how to spice up your design system’s documentation with approachable, accessibility best-practices guidance including interactive examples, and component dos and don'ts.

Even if you’ve never seen React before, join me to learn how to make your design system delicious.

Lernziele

Presentation flow:
* Why accessible components?
* Design systems are a cookbook
* Design systems and React
* Icons
* Buttons
* Inputs
* Documentation
* Wrap-up