E-mail List Archives

You are here: Home > Community > E-mail List Archives > View Thread

Thread: Hyperlinks displaying as blue text only

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

From: Mark Guisinger
Date: Wed, Jun 03 2009 10:50AM
Subject: Hyperlinks displaying as blue text only
No previous message | Next message →

I've noticed on the WebAIM site that the links in the navigation show
as blue text. When you mouse over them they underline and the
background changes colors to a yellow highlight. My question is ...
Does this meet Section 508 paragraph c and WCAG 1.0 checkpoint 2.1?

Thanks,
Mark Guisinger

From: Christian Heilmann
Date: Wed, Jun 03 2009 11:00AM
Subject: Re: Hyperlinks displaying as blue text only
← Previous message | Next message →

From: Randi Oomens
Date: Wed, Jun 03 2009 11:20AM
Subject: Re: Hyperlinks displaying as blue text only
← Previous message | Next message →

I think this is a good question. Probably the asker was curious with
regards to refining their own knowledge?

From: Mark Guisinger
Date: Wed, Jun 03 2009 11:25AM
Subject: Re: Hyperlinks displaying as blue text only
← Previous message | Next message →

The reason I ask is that the designers of the site that I work on have followed the blue text and showing the link on mouse over. We are in the process of doing an accessibility overhaul and we are in the midst of a huge battle over whether or not to have all the hyperlinks underlined. I used the WebAIM site as a point of discussion as it is one we all would be familiar with.

Thanks for your advice in advance,
Mark Guisinger

----- Original Message ----
From: Randi Oomens < = EMAIL ADDRESS REMOVED = >
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Sent: Wednesday, June 3, 2009 1:16:27 PM
Subject: Re: [WebAIM] Hyperlinks displaying as blue text only

I think this is a good question. Probably the asker was curious with
regards to refining their own knowledge?

From: Tim Harshbarger
Date: Wed, Jun 03 2009 11:45AM
Subject: Re: Hyperlinks displaying as blue text only
← Previous message | Next message →

Mark,

I think one of a number of important design concepts to keep in mind is
that it should be obvious to the users exactly which elements on the
page they can interact with. You don't want them to have to drag the
mouse over every element to determine which UI elements they can click.

In most cases, that means using blue underlined links because that is a
definite sign to the users that the item is a link they can click on.
You can choose to do something different, but then you may want to
conduct usability testing to determine if the alternate approach will
work.

(smiles) And please, don't make your links look like buttons. If you
want to do that, just use buttons. It is confusing when screen reader
users are being told to click on the button...and all they find are
links.

Best wishes for your design.

Tim

From: Jared Smith
Date: Wed, Jun 03 2009 11:50AM
Subject: Re: Hyperlinks displaying as blue text only
← Previous message | Next message →

On Wed, Jun 3, 2009 at 10:46 AM, Mark Guisinger wrote:
>
> I've noticed on the WebAIM site that the links in the navigation show
> as blue text. When you mouse over them they underline and the
> background changes colors to a yellow highlight. My question is ...
> Does this meet Section 508 paragraph c and WCAG 1.0 checkpoint 2.1?

Both of the guidelines you refer to say that you shouldn't use color
alone to convey content. If you want to argue that it's a failure
because these links are blue and other text is black, then yeah, I
suppose it fails. But I don't really care. Find me a human that says
those boxes in the sidebar aren't clearly links and then I'll consider
a change.

For all practical purposes, what we do goes well beyond the guidelines
- the links are clearly distinguishable as links to both mouse and
keyboard users, even though they are not underlined by default. As
Christian suggested, it's much better to focus on practical
accessibility than ensuring compliance to limited (and arguably
limiting) guidelines.

And please note that our in-content links are underlined, which is the
easiest way to meet these guidelines. If you don't want to underline
links by default, simply make sure they are visually distinguishable
and that they have a clear hover and focus indication.

WCAG 2 provides some technical guidance on this in 1.4.1. It basically
says, "Color alone is not used to distinguish links from surrounding
text unless the luminance contrast between the link and the
surrounding text is at least 3:1 and an additional differentiation
(e.g., it becomes underlined) is provided when the link is hovered
over or receives focus."

Jared Smith
WebAIM

From: Mark Guisinger
Date: Wed, Jun 03 2009 12:10PM
Subject: Re: Hyperlinks displaying as blue text only
← Previous message | Next message →

