3 ms·

To be fair the OP hides the trigram from screen readers and provides them with the ‘open menu’ label.

• myfonj 4y ago
  No, they did not, they present both "accessible hidden link" and "inaccessible visible label", at least I see no `aria-hidden="true"` in the code [1] on the label right now, I see just: <label for="menustate"> <span class="open">≡</span> <span class="close">×</span> </label> So there still remains "readable" structure loosely identical to <label>identical to multiplication sign</label> (With active CSS, only one half would be presented to SR, since the other has `display: none`, but still…) BTW Fact that wording of the link in the article pointing to the codepen is "this codepen" is also … not right. [1] https://codepen.io/enyo/pen/yLqjrOR https://codepen.io/enyo/pen/yLqjrOR
  • jameshart 4y ago
    You're right - I guess I assumed they'd added that in the full codepen.
  • enyo 4y ago
    Oh you’re right, I forgot to add this in the article + codepen. (It’s how the button on the site itself is implemented and I forgot to integrate it)