WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Links and Spacebar

for

Number of posts in this thread: 11 (In chronological order)

From: Marshall Sunnes
Date: Mon, Feb 03 2020 9:32AM
Subject: Links and Spacebar
No previous message | Next message →

*Question*: Is it problematic to allow activation of links with the
Spacebar, in addition to Enter?

*More information*: The basic issue I find is that if a user sees something
that looks like a button, then it should work with the spacebar for
keyboard-only users.
If an app were to correctly identify elements as link or button based on
the description listed in the ARIA Authoring Practices 1.1
<https://www.w3.org/TR/wai-aria-practices-1.1/#link>, but visually styled
links to look like buttons, then would it be an easy compromise to request
they simply make all links able to activated with spacebar? Does that
interfere with any known AT or user experience? Or is that misguided, and
the dev teams need to handle links that look like buttons on a case-by-case
basis?

Best,
Marshall

--
*Marshall Sunnes*
*Senior Digital Accessibility Specialist*
NYU IT <https://www.nyu.edu/life/information-technology.html>
New York University
Phone: (212) 998 4417 <+12129984417>
Email: = EMAIL ADDRESS REMOVED =

From: Steve Green
Date: Mon, Feb 03 2020 9:50AM
Subject: Re: Links and Spacebar
← Previous message | Next message →

On all Windows browsers (and maybe Mac, but I have not checked), the spacebar scrolls the page down unless the focus is on certain elements such as checkboxes and buttons. That said, I have never seen anyone do this in 15 years of user testing.

If all links responded to the spacebar I don't think anyone would notice. Nevertheless, I am not keen on making exceptions like this, so I would advocate against it. It should be easy to only have the spacebar work with links that are styled as buttons.

Steve Green
Managing Director
Test Partners Ltd


From: Birkir R. Gunnarsson
Date: Mon, Feb 03 2020 10:59AM
Subject: Re: Links and Spacebar
← Previous message | Next message →

Agree with Steve
If you repurpose a link as a button you need Javascript that checks if
the spacebar is pressed and executes the onclick event on the link if
it is pressed.
You can tie the Javascript selectors to all elements with
role="button" (something you have to add to links anyway when you
repurpose them as buttons).
Note: A screen reader user doesn't care, because most screen readers
are configured to execute the onclick event if either the enter or
spacebar are pressed when in browse mode (this can be changed in
screen reader settings and this does not apply in application/forms
mode).
I'm not implying you are only asking with the screen reader usre
experience in mind (accessibility is about a lot more than screen
reader users, as we all know and agree) but this behavior is specific
to screen readers and people testing webpages for keyboarde
accessibility often fall into the trap of having screen readers
running when they do it.
gives a confusing

On 2/3/20, Steve Green < = EMAIL ADDRESS REMOVED = > wrote:
> On all Windows browsers (and maybe Mac, but I have not checked), the
> spacebar scrolls the page down unless the focus is on certain elements such
> as checkboxes and buttons. That said, I have never seen anyone do this in 15
> years of user testing.
>
> If all links responded to the spacebar I don't think anyone would notice.
> Nevertheless, I am not keen on making exceptions like this, so I would
> advocate against it. It should be easy to only have the spacebar work with
> links that are styled as buttons.
>
> Steve Green
> Managing Director
> Test Partners Ltd
>
>
>

From: Marshall Sunnes
Date: Mon, Feb 03 2020 12:16PM
Subject: Re: Links and Spacebar
← Previous message | Next message →

Thanks for the input! Case-by-case will have to be the recommendation.

Best,
Marshall

On Mon, Feb 3, 2020 at 12:59 PM Birkir R. Gunnarsson <
= EMAIL ADDRESS REMOVED = > wrote:

