“Expando Rows” is a concept where multiple related rows in a <table> are collapsed until you open them. You’d call that “progressive disclosure” in interaction design parlance.
After all these years on CSS-Tricks, I have a little better eye for what the accessibility concerns of a design/interactivity feature are. I’m not entirely sure how I would have approached this problem myself, but there is a good chance that whatever I would have tried wouldn’t have hit the bullseye with accessibility.
That’s why I’m extra happy when someone like Adrian Roselli tackles problems like this, because the accessibility is handled right up front (see the videos in all the major screen readers).
I feel the same way when we get demos from Scott O’Hara, Lindsey Kopacz, and Hedyon Pickering.
See the Pen
Table with Expando Rows by Adrian Roselli (@aardrian)
on CodePen.