E-mail List Archives
Thread: Descriptive label for Read more button
Number of posts in this thread: 19 (In chronological order)
From: Sumit Patel
Date: Mon, Apr 24 2023 12:23PM
Subject: Descriptive label for Read more button
No previous message | Next message →
Hai all,
Descriptive label for buttons or links always confuses me.
I have a page where reviews of multiple people are given at the end of
the page. The structure would be.
1 or 2 sentences of review we can see on the screen, then name of the
reviewer and next to that a read more button on clicking on which we
can see the complete review of that person.
Then below next person's review ...
The aria-label of all the "read more" buttons are "read more about this review"
Though multiple read more buttons are there with the same label, I
think it is fine as with the label user can understand on clicking on
this button they can see complete review
Moreover the name of the reviewer is not important here as user
decides whether they want to read more or not based on the content ,
not based on the reviewer name
If the label was just "read more", then user won't have any clue about
what they are going to read more.
Correct me if I am missing something.
Regards,
Sumit .
From: L Snider
Date: Mon, Apr 24 2023 12:39PM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
Just be careful with aria-labels and voice users. I use voice a lot and
many times the labels are something completely different, and it frustrates
me because then I have to grid the screen and sometimes my software won't
do it well (so it takes longer). I recommend to keep labels simple and what
is shown on screen for those of with sight who use voice. This is where
accessibility gets tough, because we can make it better for screen reader
users, yea, but it can make it tougher for us voice users.
Cheers
Lisa
On Mon, Apr 24, 2023 at 3:23 PM Sumit Patel < = EMAIL ADDRESS REMOVED = >
wrote:
> Hai all,
>
> Descriptive label for buttons or links always confuses me.
>
> I have a page where reviews of multiple people are given at the end of
> the page. The structure would be.
> 1 or 2 sentences of review we can see on the screen, then name of the
> reviewer and next to that a read more button on clicking on which we
> can see the complete review of that person.
> Then below next person's review ...
>
> The aria-label of all the "read more" buttons are "read more about this
> review"
>
>
> Though multiple read more buttons are there with the same label, I
> think it is fine as with the label user can understand on clicking on
> this button they can see complete review
> Moreover the name of the reviewer is not important here as user
> decides whether they want to read more or not based on the content ,
> not based on the reviewer name
>
> If the label was just "read more", then user won't have any clue about
> what they are going to read more.
>
> Correct me if I am missing something.
>
> Regards,
> Sumit .
> > > > >
From: glen walker
Date: Mon, Apr 24 2023 12:55PM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
The issue Lisa mentioned would be covered under 2.5.3. If the visible
label says "read more" but the aria-label is "read more about this review",
then 2.5.3 is satisfied and a voice interface should allow "click read
more" (although it'll highlight all the "read more" links).
But I don't see "read more" as any more descriptive than "read more about
this review". I still don't know which review I'm reading more about so I
would still fail 2.4.4 (if it's a link) or 2.4.6 (if it's a button).
Reviews often have the person's name, as you mentioned, and might include a
short title for the review. Either one of those should be associated with
the "read more". I like to use aria-labelled by rather than
aria-describedby so that if the screen reader user brings up a list of
links or a list of buttons, the context of the "read more" will appear in
that dialog. Accessible descriptions aren't shown in those dialogs. But
that's just my personal preference.
From: Sumit Patel
Date: Tue, Apr 25 2023 12:06AM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
Thanks for your response.
But, is it somethikg which need to be marked as a failure ?
Because I feel the impact or the importance is really less as the
name of the person here is not at all important .
We'll choose whether we need to read more or not based on the visible
part of the review content.
The name here does not influence the user anyhow to do that .
If the persons were someone who is established in this field and their
name has the ability to influence the user to read the complete
review, then I think the name is important.
Else, it might be a good practice, not a failure.
This is just my perception. I am just seeing how much important their
names or what benefit the screen reader user gets if the name gets
associated
On 25/04/2023, glen walker < = EMAIL ADDRESS REMOVED = > wrote:
> The issue Lisa mentioned would be covered under 2.5.3. If the visible
> label says "read more" but the aria-label is "read more about this review",
> then 2.5.3 is satisfied and a voice interface should allow "click read
> more" (although it'll highlight all the "read more" links).
>
> But I don't see "read more" as any more descriptive than "read more about
> this review". I still don't know which review I'm reading more about so I
> would still fail 2.4.4 (if it's a link) or 2.4.6 (if it's a button).
>
> Reviews often have the person's name, as you mentioned, and might include a
> short title for the review. Either one of those should be associated with
> the "read more". I like to use aria-labelled by rather than
> aria-describedby so that if the screen reader user brings up a list of
> links or a list of buttons, the context of the "read more" will appear in
> that dialog. Accessible descriptions aren't shown in those dialogs. But
> that's just my personal preference.
> > > > >
From: Priti Rohra
Date: Tue, Apr 25 2023 4:08AM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
Sumit agree that the name of the person is not important here but the
person's name helps us (screen reader users) to differentiate one "Read
more" link from another. I know it does not give enough context but does
give us some context - some context is better than no context! So screen
reader will read the link as "Read more on Sumit's review" rather than just
saying "Read more about this review".
Also agree with Glen, we should use aria-labelledby instead of aria-label
to add more context since person giving the review is subject to change and
if we hard code via aria-label than chances are that aria-label does not
get updated and the content, i.e. the review gets updated.
Lastly, if this is a fail or not depends on how it is structured. If there
are "Read more" links then at 2.4.4 Link Purpose Level A, such links need
to be marked up in the same <p>, <ul> or <ol>, <table> etc. in order to
meet the criterion. Refer techniques H77, 78 and 79 for more details.
Always BPositive!
Priti Rohra
On Tue, Apr 25, 2023 at 11:36 AM Sumit Patel < = EMAIL ADDRESS REMOVED = >
wrote:
> Thanks for your response.
>
> But, is it somethikg which need to be marked as a failure ?
> Because I feel the impact or the importance is really less as the
> name of the person here is not at all important .
> We'll choose whether we need to read more or not based on the visible
> part of the review content.
> The name here does not influence the user anyhow to do that .
>
> If the persons were someone who is established in this field and their
> name has the ability to influence the user to read the complete
> review, then I think the name is important.
>
> Else, it might be a good practice, not a failure.
>
> This is just my perception. I am just seeing how much important their
> names or what benefit the screen reader user gets if the name gets
> associated
>
>
> On 25/04/2023, glen walker < = EMAIL ADDRESS REMOVED = > wrote:
> > The issue Lisa mentioned would be covered under 2.5.3. If the visible
> > label says "read more" but the aria-label is "read more about this
> review",
> > then 2.5.3 is satisfied and a voice interface should allow "click read
> > more" (although it'll highlight all the "read more" links).
> >
> > But I don't see "read more" as any more descriptive than "read more about
> > this review". I still don't know which review I'm reading more about so
> I
> > would still fail 2.4.4 (if it's a link) or 2.4.6 (if it's a button).
> >
> > Reviews often have the person's name, as you mentioned, and might
> include a
> > short title for the review. Either one of those should be associated
> with
> > the "read more". I like to use aria-labelled by rather than
> > aria-describedby so that if the screen reader user brings up a list of
> > links or a list of buttons, the context of the "read more" will appear in
> > that dialog. Accessible descriptions aren't shown in those dialogs. But
> > that's just my personal preference.
> > > > > > > > > >
> > > > >
From: glen walker
Date: Tue, Apr 25 2023 11:04AM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
>
> But, is it somethikg which need to be marked as a failure ?
>
That's for you to decide. I already gave my opinion that I would mark it a
failure. There might be others on this list that wouldn't mark it a
failure, and that's ok. It's not my job to convince you one way or the
other.
> Because I feel the impact or the importance is really less as the name of
> the person here is not at all important .
>
But now you are deciding something for the user based on your preference.
You don't think the name is important but how do you know the user doesn't
think it's important?
> We'll choose whether we need to read more or not based on the visible part
> of the review content.
>
And how do you associate the visible part of the review with the link to
read more? If I'm tabbing through the links, all I'll hear is "read more",
"read more", "read more".
> The name here does not influence the user anyhow to do that .
>
You're making that decision based on what? Your preference?
> If the persons were someone who is established in this field and their
> name has the ability to influence the user to read the complete
> review, then I think the name is important.
>
Ok, so how do you know if the person's name is important or not to the user?
This is just my perception. I am just seeing how much important their
> names or what benefit the screen reader user gets if the name gets
> associated
>
It sounds like you don't want to mark this a failure. That's certainly your
choice. Again, I'm not going to try to convince you one way or the other.
I think plenty of discussion has already happened. Priti also had some good
points.
From: East, Robin
Date: Tue, Apr 25 2023 12:16PM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
It is a "failure" because the link cannot stand alone with meaning. "Read More" of what? In a list of links all you will see is "Read More" and this has no real meaning. It is like "click Here" or just "More"
Robin and Dog Guide Lumos
Robin East, CPACC
From: David Farough
Date: Mon, May 01 2023 7:17AM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
I agree with Robin.
Also refer to the current WEBAIM newsletter as an example of how to present content without the use of "read More links".
https://webaim.org/newsletter/2023/april
From: wolfgang.berndorfer
Date: Mon, May 01 2023 8:40AM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
Hi Glen,
> I like to use aria-labelled by rather than aria-describedby so that if the screen reader user brings up a list of links or a list of buttons, the context of the "read more" will appear in that dialog.
We have to be careful:
The label âread moreâ won't be part of the *technical* name referenced with aria-labelledby, independent of that being a person's name or something else.
That would be a 2.5.3 fail.
Iâd prefer aria-describedby therefor, knowing that the description is not mentioned, when I list up the links with most SR.
Jaws adds the description to the link-text at least when tabbing through a page.
Or do you think about some scripting workaround, adding something to âRead moreâ in aria-label?
From: glen walker
Date: Fri, May 05 2023 9:08PM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
On Mon, May 1, 2023 at 8:40 AM < = EMAIL ADDRESS REMOVED = > wrote:
> Hi Glen,
>
> > I like to use aria-labelled by rather than aria-describedby so that if
> the screen reader user brings up a list of links or a list of buttons, the
> context of the "read more" will appear in that dialog.
>
> We have to be careful:
>
> The label âread moreâ won't be part of the *technical* name referenced
> with aria-labelledby, independent of that being a person's name or
> something else.
> That would be a 2.5.3 fail.
>
>
No, it wouldn't be a failure. Aria-labelledby can have multiple IDs so it
would point to "read more" and the reviewers name so there is not a 2.5.3
issue and you have the benefit of the full link name in the link list
dailog.
> Or do you think about some scripting workaround, adding something to âRead
> moreâ in aria-label?
>
> No scripting is needed.
From: East, Robin
Date: Mon, May 08 2023 8:05AM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
Remember that aria is used to enhance an already accessible compliant page and should not be used to make a page compliant.
Robin and Dog guide Lumos
Robin East, CPACC
From: glen walker
Date: Mon, May 08 2023 9:22AM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
On Mon, May 8, 2023 at 8:05 AM East, Robin via WebAIM-Forum <
= EMAIL ADDRESS REMOVED = > wrote:
> Remember that aria is used to enhance an already accessible compliant page
> and should not be used to make a page compliant.
>
Of course but can you help me understand how that ties into the current
discussion? My understanding of the original problem was that there were a
bunch of "read more" links. Unless the link is contained in the same
paragraph, list, table cell, etc with its context, then it is not a
conformant page so aria must be used to make it conformant.
From: Kevin Prince
Date: Mon, May 08 2023 7:35PM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
Consistency is important - Can you change the wording so that the positive action is the one you want and keep the buttons the same way around but overall if the change means users are more likely to get the right one then go for it (in accessibility terms - this has a bearing for magnification and cognitive impairment. In usability you want users to make the right choice deliberately)
Kevin
From: David Engebretson Jr.
Date: Mon, May 08 2023 8:20PM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
What's the best way to provide more context to speech to text users, or maybe those assistive technologies that aren't as ARIA robust as screen readers?
Thanks,
David
From: wolfgang.berndorfer
Date: Tue, May 09 2023 6:56AM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
Hi Glen,
> No, it wouldn't be a failure. Aria-labelledby can have multiple IDs so it would point to "read more" and the reviewers name so there is not a 2.5.3 issue and you have the benefit of the full link name in the link list dialog.
Interesting idea, which I hadn't thought of. Am I correct that you thought about something like:
*html code*
<p hidden id="more" >Read more about what </p>
<h2 id="author" >Glen </h2>
<p hidden id="wrote" >wrote</p>
<a href="#"
aria-labelledby="more author wrote" >
Read more
</a>
*html code end*
Tested this code with Jaws + Firefox/Chrome, which announce:
"Read more about what Glen wrote"
But we will still need scripting to identify the individual value for id="author", when there is more than one author in the conversation.
Good luck,
Wolfgang
From: glen walker
Date: Tue, May 09 2023 6:59AM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
Yes, something like that.
On Tue, May 9, 2023 at 6:56 AM < = EMAIL ADDRESS REMOVED = > wrote:
> Hi Glen,
>
> > No, it wouldn't be a failure. Aria-labelledby can have multiple IDs so
> it would point to "read more" and the reviewers name so there is not a
> 2.5.3 issue and you have the benefit of the full link name in the link list
> dialog.
>
> Interesting idea, which I hadn't thought of. Am I correct that you thought
> about something like:
>
> *html code*
> <p hidden id="more" >Read more about what </p>
> <h2 id="author" >Glen </h2>
> <p hidden id="wrote" >wrote</p>
> <a href="#"
> aria-labelledby="more author wrote" >
> Read more
> </a>
> *html code end*
>
> Tested this code with Jaws + Firefox/Chrome, which announce:
> "Read more about what Glen wrote"
>
> But we will still need scripting to identify the individual value for
> id="author", when there is more than one author in the conversation.
>
> Good luck,
>
> Wolfgang
>
>
>
From: wolfgang.berndorfer
Date: Tue, May 09 2023 10:49AM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
Thank you, Glen,
What I learned besides for SC 2.5.3:
"aria-label" means de facto "aria-name" and "aria-labelledby" means de facto "aria-namedby"!
The labels of the ARIA-attributes won't be changed. But we have to keep their impact according to the accessible name in mind.
From: glen walker
Date: Tue, May 09 2023 11:52AM
Subject: Re: Descriptive label for Read more button
← Previous message | Next message →
I'm not sure I follow what that means.
aria-label is a text string
aria-labelledby is a list of IDs
Either can be used to set the "accessible name" of an element (among other
ways to set the accessible name, as defined in "Accessible Name and
Description Computation 1.1" at https://www.w3.org/TR/accname-1.1/#step2).
I think we might be saying the same thing?
On Tue, May 9, 2023 at 10:49 AM < = EMAIL ADDRESS REMOVED = > wrote:
> Thank you, Glen,
>
> What I learned besides for SC 2.5.3:
> "aria-label" means de facto "aria-name" and "aria-labelledby" means de
> facto "aria-namedby"!
>
> The labels of the ARIA-attributes won't be changed. But we have to keep
> their impact according to the accessible name in mind.
>
>
>
From: wolfgang.berndorfer
Date: Wed, May 10 2023 5:55AM
Subject: Re: Descriptive label for Read more button
← Previous message | No next message
What I meant:
ARIA-label and ARIA-labelledby do not set or reference to a LABEL.
They set a (accessible) NAME.
That is important to know for 2.5.3.
Sorry for confusing.