WebAIM - Web Accessibility In Mind

E-mail List Archives


From: Patrick H. Lauke
Date: Apr 27, 2021 4:40PM

<a> without an href is not keyboard-focusable by default, so unless you
add tabindex="0", that's obviously out of the running.

<button> is the more logical choice for a trigger that causes an in-page
action, but one can also see the argument that a link can take you to a
different place even within the current page, and a dialog is kind of
that - although when it's modal, it creates its own little universe, so
arguably not part of the current page but more like navigating to a new
page altogether...but that's still within the remit of what a link does.

In the grand scheme of things, it might not matter. We've traditionally
flagged "links that should really be buttons/exposed as role="button"
and have appropriate JS behaviour to also respond to Space" as a mild
4.1.2 failure for having an inappropriate role. But it's really on the
edge here.

I would note that links (with href) by default have additional
browser-native behaviours that you may not want/like for a modal
trigger - such as opening a new window/tab when middle-clicked ... which
works well when they're actually links, but not in general if there's
just JS behaviour associated with it (and no fallback that also opens
the dialog on page load if the relevant fragment identifier is present
in the URL)

Patrick H. Lauke

https://www.splintered.co.uk/ | https://github.com/patrickhlauke
https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
twitter: @patrick_h_lauke | skype: patrick_h_lauke