DEV Community

Cover image for Inclusive Components by Heydon Pickering: a chapter by chapter review
Georgia for Digital Theatre+

Posted on

4

Inclusive Components by Heydon Pickering: a chapter by chapter review

This post is the first in a series of posts in which I discuss and reflect upon what I've learnt from reading Inclusive Components. The book, written by Heydon Pickering, explores how web developers can create accessible components with semantic HTML, and how we can avoid using JavaScript unnecessarily by leveraging CSS to add both functionality and styling to our web pages.

Each chapter focusses on a different component. Amongst others, Pickering talks us through toggles buttons and menu buttons, collapsible section and check boxes - components we interact with on the web as users everyday. But as Pickering points out in his introduction, such components are often badly designed and executed, and therefore the web interfaces they form part of become all the more difficult to use.

Accessibility isn't going anywhere, and we're already (rightfully) at a point where accessible websites a necessity rather than a nice to have. It's very much a case of when, not if, features need to be reworked and updated to meet the increasingly rigorous guidelines around accessible design.

Through this series of posts, I hope to create a conversation between Pickering's views on creating inclusive components and my own experiences of developing accessible (and sometimes less than accessible) interfaces. I'll begin, unsurprisingly, with chapter one - toggle buttons.

Image of Datadog

The Future of AI, LLMs, and Observability on Google Cloud

Datadog sat down with Google’s Director of AI to discuss the current and future states of AI, ML, and LLMs on Google Cloud. Discover 7 key insights for technical leaders, covering everything from upskilling teams to observability best practices

Learn More

Top comments (1)

Collapse
 
grahamthedev profile image
GrahamTheDev

Followed, looking forward to seeing this series unfold.

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay