WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread:

for

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

From: glen walker
Date: Tue, Oct 08 2019 11:33PM
Subject:
No previous message | No next message

From a pure compliance perspective, you can sometimes get away with just
"get it now" as long as the link is in context with what you're "getting".
The "understanding" section for 2.4.4 describes some examples of context as:

"This can be achieved by putting the description of the link in the same
sentence, paragraph, list item, or table cell as the link, or in the table
header cell for a link in a data table."

https://www.w3.org/WAI/WCAG21/Understanding/link-purpose-in-context.html

The problem is that if I bring up a list of links via the screen reader,
the extra context of the paragraph, list, or whatever, is not taken into
account so all you see/hear is a bunch of "get it now" links. I think that
sucks.

I always encourage 2.4.9 even though it's a AAA success criteria.

It's pretty easy to associate extra information with an otherwise
non-contextual link. If you have something like this:

<h3>my awesome product</h3>
<p>
Details about the awesomeness
<button>get it now</button>
</p>

I would change it to

<h3 id="one">my awesome product</h3>
<p>
Details about the awesomeness
<button id="two" aria-labelledby="two one">get it now</button>
</p>

This might not sound grammatically nice, "get it now my awesome product",
but it's better than it was. If you were speaking it, you might want to
say "get my awesome product now", but that would break 2.5.3 Label in Name
because the button says "get it now" so the accessible name must have "get
it now" in it.

My final solution uses a little bit of trickery using a hidden comma on my
page that I use all over the place to give a natural pause when the link is
read.

<!-- somewhere on the page, doesn't matter where -->
<span id="comma" style="display:none">,</span>

<h3 id="one">my awesome product</h3>
<p>
Details about the awesomeness
<button id="two" aria-labelledby="two comma one">get it now</button>
</p>

Now I'll hear "get it now, my awesome product".



On Wed, Oct 9, 2019 at 12:52 AM Ramshif Richu < = EMAIL ADDRESS REMOVED = > wrote:

> Is it advisable to give remediation for link ‘Get it know' as ‘Click here
> to get the [product name] the scenario is there is a products page in a
> webpage and the visual link name is ‘Get it now', here the actual meaning
> of the link will be as the ‘Now' in the link name stands for ‘The
> particular product'. Please note that there are multiple links with the
> same name ‘Get it now' in the page.
> > > > >