Archived topic

Avoid Large Layout shifts

5 replies · Started by Matias on January 21, 2021

Viewing posts 1–6 of 6

January 21, 2021 at 1:41 am #1627341

Hi all.
Im getting an Avoid Large layout shifts issues in Pagespeed insight and Gtmetrix in my website.
These DOM elements contribute most to the CLS of the page.

The 5 issues are from Elements Hook in home, nav menu, text in sidebar and load more post buttom.
How can I fix them?
Thanks

January 21, 2021 at 3:01 am #1627425

Hi there,

looks like the two most common issues we see:

1. The Logo is being Lazy Loaded, most lazy loaders provide an option to exclude images using a CSS Class - you can use is-logo-image

2. You have Critical CSS enabled on your site, unless you know how to manually write Critical CSS then you should disable this option.

January 21, 2021 at 3:35 am #1627480

Thanks for the answer
Where I disable critical css. Im using WP Rocket Plugin.
Should I disable any options in plugins?
Thanks

January 21, 2021 at 3:59 am #1627514

Its in the WP Rocket settings - see here:

https://docs.wp-rocket.me/article/1266-optimize-css-delivery

Its the Optimize CSS delivery option you want to disable.

January 21, 2021 at 4:28 am #1627547

Thank again
Im going to read it

January 21, 2021 at 6:04 am #1627642

You're welcome

This archived topic is closed to new replies.

Start building better websites today.