E-mail List Archives

Search E-mail List Archives for

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

From: Heidi Jungel
Date: Mon, Jun 04 2012 9:15AM
Subject: Links vs. Buttons
No previous message | Next message →

Good Morning/Afternoon

I could not find anything in our archives related to this. We have a discussion in my organization regarding links.
I find that many sites abuse the use of links and use links for everything- even button type action. I have often used the following quote:

"Links are for navigation (I.e. To another section of a page or another page). Buttons are for actions"

However, I am a getting a bit of a push back on this. What are your thoughts on this? Are sites abusing links? Does using a button hinder the virtual cursor on screen readers (I have not seen this being a problem in JAWS 12)?

We are just trying to get a guideline set for this for our developers.
Heidi Jungel, UI Developer
Apollo Group | Product Strategy & Development
Email: = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = > | Skype: hjungel

Please consider the environment before printing this email.

This message is private and confidential. If you have received it in error, please notify the sender and remove it from your system.

From: Jesse Hausler
Date: Mon, Jun 04 2012 11:38AM
Subject: Re: Links vs. Buttons
← Previous message | Next message →

I would ask for buttons on form submissions, but beyond that I'll take a link over a clickable <div> any day of the week :)


On 6/4/12 8:15 AM, "Heidi Jungel" < = EMAIL ADDRESS REMOVED = > wrote:

Good Morning/Afternoon

I could not find anything in our archives related to this. We have a discussion in my organization regarding links.
I find that many sites abuse the use of links and use links for everything- even button type action. I have often used the following quote:

"Links are for navigation (I.e. To another section of a page or another page). Buttons are for actions"

However, I am a getting a bit of a push back on this. What are your thoughts on this? Are sites abusing links? Does using a button hinder the virtual cursor on screen readers (I have not seen this being a problem in JAWS 12)?

We are just trying to get a guideline set for this for our developers.
Heidi Jungel, UI Developer
Apollo Group | Product Strategy & Development
Email: = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = > | Skype: hjungel

Please consider the environment before printing this email.

This message is private and confidential. If you have received it in error, please notify the sender and remove it from your system.

From: Heidi Jungel
Date: Mon, Jun 04 2012 3:11PM
Subject: Re: Links vs. Buttons
← Previous message | Next message →

Thank you so much for your input. So, what you are saying is that if there
is a "close" option, you would prefer this be a link even though it goes
nowhere?

In other words, you would prefer this:
<a href="#"...>Close</a>
over this:
<button value="Close"Š.>

Does anyone think that having the first would add to confusion? I am a low
vision developer who uses screen readers on occasion (when needed).
However, I have some vision, so perhaps my preference on a button is due
to the vision I have.

Thoughts?

Heidi Jungel, UI Developer
Apollo Group | Product Strategy & Development

Email: = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = > |
Skype: hjungel

Please consider the environment before printing this email.





On 6/4/12 10:38 AM, "Jesse Hausler" < = EMAIL ADDRESS REMOVED = > wrote:

>
>I would ask for buttons on form submissions, but beyond that I'll take a
>link over a clickable <div> any day of the week :)
>
>
>On 6/4/12 8:15 AM, "Heidi Jungel" < = EMAIL ADDRESS REMOVED = > wrote:
>
>Good Morning/Afternoon
>
>I could not find anything in our archives related to this. We have a
>discussion in my organization regarding links.
>I find that many sites abuse the use of links and use links for
>everything- even button type action. I have often used the following
>quote:
>
>"Links are for navigation (I.e. To another section of a page or another
>page). Buttons are for actions"
>
>However, I am a getting a bit of a push back on this. What are your
>thoughts on this? Are sites abusing links? Does using a button hinder
>the virtual cursor on screen readers (I have not seen this being a
>problem in JAWS 12)?
>
>We are just trying to get a guideline set for this for our developers.
>>Heidi Jungel, UI Developer
>Apollo Group | Product Strategy & Development
>Email: = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = > |
>Skype: hjungel
>
>Please consider the environment before printing this email.
>
>>This message is private and confidential. If you have received it in
>error, please notify the sender and remove it from your system.
>
>>>>
>


This message is private and confidential. If you have received it in error, please notify the sender and remove it from your system.

From: Don Mauck
Date: Mon, Jun 04 2012 3:15PM
Subject: Re: Links vs. Buttons
← Previous message | Next message →

