WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Using Aria within a table to indicate that a cell is highlighted

for

From: Birkir R. Gunnarsson
Date: Jul 5, 2022 12:27PM

Apologies for my typos, my keyboard has been giving me grief lately.
Yes, using heading markup around cells breaks association and table semantics.
aria-label does not work on a <span> without a role (in ARIA 1.2 it is
suggested to be an ARIA validation error).
You could use something like role="img"> on the span

<td>
<span role="img" aria-label="highlighted: </span>
the cell content
</td>
It's a hack for sure.
But without actually seeing an example of what the table is trying to
communicate it's hard to give more specific recommendations.


On 7/5/22, Patrick H. Lauke < <EMAIL REMOVED> > wrote:
> On 05/07/2022 14:50, Geethavani.Shamanna wrote:
>
>> Using aria-label to indicate that this cell is highlighted appears to be a
>> good option. Aria-label works as long as it is included within a span
>> element within the <td> tag.
>
> aria-label on a generic element without a specific role, such as <span
> aria-label="..."> ... </span>, is not consistently supported by all
> browser/assistive technology combinations. You really only want to use
> aria-label on a "labelable" element. See
> https://www.tpgi.com/short-note-on-aria-label-aria-labelledby-and-aria-describedby/
>
> --
> Patrick H. Lauke
>
> https://www.splintered.co.uk/ | https://github.com/patrickhlauke
> https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
> twitter: @patrick_h_lauke | skype: patrick_h_lauke
> > > > >


--
Work hard. Have fun. Make history.