WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Use of hyperlinks instead of buttons

for

From: Lovely, Brian (CONT)
Date: Jun 29, 2016 7:06AM

Looking forward to that Birkir!

Technically, using a link as a button without providing a role attribute of "button" fails the "role can be programmatically determined" part of WCAG criteria 4.1.2. In a situation where you are trying to get designers and developers to think about the semantic meaning of HTML elements, it doesn't hurt to point out that a link styled to look like a button will never be as much of a button as...wait for it...a button. There are more egregious violations of Name, Role, Value, for instance anything but a heading styled and used like a heading, spans and divs tricked out as links and/or buttons with CSS and JavaScript, a group of divs or spans styled and used like a list.

Sometimes you do need to pick your battles. I'd go after links that violate 1.1.1 Non-text content or 2.4.9 Link Purpose before I'd go after faux buttons.


Brian Lovely
Digital Accessibility Team
<EMAIL REMOVED>



-----Original Message-----
From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Birkir R. Gunnarsson
Sent: Wednesday, June 29, 2016 8:04 AM
To: WebAIM Discussion List
Subject: Re: [WebAIM] Use of hyperlinks instead of buttons

I am actually writing a blog on this very issue, as a follow-up from a CSUN presentation/panel I did with my colleague CB Averitt.
It won't deliver a final answer (if it did Iccessibility would be simpler), but it will point out someof the nuances and a few rules of thumb we can follow.
I will make sure to post back to the list when the blog is live.


On 6/29/16, Joshua Hori < <EMAIL REMOVED> > wrote:
> Is it wrapped in a div by itself? That may be a reason to argue that
> it's a button and requires a role. (I'm looking you and your submit "button"
> SurveyGizmo...) You could prove that it doesn't work when you attempt
> to get keyboard focus on it. (works fine on mobile)
>
>
> If it's just a link, a CSS file is most likely matching the image to
> the link, making it look like a button. Arguments will flare as you
> will be able to get keyboard focus and it's labeled with alt tags.
> (The developers will
> ask: Should social media be buttons too?)
>
>
> Another consideration is that JAWS treats buttons and links
> differently. As a button, users can press B to get directly to them.
> As links you can bring up a links list, and press P until you hear
> print. Or just perform a JAWS find for "Print". All ways are
> accessible, although some ways may take a few additional button presses.
>
>
> Just wait until we have to make web VR accessible: https://aframe.io/
>
>
> Best,
>
>
> Joshua Hori
>
> Accessible Technology Analyst
>
> Student Disability Center
>
> 54 Cowell Building
>
> Davis, CA 95616
>
>
> > From: WebAIM-Forum < <EMAIL REMOVED> > on behalf of
> Jonathan Avila < <EMAIL REMOVED> >
> Sent: Tuesday, June 28, 2016 5:25:03 PM
> To: WebAIM Discussion List
> Subject: Re: [WebAIM] Use of hyperlinks instead of buttons
>
>> In the site, they have used hyperlinks were it should have been buttons.
>> For example, there is a print link that lauches the browser's print
>> functionality. Under which criteria does it fail WCAG?
>
> Many people would say that it does not fail WCAG -- some say it does. I
> suppose if it looks like a button you have a case to argue for SC
> 1.3.1 Information and Relationships -- but arguably this issue is
> problematic for all users as you really don't know what's going to
> happen when you click a visual link or button as some designs use them interchangeably.
>
> Jonathan
>
>
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On
> Behalf Of Bruno Girard
> Sent: Tuesday, June 28, 2016 3:28 PM
> To: WebAIM Discussion List
> Subject: [WebAIM] Use of hyperlinks instead of buttons
>
> Hello group,
>
> I am auditing a site right now. I've been looking throught WCAG
> criterias, techniques and failure but I haven't found the answer to my question yet.
>
> In the site, they have used hyperlinks were it should have been buttons.
> For example, there is a print link that lauches the browser's print
> functionality.
>
> Under which criteria does it fail WCAG?
>
> Thanks
> Bruno
> > > archives at http://webaim.org/discussion/archives
> > > > archives at http://webaim.org/discussion/archives
> > > > archives at http://webaim.org/discussion/archives
> >


--
Work hard. Have fun. Make history.
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.