Archived topic
Missing alt tag for search icon
7 replies · Started by Patricia on November 4, 2022
Hi guys, hope all is well with you!
I have been doing a site audit and it is pointing that an alt tag is missing from an image that points to the link below
<raw data>image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='300'%20height='510'%20viewBox='0%200%20300%20510'%3E%3C/svg%3E
I had a look at the page source inspector and it seems that it belongs to the magnifying glass icon for searching.
Can you please check this out, and shed some light on how to add an alt tag to it? thanks!
Hi there,
Thats not the Search Icon SVG, as we don't output it as an <img> so it can't have an alt attribute.
That looks like a placeholder SVG that would get inserted by a lazy loading plugin.
Can you share a link to the post/page where the issue shows up ?
This "image" is on almost all pages of the site. Here is one example:
Page
https://themakeup.org/4th-of-july-makeup-ideas/
Image URL
<raw data>image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='300'%20height='510'%20viewBox='0%200%20300%20510'%3E%3C/svg%3E
When you say - audit, which tools are you using that is raising the issue ?
'Website auditor' from Microsoft :)
Oh... ok - it think its a false positive.
The only reference to this type of code: <raw data>image/svg+xml, is what the Lazy Loader adds to your site.
So every page that has lazyloaded images on it has many instances of this.
If you open your site in an Incognito / Private browser, Right Click > Inspect the page to open the Browser Dev tools and go to the Network Tab and filter the list by Img then load a new page you will see a bunch of those loading.
What happens - the lazy loader scans your sites HTML, looking for the appropriate <img> tags. And it replaces it with an inline image/svg+xml which is 0 bytes in size.
When you scroll close to the image, it swaps the image/svg+xml for the actual image for the browser to load.
It looks like Microsoft is scanning the source code and not detecting its there for lazyloading.
TO give some comfort, i ran a Lighthouse test on your post and there was no missing Alt listed.
I would ignore those warnings in the Website Auditor or report it to Micrsoft. But its not a problem that i can see.
Alright, Davi, thanks for clarifying! many thanks!
You're welcome