DEV Community

Discussion on: Show me some bad web accessibility on major sites.

Collapse
liamhammett profile image
Liam Hammett

Custom buttons can recieve keyboard focus if they are built properly and implement the tabindex property on the HTML node and such.

I agree with your points, just figure that is a point worth clearing up - these things are often missed in custom elements, but can always be achieved.

Collapse
travisheller profile image
Travis Heller

You're right. The custom button element also needs a keydown event handler to respond to the user pressing the enter key while it has focus, and run the same code as the click event handler (or call click() on the element).

Keyboard accessibility can definitely be implemented on custom buttons, but considering how often it's not done properly (or at all), I figured it's probably easier for developers to just not do it. Thanks for mentioning this!

Thread Thread
bekahble profile image
Bekah Rice Author

Another note, if the role attribute on a custom button isn't set to button it never appears in the accessibility tree. In general it's just a bad practice. I've never understood why someone would use a non-clickable element and try and force it to work as one anyway. Seems like way more work.