SEO Problem: Images will never be indexed

[thomas4Bitcraft]

I just found out that in the PageSource itself all images have this format:

<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" width="90" height="90" alt="" loading="lazy">

That is a total disaster for all SEO Crawlers as they will never index any of the images on the site. Why not just display the image-url with /_ipx/ in the front?

[shadow81627]

If an image is small enough it will be inlined like you mentioned above.

url-loader allows you to conditionally inline files as base64 data URLs if they are smaller than a given threshold. This can reduce the number of HTTP requests for trivial files. If a file is larger than the threshold, it automatically falls back to file-loader.

https://nuxtjs.org/docs/2.x/directory-structure/assets/

[thomas4Bitcraft]

@shadow81627 Thank you for your response. The problem is, that it is not small enough - and all images get the same base64 String. You can have a look here:

https://www.dogbible.com/en

and here:
view-source:https://www.dogbible.com/en

[shadow81627]

@thomas4Bitcraft that is an awesome site. I think the img src is being set to a small inline image because of lazy loading you can see the inline image in the lazy mixin. You could try eager loading the images to see if the full image url is used.

[tanc]

@thomas4Bitcraft as @shadow81627 says it is due to lazy loading. I have the same on my lazy loaded (loading="lazy") images but not on my 'normally' non-lazy loaded images, all using NuxtImg component.

[thomas4Bitcraft]

@shadow81627 @tanc you are right - that seems to be the problem. Do you have any ideas how to achieve both? So that google can index the images and at the same time the pagespeed does not crash?

[thomas4Bitcraft]

and by the way: @shadow81627 I'm glad you like it :)

[thomas4Bitcraft]

@danielroe I saw you made a pull request to fix this issue. Any news when this will be published?