> Agree with Steve
> If you repurpose a link as a button you need Javascript that checks if
> the spacebar is pressed and executes the onclick event on the link if
> it is pressed.
> You can tie the Javascript selectors to all elements with
> role="button" (something you have to add to links anyway when you
> repurpose them as buttons).
> Note: A screen reader user doesn't care, because most screen readers
> are configured to execute the onclick event if either the enter or
> spacebar are pressed when in browse mode (this can be changed in
> screen reader settings and this does not apply in application/forms
> mode).
> I'm not implying you are only asking with the screen reader usre
> experience in mind (accessibility is about a lot more than screen
> reader users, as we all know and agree) but this behavior is specific
> to screen readers and people testing webpages for keyboarde
> accessibility often fall into the trap of having screen readers
> running when they do it.
> gives a confusing
>
> On 2/3/20, Steve Green < = EMAIL ADDRESS REMOVED = > wrote:
> > On all Windows browsers (and maybe Mac, but I have not checked), the
> > spacebar scrolls the page down unless the focus is on certain elements
> such
> > as checkboxes and buttons. That said, I have never seen anyone do this
> in 15
> > years of user testing.
> >
> > If all links responded to the spacebar I don't think anyone would notice.
> > Nevertheless, I am not keen on making exceptions like this, so I would
> > advocate against it. It should be easy to only have the spacebar work
> with
> > links that are styled as buttons.
> >
> > Steve Green
> > Managing Director
> > Test Partners Ltd
> >
> >
> >

From: Murphy, Sean
Date: Mon, Feb 03 2020 5:39PM
Subject: Re: Links and Spacebar
← Previous message | Next message →

Jaws documentation states the enter key activates links. I have to check to see what it states for buttons. But the normal behaviour is spacebar activates buttons and check boxes.

From: Marshall Sunnes
Date: Tue, Feb 04 2020 9:12AM
Subject: Re: Links and Spacebar
← Previous message | Next message →

Thanks, Sean. Completely agree with you. My concern was around those who do
not use screen readers (i.e. keyboard only). The ARIA Authoring Practices
recommend that Enter and Spacebar be able to trigger a button.

Best,
Marshall

On Mon, Feb 3, 2020 at 7:40 PM Murphy, Sean <
= EMAIL ADDRESS REMOVED = > wrote:

> Jaws documentation states the enter key activates links. I have to check
> to see what it states for buttons. But the normal behaviour is spacebar
> activates buttons and check boxes.
>

From: glen walker
Date: Tue, Feb 04 2020 12:31PM
Subject: Re: Links and Spacebar
← Previous message | Next message →

I'm confused. You originally asked about enter/space for LINKS but your
response below talks about BUTTONS. Yes, the authoring practice says both
enter and space should activate a button. No one is disputing that.

