WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Hyperlinks Not Underlined Question

for

From: Jim Homme
Date: Apr 1, 2020 8:13AM

Hi Glen,
Is there a technique that talks about items that opening menus are cool because of positioning? I saw something about this on Webaim when looking at documentation that says that header links are OK in banners.

 
=========Jim Homme
Digital Accessibility
Bender Consulting Services
412-787-8567
https://www.benderconsult.com/our%20services/hightest-accessible-technology-solutions
 

-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of glen walker
Sent: Tuesday, March 31, 2020 4:02 PM
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] Hyperlinks Not Underlined Question

1.4.11 usually does not come into play because that's for non-text. Most links are text but I suppose if you had a graphical link, it might apply.

If a link is embedded in a paragraph and the link text is a different color than the text paragraph *and* you have underlines turned off, that would be a problem. G183 regarding 1.4.1 talks about this situation but says the link text must have at least a 3:1 difference from the paragraph text (so that most people can perceive there's a difference) **and* *there must be another visual clue when the link receives keyboard or mouse focus.

If the link text is bold and the paragraph text is not, then technically the link text and the paragraph text can be the same color and underlines can be turned off and it would pass 1.4.1 (because color is not being used for meaning - a font style (bold) is being used).

The link text could be a different color from the paragraph text and only have a 1.5:1 contrast difference but if it were also bold (or italic or some other non-color difference), it would be ok. (Which is pretty much what I just said in the previous paragraph but a slightly different
situation.)

There is nothing that requires links to have underlines. That's just the standard that has been around for 20+ years.

If the links are for navigating or for opening menus, they don't necessarily need underlines. It might be understandable from the context what their behavior is.

In your specific case, it sounds like there are a group of links in a "menu" and some of the links are for navigation and others are for dropdowns. Does there need to be a distinction? From a visual perspective, there should be but it might not be required. From an aria perspective, there should be too.

As an example, I was on Lego.com the other day. The main menu (themes, shop by, interests) has both dropdown menus and direct navigation links.
The dropdown menus have a visual indicator (down arrow) and the direct links do not. The dropdown menus have aria-haspopup so that the screen reader will announce "submenu" but the direct links do not.

(Side note, when using aria-haspopup or menu roles, you are committing to using arrow navigation to traverse the menu. Personally, I would have used aria-expanded for the dropdowns and let the user use the tab key for navigating through the items.)

[image: image.png]
(Screenshot of menu. Yellow background and black text. Dropdown menus have a down arrow next to them. Direct links do not.)

Anyway, if the dropdowns did not have the down arrow but they had aria properties to indicate they're dropdowns, that would be an advantage for the screen reader user and a disadvantage to the sighted user. I would consider that a poor design.




On Tue, Mar 31, 2020 at 1:30 PM Jim Homme < <EMAIL REMOVED> > wrote:

> Hi,
> I want to see if my understanding of SC 1.4.1, 1.4.3, and 1.4.11 is
> correct in this area. My understanding is that when neither the mouse
> nor the keyboard is pointing to a link that someone with color
> blindness must be able to tell that it is a link. Also, the
> recommended way to solve this most of the time is to recommend that
> the developer allow the browser to underline the link.
>
> In the page I'm looking at, some links go to other pages. Some drop
> menus down. Does this make any difference?
>
> I have not inspected the code yet, so I do not know if they are anchors.
>
> Thanks.
>
> Jim
>
>
> =========> Jim Homme
> Digital Accessibility
> Bender Consulting Services
> 412-787-8567
>
> https://www.benderconsult.com/our%20services/hightest-accessible-techn
> ology-solutions
>
>
> > > archives at http://webaim.org/discussion/archives
> >