I agree with Jared. That things that are definitely identifiable as navigation the links don't need to be underlined and when the links are in the content should be underlined. The pages I'm working on have link farms on the homepage (in the middle of the page). That is generally associated with a content area, should those be underlined or would that we recognizable as navigation.

Plus the site is being reviewed by the state of NY for compliance and possible action (what ever that means) if we are not compliant. I was hoping to determine if there is a way to defend that position (blue hyperlinks that underline via a user action).

Thanks for your guidance in advance,
Mark Guisinger

----- Original Message ----
From: Jared Smith < = EMAIL ADDRESS REMOVED = >
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Sent: Wednesday, June 3, 2009 1:45:51 PM
Subject: Re: [WebAIM] Hyperlinks displaying as blue text only

On Wed, Jun 3, 2009 at 10:46 AM, Mark Guisinger wrote:
>
> I've noticed on the WebAIM site that the links in the navigation show
> as blue text. When you mouse over them they underline and the
> background changes colors to a yellow highlight. My question is ...
> Does this meet Section 508 paragraph c and WCAG 1.0 checkpoint 2.1?

Both of the guidelines you refer to say that you shouldn't use color
alone to convey content. If you want to argue that it's a failure
because these links are blue and other text is black, then yeah, I
suppose it fails. But I don't really care. Find me a human that says
those boxes in the sidebar aren't clearly links and then I'll consider
a change.

For all practical purposes, what we do goes well beyond the guidelines
- the links are clearly distinguishable as links to both mouse and
keyboard users, even though they are not underlined by default. As
Christian suggested, it's much better to focus on practical
accessibility than ensuring compliance to limited (and arguably
limiting) guidelines.

And please note that our in-content links are underlined, which is the
easiest way to meet these guidelines. If you don't want to underline
links by default, simply make sure they are visually distinguishable
and that they have a clear hover and focus indication.

WCAG 2 provides some technical guidance on this in 1.4.1. It basically
says, "Color alone is not used to distinguish links from surrounding
text unless the luminance contrast between the link and the
surrounding text is at least 3:1 and an additional differentiation
(e.g., it becomes underlined) is provided when the link is hovered
over or receives focus."

Jared Smith
WebAIM

From: Michael D. Roush
Date: Wed, Jun 03 2009 12:55PM
Subject: Re: Hyperlinks displaying as blue text only
← Previous message | Next message →

Mark Guisinger wrote:
> I've noticed on the WebAIM site that the links in the navigation show
> as blue text. When you mouse over them they underline and the
> background changes colors to a yellow highlight. My question is ...
> Does this meet Section 508 paragraph c and WCAG 1.0 checkpoint 2.1?

To specifically quote WCAG 1.0 checkpoint 2.1...

"Ensure that all information conveyed with color is also available
without color, for example from context or markup."

Links are, by their very nature, established by markup. So, any HTML
link is already marked up as a link. The information that a link is
present is conveyed by markup, not just the presence of blue (or blue
underlined) text.

So, even if the links were the exact same color, font, weight, etc., as
the surrounding non-link text on the page, they would still be links by
virtue of the markup.

Think of it a little bit in the reverse... the difference in color is
applied to give sighted people (who cannot immediately discern from a
visual interface) whether text is marked up to be a link or not unless
there is some visual difference to indicate such. The browser has no
such incapacity and can easily tell links from non-links even if they
are all 12-point black arial with no underlining. Tabbing through links
and other such browser-based activities function as expected.

To my way of thinking, there is no violation of the checkpoint here.
Whether that translates into greater ease-of-use is, as always, a far
different discussion.

Michael

From: Randall Pope
Date: Wed, Jun 03 2009 2:20PM
Subject: Re: Hyperlinks displaying as blue text only
← Previous message | No next message

As a low vision person like myself, I like the idea of having a different
color background when a mouse or keying over the link. This way it helps me
ensure that I'm in the right place to click on to the next page. It is
quite difficult for me to see the underline disappear when reaching the
link.

With Warm Regards,
Randall "Randy" Pope
American Association of the Deaf-Blind
Website: http://www.aadb.org

301 495-4402 VP/TTY
301 495-4403 Voice
301 495-4404 Fax
AIM: RandyAADB

Want to keep up with the latest news in the Deaf-Blind Community? Consider
subscribing to the monthly newsletter, "AADB Today" at http://aadb.org. It's
free and AADB membership is not required.