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

Speaker

 

Kathleen McMahon
Kathleen McMahon Kathleen is a Principal UI/UX Engineer at CarGurus, and her deep industry experience as both a designer and developer fuels her passion for making apps beautifully accessible. In her spare time, she is the Creative Director for the CXsisters network, and the best lanterne rouge cyclocrosser you’ll ever meet.

betterCode-Newsletter

Sie möchten über die betterCode() und weitere unserer betterCode()-Events auf dem Laufenden gehalten werden?

 

Anmelden