Using Slider stack and preventing Cumulative Layout Shift (CLS)?

Hi everyone,

I just received word from our “SEO tech” that Google is dinging our page score for Cumulative Layout Shift (CLS) resulting from the use of the Slider with its movement up and down of various slides and the nav dots that are visible at the bottom (i.e. the testimonial content in each slide is of different length)

Has anyone else experienced this and if so, what was your fix?

My skills are very basic when it comes to code.

I’m exploring a few workarounds as I’d like to continue using the slider –

• Use only testimonials that are approximate in same length

• Use the Banner stack in each “Content” slide with the same fixed height for all

• Use a “Container” in each “Content” slide and hide the nav dots

I’m just curious if anyone else has other fixes.

Thanks so much for any input.

There is a stack called Equalize in Foundry which you can use for this:
https://foundry.elixirgraphics.com/documentation/equalize/

3 Likes

Thank you @Fuellemann (Jan). I completely forgot about that stack and feel foolish I even asked this question. Again, thanks!