Correct, it's not just about the lack of JS, it's also about semantics.

... and that's the beauty of this implementation. Conventional semantic markup is still there, which means screen readers and braille readers can use it just bloody fine going straight to the H2 and SECTION landings.

Which is why aria-tab isn't needed. Notice I'm not even sending the menu to aria aware browsers because they're not needed. The H2 or other such headings as well as the section tags mark it up as if it were normal everyday subsections of the page with landings.

Honestly, the only aria role that seems to serve a legitimate purpose seems to be aria-hidden. The rest of them just seem to me to be code bloat for when you can't use the correct semantic markup. Something some of the roles even flat out admit to. I see one more <form role="form"> I'm gonna puke. In fact, given how pointlessly stupid and mindlessly redundant most of them are, I honestly think that aria-roles need to go away. Even the one I see a reason for is redundant to HTML 5's "hidden' attribute.

Just like tabs, a presentational content, therefor the business of the CSS, not some fairy tale pointless attributes.

Seriously, check it in Jaws or on an Orbit 20. The "tabs" don't even exist and you can navigate between the subsections normally as you would any other section started by headings.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store