简体   繁体   中英

Is there a spec-compliant practice for an image with no relevant alt text?

I'm implementing Jssor's Bootstrap Carousel Slider on a web page. Using W3C's validation tool I'm getting an error for the lack of alt text for this particular image:

<div data-u="loading" class="jssorl-009-spin" style="position:absolute;top:0px;left:0px;width:100%;height:100%;text-align:center;background-color:rgba(0,0,0,0.7);">
    <img style="margin-top:-19px;position:relative;top:50%;width:38px;height:38px;" src="/svg/loading/static-svg/spin.svg" />
</div>

The image is just a spinning disk used to represent the Jssor slider loading. I'm curious as to whether I should be using alt text on this image or not. So far my research points to just including a blank alt="" attribute; is there an authoritative reference for whether this should be included and left blank, or if it should be avoided if I don't have any alt text?

Based on the W3C's Web Accessibility Initiative (WAI) recommendations, an empty alt="" attribute should be used so it can be ignored by the screen readers.

Decorative images don't add information to the content of a page. For example, the information provided by the image might already be given using adjacent text, or the image might be included to make the website more visually attractive.

In these cases, a null (empty) alt text should be provided ( alt="" ) so that they can be ignored by assistive technologies, such as screen readers. Text values for these types of images would add audible clutter to screen reader output or could distract users if the topic is different from that in adjacent text. Leaving out the alt attribute is also not an option because when it is not provided, some screen readers will announce the file name of the image instead.

Source: https://www.w3.org/WAI/tutorials/images/decorative/

I generally don't like the idea of an empty alt attribute when I could put something meaningful. In particular when a form that might take a while is submitted, I show the spinner to indicate that the user has pressed the right button and something is going to happen - but for now they should wait while it is processing.

So my plan is to make alt="Processing..." and making that a translatable string in my application.

Any comments would be welcome.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM