WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Link vs Button for "Cancel"

for

From: Mallory
Date: Jan 10, 2018 2:39AM

We had a similar issue, and also decided we're stuck with a real link looking like a button.

Not only do buttons work with spacebar, but links offer context menus, show URLs at the bottom of the browser on hover/focus, and offer things like shift-enter or ctrl-enter for opening in a different context... so I'm wary of setting button roles on links if there's a URL better than "#".

On Mon, Jan 8, 2018, at 10:35 PM, Renato Iwashima wrote:
> > This does beg the question: Why not just use a <button>? If you decide to
> go the button route for your "Cancel" action, then I suggest an HTML
> <button>.
>
> Primarily because it behaves like a link, it has its own URL and just
> navigate the user away to a different page. If I make it a button, I'd need
> to implement javascript to navigate the user to a different page which
> seems unnecessary.
>
> This is probably an issue with the visual design (it shouldn't look like a
> button). But at this point it isn't a change I can make or push back. So I
> was wondering if just going with a link would be sufficient enough, without
> role="button".
>
> On Mon, Jan 8, 2018 at 1:30 PM, Beranek, Nicholas via WebAIM-Forum <
> <EMAIL REMOVED> > wrote:
>
> > Yes, you will need to add keypress event handlers for Enter key and Space
> > bar to activate the element with role="button". Also, if the element is not
> > natively keyboard-focusable, then you'll need to add tabindex="0".
> >
> > This does beg the question: Why not just use a <button>? If you decide to
> > go the button route for your "Cancel" action, then I suggest an HTML
> > <button>.
> >
> > Nick Beranek
> > Capital One
> >
> >