WebAIM - Web Accessibility In Mind

E-mail List Archives

for

From: Ramshif Richu
Date: Oct 9, 2019 2:42AM

Great, so here i should have 'Get it now' in the link label right? as
in for a product named 'iPhone X' i would label it 'Get it now iPhone
X'

On 10/9/19, glen walker < <EMAIL REMOVED> > wrote:
> 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 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.
>> >> >> >> >>
> > > > >