WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: quick question on alt text

for

From: Jonathan C. Cohn
Date: Dec 6, 2019 5:37PM

I 'believe there is an exception.I was recently reading that figure captions are not supporthat consistently, so alt text is required even when there is a figcaption.
Jonathan Cohn

Sent from my iPhone

> On Dec 6, 2019, at 3:11 PM, glen walker < <EMAIL REMOVED> > wrote:
>
> Since the image is not interactive (not contained in a link or button), as
> Jared said, it can be considered decorative.
>
> If you want to save three characters when typing, you can have "alt" by
> itself rather than having alt="". The following two examples are treated
> the same.
>
> <img src="foo.jpg" alt>
> <img src="foo.jpg" alt="">
>
> See the first example in
> https://www.w3.org/TR/html53/semantics-embedded-content.html#ref-for-elementdef-img%E2%91%A8%E2%91%A6
> It mentions alt="" or alt by itself.
>
> If the image were in a link, my preference is to hide the image and put the
> label on the link itself. For example, the following will say "important
> stuff, graphic, link".
>
> <a href="...">
> <img src="foo.jpg" alt="important stuff">
> </a>
>
> The user most likely doesn't care that you implemented a link as an image
> and just wants to know what the link is for. It's a minor change but I
> usually code it as:
>
> <a href="..." aria-label ="important stuff" >
> <img src="foo.jpg" alt>
> </a>
>
> Now when you navigate to the link, you just hear "important stuff, link".
> You don't hear "graphic". It's a minor difference but I like the
> "cleanness" of just hearing that it's a link and ignoring that it happens
> to be implemented as an image.
>
> However, one could argue that a low vision user might be able to see some
> kind of blob where the link is and guess that it's an image and try to
> navigate by images, in which case my example above would skip that image.
> So it's a trade off. Either example satisfies WCAG.
>
> The W3C has a decision tree on deciding if an image is decorative. See
> https://www.w3.org/WAI/tutorials/images/decision-tree/
> There's also further info on decorative, informative, and other types of
> images at https://www.w3.org/WAI/tutorials/images/
> > > >