WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Link vs Button for "Cancel"

for

From: Mohith BP
Date: Jan 11, 2018 11:28PM

I prefer providing role button for the link. addition to the points
mentioned from the training and usability point is:
1. When a user uses brows mode navigation as the submit is a button
tries to find Cancel in the similar way with the 'B' key.
2. In general Submit, Login, Cancel are found as buttons hence users
may expect the same.
3. AS mentioned by others in the previous posts is the visual
appearance and interacting with sighted folks.

Thanks & Regards,
Mohith B. P.

On 1/12/18, Robert Fentress < <EMAIL REMOVED> > wrote:
> I don't know what the right approach is, but if the argument is that it
> should be coded as a link just because it takes you to a page, I don't
> think it is that simple. The submit button may *also* take you to a
> different page. Perhaps it would be better to think of it in these terms:
> If it performs an action related to the form (such as cancelling the
> process), then it should be treated as a button. Again, I see both sides,
> but this might be another way to frame it.
>
> On Jan 10, 2018 4:39 AM, "Mallory" < <EMAIL REMOVED> > wrote:
>
>> 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
>> > >
>> > > -----Original Message-----
>> > > From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On
>> > > Behalf Of Renato Iwashima
>> > > Sent: Monday, January 08, 2018 4:11 PM
>> > > To: WebAIM Discussion List < <EMAIL REMOVED> >
>> > > Subject: Re: [WebAIM] Link vs Button for "Cancel"
>> > >
>> > > I thought about adding role="button" since it does visually look like
>> > > a
>> > > button, but then someone mentioned to me that a button activates with
>> space
>> > > bar while a link does not. If I add a role="button", would I have to
>> > > implement some javascript to handle space bar?
>> > >
>> > >
>> > > On Jan 8, 2018 12:46 PM, "JP Jamous" < <EMAIL REMOVED> > wrote:
>> > >
>> > > In addition, I have found it to be an excellent UX design practice to
>> use
>> > > role="button" if the link is styled as a button visually. I cannot
>> count
>> > > the many times I would be interacting with a sighted user and state,
>> "Click
>> > > on the whatever link." The user would always say, "I don't see a link,
>> > > rather a button." In some situations, it can be quite confusing.
>> > >
>> > > I know this does not fall under WCAG, but I find it a best user
>> experience
>> > > for users across the board.
>> > >
>> > > -----Original Message-----
>> > > From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On
>> > > Behalf Of Steve Faulkner
>> > > Sent: Monday, January 8, 2018 2:34 PM
>> > > To: WebAIM Discussion List < <EMAIL REMOVED> >
>> > > Subject: Re: [WebAIM] Link vs Button for "Cancel"
>> > >
>> > > >
>> > > > The "cancel" takes the user to another page thus behaves like a
>> > > > link.
>> > >
>> > >
>> > > does it have a href with a URL? if so sounds like a link to me
>> > >
>> > > --
>> > >
>> > > Regards
>> > >
>> > > SteveF
>> > > Current Standards Work @W3C
>> > > <http://www.paciellogroup.com/blog/2015/03/current-
>> standards-work-at-w3c/>
>> > >
>> > > On 8 January 2018 at 20:28, Renato Iwashima < <EMAIL REMOVED> >
>> wrote:
>> > >
>> > > > Hi,
>> > > >
>> > > > I have a form that contains a submit button and a cancel link. The
>> > > "cancel"
>> > > > takes the user to another page thus behaves like a link.
>> > > >
>> > > > But because it is a destructive action and is related to the form, I
>> > > > wonder if it should actually be a button. If thats the case, does it
>> > > > mean I need to implement JS to actually route the user to navigate
>> > > > to
>> > > > a
>> > > different page?
>> > > > Can I just leave it as a link?
>> > > >
>> > > > Thanks!
>> > > >> > >
>> > > The information contained in this e-mail is confidential and/or
>> > > proprietary to Capital One and/or its affiliates and may only be used
>> > > solely in performance of work or services for Capital One. The
>> information
>> > > transmitted herewith is intended only for use by the individual or
>> entity
>> > > to which it is addressed. If the reader of this message is not the
>> intended
>> > > recipient, you are hereby notified that any review, retransmission,
>> > > dissemination, distribution, copying or other use of, or taking of any
>> > > action in reliance upon this information is strictly prohibited. If
>> > > you
>> > > have received this communication in error, please contact the sender
>> and
>> > > delete the material from your computer.
>> > > >> > > >> > > >> > > >> > >
>> > >> > >> > >> > >> >> >> >> >>
> > > > >