How much impact do CSS pseudo elements as overlays that cover the whole page on page load have on SEO?

Question

I have created a page transition where on page load for the fraction of a second a whole page is covered with a CSS pseudo element, which then transitions to go into the background.

Do search engines have troubles reading data? Or are there any other negative side effects of this?

Answer 1

The most probable impact would be to your CLS (Content Layout Shift). It's a metric that Google uses to determine how much a page changes once content is visible.

If your CLS is too elevated, search engines may rank you lower.

Try a few validators to check if your website is affected:

• https://web.dev/measure/
• https://pagespeed.web.dev/
• https://gtmetrix.com/