I disagree, it always frustrates me when developers think that because they want it to look like a button but still want it to be a link they mix and match. If it is an action item such as a save, close, submit ETC. those ought to be buttons. If you are being taken somewhere even if it's on the same page, then that should be links. The problem is always that when talking to support folks they will always say click on the "save" button, then the user of a screen reading program looks for the button and "dang," it's not a button after all. At the end of the day, if it's a button, make it a button. If it's a link make it a link and call it such.

From: Don Mauck
Date: Mon, Jun 04 2012 3:17PM
Subject: Re: Links vs. Buttons
← Previous message | Next message →

Sorry for any mis-spelled words in the previous post, didn't have my spell checker on.

From: Birkir R. Gunnarsson
Date: Mon, Jun 04 2012 3:23PM
Subject: Re: Links vs. Buttons
← Previous message | Next message →

I agree 100% with Don on this.
If there is a clickable text, you can turnit into a button with
aria-role = "button".
Buttons should signify actions or downloads (I find download links for
files extremely annoying and sometimes I am having a hard time even
finding the download link, if this were a button it would be much
easier).
I wish there was a more precise guuide on when to use links vs
buttons, but I believe buttons are best for actions (including
downloads, form submitions, authorization etc), and links are
navigatory in nature, be it within the page, to subpages or to pages
outside of the website.
I am primarily speaking as a longtime user, not as any type of
aauthority on the subject, mind you.
Thanks
-B
p.s. if visually buttons are easier for low vission users, that is
important. Remember we are designing the web for everyone, not just
for blind people, so we do need to balance these needs out and come up
with a solution that is best for all groups.


On 6/4/12, Don Mauck < = EMAIL ADDRESS REMOVED = > wrote:
> Sorry for any mis-spelled words in the previous post, didn't have my spell
> checker on.
>
>

From: Hoger, Jodie
Date: Mon, Jun 04 2012 11:00PM
Subject: Re: Links vs. Buttons
← Previous message | Next message →

I would have to agree with Don here. As a screen reader user, if I was searching for a link that took me to a document and it is set up as a button then I am going to miss it. Bottons have a different role to links and links literally are points that take you to something whether it be mobe another page, site or document don't you think?

Jo

Jodie Hoger
Teacher Consultant (vision), Equity Services TAFE NSW - Illawarra Institute, Building A, 60 Bienda St, Bomaderry, NSW, 2541
VOIP 54865| P 02 4421 9865| M 0437 035 042| F 02 4421 9804| E = EMAIL ADDRESS REMOVED = | www.illawarra.tafensw.edu.au

From: Hoger, Jodie
Date: Mon, Jun 04 2012 11:13PM
Subject: Re: Links vs. Buttons
← Previous message | Next message →

Hi Heidi. I would prefer the first as my SR tells me it is a link that I can then click on to go to the graph. The latter tells me it is a button which is something I would select to perform a function like signing up to an email list or something. Does that make sense? I didn't actually consider the way it looks though. Are buttons easier to see than links?

Jodie Hoger
Teacher Consultant (vision), Equity Services TAFE NSW - Illawarra Institute, Building A, 60 Bienda St, Bomaderry, NSW, 2541
VOIP 54865| P 02 4421 9865| M 0437 035 042| F 02 4421 9804| E = EMAIL ADDRESS REMOVED = | www.illawarra.tafensw.edu.au

From: Benjamin Hawkes-Lewis
Date: Tue, Jun 05 2012 3:26AM
Subject: Re: Links vs. Buttons
← Previous message | Next message →

On Mon, Jun 4, 2012 at 4:15 PM, Heidi Jungel < = EMAIL ADDRESS REMOVED = > wrote:
> I find that many sites abuse the use of links and use links for everything- even button type action. I have often used the following quote:
>
> "Links are for navigation (I.e. To another section of a page or another page). Buttons are for actions"
>
> However, I am a getting a bit of a push back on this. What are your thoughts on this? Are sites abusing links?

Yes absolutely, though this is mostly a lost cause thanks to abuse on
popular sites like Facebook.

In theory, a@href should be reserved for navigational hyperlinks, but
this distinction has been blurred in all sorts of ways.

Addresses can represent imperative actions using the javascript: scheme:

http://tools.ietf.org/html/draft-hoehrmann-javascript-scheme

or by using hash bangs:

http://www.w3.org/2001/tag/2011/01/HashInURI-20110115

User agents may handle links to certain resources in ways that may
surprise end-users in how different they are from other links,
triggering downloads, opening them in external applications, composing
a new message in an email client, etc.

