In a Google hangout, one SEO professional asked about a particular implementation they were working on to improve a CLS metric, involving potential use of image structured data.
They asked: if an empty SVG is used as a placeholder in the SRC attribute, and then the SVG is replaced with the original image once it loads, is doing this the same to Google?
This is something recommended on Web.dev. However, instead of using the data source set, they use their data SRC. They also switch an image with an image within the SRC.
They wanted to ensure that this type of setup is acceptable for Google, in terms of indexing images.
John explained that it sounds fine the way the SEO professional described it. For Core Web Vitals, he also mentioned that it’s something you can test to determine whether it works or not.
For indexing, it’s important that Google has information about the images on those pages. In John Mueller’s example, he said structured data is important. But, in our experience at iloveseo, this could also mean image alt text or image titles.
John’s advice is to always make sure that there is structured data for those images. In that case, Google is absolutely able to pick up that structured data in order to understand it.
What’s truly important is what’s physically rendered on the page and viewable by Google themselves.
This happens at approximately the 2:07 mark in the video:
John Mueller Hangout Transcript
SEO Professional 2 2:07
Yes. Hello, John. I, yes. So we are trying to improve page experience on one of our websites. Currently, we are working on CLS metric. So the background of the problem is that the images on our website use Lazy load. But before loading, we don’t know their sizes. So we put an empty SVG in the SRC attribute with the viewport meta tag and the original image is in the data SRC. And once the image is there on the screen, we replace the SRC attribute with the original image. Is it the same? Well, it is this same setup that is recommended in their article on Web.dev. But we use their data SRC instead of their data source set as an example. And we also switch an image with an image in the SRC. Is this setup okay for Google in terms of indexing images on such pages? I mean this switching?
John 3:19
That sounds okay. I think for the Core Web Vitals side, the CLS side, that’s something you can test where you try it in one way or the other way. With regards to indexing, what is important is that we have information about the images on those pages. So what you can do if you’re not sure if your Lazy loading is recognized by Google is use the image structured data. So kind of on the pages themselves, give us the structure data for those images. And then we can definitely pick that up.
SEO Professional 2 4:03
Okay, in such a setup, will the Google algorithm understand that there is a meaningful, possibly even useful image and not just a gray square?
John 4:17
I don’t think we care, to be quite honest. So I don’t think that for web search, we look at the specific images on the page and say, Oh, this is a nice image and this is a boring image. We basically use those images in image search. And that’s, that’s where we care what the content of the images are. But within web search, we don’t really care if it’s a gray square or if it’s a picture of a beach.
SEO Professional 2 4:47
Ah, okay. And also I wanted to ask is it okay in general not to use the SRC at all and instead use only the data SRC attribute? Do you like recognize and–well, not recognize–but use this attribute for indexing pages or images?
John 5:11
I don’t think we use it by default. But if it loads with lazy loading as an image element on the page, then we can pick that up. And if you use the structure data or an image sitemap, we can also pick that up. So it’s not by default where you would use the data SRC, but we use what ends up being rendered on the page.