The big discussion was whether space should activate a link and why that's
not recommended. The authoring practice says that only enter should
activate a link (https://www.w3.org/TR/wai-aria-practices/#link).

On Tue, Feb 4, 2020 at 11:13 AM Marshall Sunnes < = EMAIL ADDRESS REMOVED = >
wrote:

> Thanks, Sean. Completely agree with you. My concern was around those who do
> not use screen readers (i.e. keyboard only). The ARIA Authoring Practices
> recommend that Enter and Spacebar be able to trigger a button.
>
> Best,
> Marshall
>
>

From: Marshall Sunnes
Date: Tue, Feb 04 2020 2:23PM
Subject: Re: Links and Spacebar
← Previous message | Next message →

Hi Glen,
Thanks for outlining the confusion point.
Quoting from my first message: "The basic issue I find is that if a user
sees something that looks like a button, then it should work with the
spacebar for keyboard-only users."

When a developer uses CSS to make links look like buttons, then the
question is around if the developer needs to make that link behave more
like a button. Otherwise, the user sees something that looks like a
button and just will learn through trial and error if Spacebar will
actually work.

Best,
Marshall

On Tue, Feb 4, 2020 at 2:31 PM glen walker < = EMAIL ADDRESS REMOVED = > wrote:

> I'm confused. You originally asked about enter/space for LINKS but your
> response below talks about BUTTONS. Yes, the authoring practice says both
> enter and space should activate a button. No one is disputing that.
>
> The big discussion was whether space should activate a link and why that's
> not recommended. The authoring practice says that only enter should
> activate a link (
> https://urldefense.proofpoint.com/v2/url?u=https-3A__www.w3.org_TR_wai-2Daria-2Dpractices_-23link&d=DwICAg&c=slrrB7dE8n7gBJbeO0g-IQ&r=cXj9zeYcj_L9F2wRWNJV-Q&m=4lCjSeb8_X8qMQZkkF-Q9kag-UApaADEHT2_J3D8TPk&s=AUAlsCM00qCNSNoHawlpxaKrjZ59OdeHlzzs6vzO28U&e=
> ).
>
> On Tue, Feb 4, 2020 at 11:13 AM Marshall Sunnes < = EMAIL ADDRESS REMOVED = >
> wrote:
>
> > Thanks, Sean. Completely agree with you. My concern was around those who
> do
> > not use screen readers (i.e. keyboard only). The ARIA Authoring Practices
> > recommend that Enter and Spacebar be able to trigger a button.
> >
> > Best,
> > Marshall
> >
> >
> > > https://urldefense.proofpoint.com/v2/url?u=http-3A__list.webaim.org_&d=DwICAg&c=slrrB7dE8n7gBJbeO0g-IQ&r=cXj9zeYcj_L9F2wRWNJV-Q&m=4lCjSeb8_X8qMQZkkF-Q9kag-UApaADEHT2_J3D8TPk&s=t-dJxSrpVL7GJ1lP4_Pfk1c3-NbPYyjLoSCFg61mqNY&e=
> List archives at
> https://urldefense.proofpoint.com/v2/url?u=http-3A__webaim.org_discussion_archives&d=DwICAg&c=slrrB7dE8n7gBJbeO0g-IQ&r=cXj9zeYcj_L9F2wRWNJV-Q&m=4lCjSeb8_X8qMQZkkF-Q9kag-UApaADEHT2_J3D8TPk&s=IR90t5qsEioKWyLZNcqpex0uY42hIX2yJk3DXcIfki0&e=
> >


--
*Marshall Sunnes*
*Senior Digital Accessibility Specialist*
NYU IT <https://www.nyu.edu/life/information-technology.html>
New York University
Phone: (212) 998 4417 <+12129984417>
Email: = EMAIL ADDRESS REMOVED =

From: Mallory
Date: Tue, Feb 04 2020 3:17PM
Subject: Re: Links and Spacebar
← Previous message | Next message →

...You could further that logic with
- user sees buttons
- may expect them to work like buttons (spacebar for example)
- ...may expect actions to be performed on the page rather than being taken to a new destination?

cheers,
_mallory

From: Murphy, Sean
Date: Tue, Feb 04 2020 4:16PM
Subject: Re: Links and Spacebar
← Previous message | Next message →

Marshall

I might be restating what others have already said.

If you have a link which is styled like a button. Then the developer must ensure the same behaviour for the sudo button supports the keyboard commands and role.

I would be strongly recommending they use the correct tag which removes all these headaches. Custom elements is the developer / UX / designer responsibility.

Sean

From: Patrick H. Lauke
Date: Wed, Feb 05 2020 2:02AM
Subject: Re: Links and Spacebar
← Previous message | No next message

On 04/02/2020 23:16, Murphy, Sean wrote:
> Marshall
>
> I might be restating what others have already said.
>
> If you have a link which is styled like a button. Then the developer must ensure the same behaviour for the sudo button supports the keyboard commands and role.
>
> I would be strongly recommending they use the correct tag which removes all these headaches. Custom elements is the developer / UX / designer responsibility.

This is the perennial discussion...the tension between "it's styled as a
button but actually acts as a link". Call to action links, important
links, etc are often visually styled as buttons, but it does not mean
they should be coded as <button> elements. What counts is their behavior
... it's just as incorrect/inappropriate to use <button> which simply
loads a new URL (as then, users can't do other things like open the link
in a new tab/window etc).

So I would concentrate mostly on what the thing does, not necessarily
how it is visually styled. But of course, this can then bring
tension/confusion for non-AT keyboard users. So long story short, in
those cases, I think adding extra JS to react to space (and activate the
link) would not be a major problem if you feel your users would try and
activate the control with space as well.

P
--
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