Next.js Discord

Discord Forum

Framer motion negative impact on SEO?

Answered
Slender-billed Curlew posted this in #help-forum
Open in Discord
Avatar
Slender-billed CurlewOP
Hello, anyone knows if using next.js with framer motion and setting the initial opacity to 0, will negatively impact the SEO? The co

<motion.div 
  className="md:w-1/2"
  initial={{ opacity: 0, y: 50 }}
  animate={isInView ? { opacity: 1, y: 0 } : { opacity: 0, y: 50 }}
  transition={{ duration: 0.8, delay: 0.4 }}
>
</motion.div>

Also does it have the same impact as doing this?
animate={isInView ? "visible" : "hidden"}

Text content is still rendered in the initial HTML, but not visible.
Answered by B33fb0n3
take a look at your network request (the request for the SSR page).
Do you see your content there?
If yes: there should be no impact for your SEO
If no: there is an impact for your SEO

If you want to test it, run lighthouse to see your SEO score. It's not very trustworthy, but a good way to orient yourself. You get a better result from: https://pagespeed.web.dev/
View full answer

7 Replies

Avatar
take a look at your network request (the request for the SSR page).
Do you see your content there?
If yes: there should be no impact for your SEO
If no: there is an impact for your SEO

If you want to test it, run lighthouse to see your SEO score. It's not very trustworthy, but a good way to orient yourself. You get a better result from: https://pagespeed.web.dev/
Answer
Avatar
Slender-billed CurlewOP
Well, I see something like this. It's not rendered, but when I switch to raw, I can find the text there.
Image
Avatar
to raw, I can find the text there
then there should be no impact for your SEO, cause google normally won't render your site and see's the raw content
Avatar
Slender-billed CurlewOP
Okay, because I red somewhere that google tends to ignore content with opacity 0. But that was quite old.

Thanm you!
Avatar
at the end nobody knows what's inside the blackbox of google right now. We can just test and see what works better 🤷‍♂️
happy to help