WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: label for checkbox in a dynamic complex application Question

for

From: Birkir R. Gunnarsson
Date: Jul 31, 2017 7:57PM

Why do you need the checkbox with visually hidden text? Keyboard only
users can get to them and will not be able to see where the focus is,
which can be a problem (if you want to force it under WCAG it would be
2.4.3).
In terms of labeling, you could just use aria-label="favorite this"
and aria-describedby pointing to the long text in the link.
<input type="checkbox" aria-label="favorite this" aria-describedby="d1">
<a href="#" id="d1">Link to section 1</a>

How do you "regular" users favorite an article?


On 7/31/17, Nancy Johnson < <EMAIL REMOVED> > wrote:
> I am working on a table of content for a small application that displays a
> complex legal document. Not yet live.
>
> A user can login and create a favorites of the sections that are important
> to that user.
>
> The TOC has sections and two levels of subsections.
>
> Among other things each line has a link to each section with a fairly long
> title and a check box The label is hidden from visual users.
>
> Question: what text should be in the label?
>
> I cannot wrap the label around the link as it breaks the application. I
> could add the same title as the link but the screen reader user would have
> to listen to the text twice. Suggestions? This is all in a loop and
> dynamic.
>
> Thanks
>
> Nancy
> > > > >


--
Work hard. Have fun. Make history.