WebAIM - Web Accessibility In Mind

E-mail List Archives

for

From: William O'Donnell
Date: Oct 10, 2019 8:56AM

Thanks, these are all good suggestions. Have a great day.

Sent from my iPhone

> On Oct 10, 2019, at 10:38, TRAUTWEIN_PAUL < <EMAIL REMOVED> > wrote:
>
> Here's another couple options that have worked for me:
>
> I created a style in my external css called "hfsr" (hide for screen readers) and set the indents to shove the content off screen, essentially hiding it from people who are able to read the button/link names in context.
>
> Then in my link I would include descriptive content and surround it with a span with the "hfsr" class:
>
> <a href="link"><span class="hfsr">Product Name, </span>Buy it Now!</a>
>
> Another way I've done it, and here's where I might get in trouble with some of the more knowledgeable accessibility experts, is to use an "area-label" in the anchor tag:
>
> <a href="link" aria-label="Buy the Product Name now.">Buy it Now!</a>
>
> The aria-label overrides what's in between the anchor tags and reads off a grammatically correct sentence.
>
> Both solutions have worked when I've tested them in NVDA and Voiceover. In context and in a list of links.
>
> All that said, I have never tested "Dragon" as Mark has so I'm not sure how it would handle my solutions.
>
> Paul
>
> On 10/9/19, 2:02 AM, "Mark Magennis" < <EMAIL REMOVED> > wrote:
>
> Glen pointed out that even if you include the repeated link text "get it now" in context in the ways allowed for WCAG SC 2.4.4 compliance, that context is not available in a links list. Similarly, it is not directly available when you TAB through the links. To understand what "it" means, the user has to backtrack through the sentence, paragraph, list item, or table cell to discover the context. This is a major pain.
>
> There's another consideration too. Users of voice activation software such as Dragon Naturally Speaking want to activate the link by saying "click" followed by the unique link name. They may guess (or find out) that the link name is always in the form "Get it now {product name}" so they can speak that. They could also use a two-step process of just saying "click link" and Dragon will number all the links on the page, then "press 17" or whatever number they want. But I'm informed that Dragon users feel this is unacceptable, making them "jump through hoops" to use the functionality. They want to be able to activate everything directly.
>
> Glen, I quite like your idea of inserting the comma to get around the clumsy construct. Some time ago, when I was working on pages with repeated links "launch", "edit", "delete", etc. I was finding that some of them were very clumsy. I can't remember the particular examples but it was something like "get details". I thought it would be clever to add extra words in there, such as "for" to make it "get details for {object}" but then the Dragon issue came up. The comma would seem to not create that issue, although I actually doubt that it will make that much difference to most screen reader users who seem perfectly able to understand what to me sounds like verbal garbage spoken at 300 words per minute.
>
> Mark
>
> Mark Magennis
> Skillsoft | mobile: +353 87 60 60 162
> Accessibility Specialist
>
>
> -----Original Message-----
> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of glen walker
> Sent: 09 October 2019 06:33
> To: WebAIM Discussion List < <EMAIL REMOVED> >
> Subject: [EXTERNAL] Re: [WebAIM] Is it advisable to give remediation for link ‘Get it know' as ‘Click here to get the [product name]?
>
> 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.
>> >> >> >> >>
> > > > >
>
> > > >