Servers should avoid making GET actions on resources non-idempotent or
perform destructive actions, but they don't always do this. There have
been high-profile cases where following a link triggered a deletion
from a database:

http://radar.oreilly.com/archives/2005/05/google-web-acce-1.html

At the semantic layer, hyperlinks can be represented to accessibility
clients as buttons and vice versa using ARIA annotations.

At the styling level, hyperlinks can be styled to look like buttons,
<input> and <button> elements can be styled to look like hyperlinks.

At the behavioral layer, hyperlinks can be reprogrammed to perform
actions rather than navigation.

I think there are some tests to see if you are using hyperlink widgets
correctly:

1. If you right-click the link to get the context menu, you'll be
offered options like bookmarking the link and opening the link in a
new tab. Do these secondary actions work? If you go to the bookmark,
do you get content appropriately described by the link text?

2. If you follow the link and this results in a navigation, can you go
back, click it again, and still get content appropriately described by
the link text?

In other words, does your use of a@href break the actions (primary and
secondary) that user agents expose for hyperlink widgets?

--
Benjamin Hawkes-Lewis

From: Bevi Chagnon
Date: Tue, Jun 05 2012 10:24AM
Subject: Re: Links vs. Buttons
← Previous message | No next message

Very interesting discussion, especially the comments about what users think
are the differences between links and buttons. I don't think I fully grasped
what SR users expect from the two methods of coding. I have 2 comments.

Comment #1:
The current HTML standards don't clearly emphasize the distinction between
links and buttons. (I searched www.w3c.org but did not find enough clarity
about it. Maybe someone else will find more info on their website.)

Going back to basic HTML definitions, the button tag is a new-ish tag that
became available with HTML 4, the current version of HTML. Previous to HTML
4, the button tag could only be used in forms: checkbox and radio buttons,
and the Submit and Reset buttons.

Many web developers don't know about the stand-alone button tag and instead
still believe that buttons can only exist inside a <form> tag, so the
majority of websites will have buttons only inside the <form> tag.
However, SR users wouldn't want web developers to throw them into a form in
order to create only a button that downloads a file, for example, rather
than fill in an actual form with data.

Most "buttons" on websites are really just graphics with a hyperlink to the
file or webpage. These are faux buttons that I'm sure SR users see
all-too-frequently and are not as helpful to them as the real <button> tag.

I think there are valid reasons to use the <button> tag for actions, such as
downloading a file, versus <a href> hyperlinks which navigate to the file
and allow the user the choice of downloading the file if desired.

But I don't think the web developer community knows about this distinction
and therefore uses regular hyperlinks for everything, including actions. So
web developers should be encouraged to use the stand-alone <button> tag for
actions instead using hyperlinks and button-like graphics with hyperlinks.

Here's a quick tutorial about the stand-alone HTML button tag:
http://www.javascriptkit.com/howto/button.shtml. And here's the W3C's
definition of it (see example B):
http://www.w3.org/wiki/HTML/Elements/button#Example_B

I couldn't find any reference to the use of <button> versus <a href> in WCAG
2.0 (maybe I missed it? It's not the easiest document to search and find
information).

Conclusion: If you'd like to see better implementation of buttons rather
than hyperlinks, then you'll need to approach the W3C and WAI to get better
documentation about the issue. The guidance that's available now for web
developers isn't clear enough to get the results you want.

Comment #2:
Someone on the list asked if links and buttons look different to sighted
users. Answer: yes, they can, but it's up to the web developer. Usually a
button is designed to look sort of like a 3D button in real life, such as a
button on a kitchen appliance or light switch or electronic device. Buttons
visually stand out on the web page just as a light switch stands out from
the flat surface of a wall. With coding, especially CSS, a web developer
could develop any visual appearance they want for the button.

Links, on the other hand, are just text that is designed to look different
from the body text around it. Usually it's blue and underlined (that's the
convention), but it could have any appearance the web developer wants. There
is no hard and fast rule about a link's appearance.

Links should have meaningful text, per WAI's WCAG 2.0 guidelines, so that
should help SR users know whether they're about to navigate to a new web
page or open/download a Word.doc, for example.

--
Bevi Chagnon | = EMAIL ADDRESS REMOVED =
PubCom - Trainers, consultants, designers, and developers
Print, Web, Acrobat, XML, eBooks, and Federal Section 508
--
* It's our 30th Year! *