nuxt / image

Plug-and-play image optimization for Nuxt applications.
https://image.nuxt.com
MIT License
1.34k stars 270 forks source link

static placeholder and seo #1115

Open djixadin opened 11 months ago

djixadin commented 11 months ago

this is more of a question and less so an issue.. when specifying static placeholder image from public folder as a placeholder the html that is generated has that image as a src for the image as the onMounted fires it changes the image source to a proper one.. its my understanding that this affects SEO poorly and is there some workaround for this ?

bernhardberger commented 10 months ago

you can do your own "placeholder" image:

<NuxtImg
src="your-source.jpg"
style="`background-image:url(${ $img(src: 'your-source.jpg', {w: 10, q: 70}) }`; background-repeat: no-repeat; background-size: cover" />

..and then use useHead() to add that generated background image to preload.