<source> element itself does not have an
alt attribute. It is used inside a
<audio>) element to provide alternate sources for the media.
In case of images, it is used along with an
<img> element, to provide alternate sources for the image (that best matches the capabilities of the display device). Whichever version of the image is selected, it is presented in the space occupied by the
<img> element, and it also uses the same attributes as defined by the
<img> element (including the
alt attribute). For example:
<picture> <source srcSet="path/to/logo.avif" type="image/avif" /> <source srcSet="path/to/logo.webp" type="image/webp" /> <img src="path/to/logo.png" alt="My Logo" />` </picture>
In the example above, once the user agent selects the best match,
alt="My Logo" (as defined on the
<img> element) will be used as the
alt attribute. In case none of the sources match, the
<img> element itself is used as a fallback.
Hope you found this post useful. It was published . Please show your love and support by sharing this post.