What is affecting my Cumulative Layout Shift score ?
Unanswered
Jagdterrier posted this in #help-forum
JagdterrierOP
i've been building my portfolio and i decided to host it, however i noticed that im getting a red Cumulative Layout Shift score why is that ? this is the link to my website if someone could tell me what do i have to change to make it better please do.
https://abderrahimbelkacemi.me/
https://abderrahimbelkacemi.me/
6 Replies
Netherland Dwarf
You can use lighthouse
Chrome extension and it will tell you what that is
@Netherland Dwarf Chrome extension and it will tell you what that is
JagdterrierOP
its pointing out to that section where my name loads in, do you think the way its loading like appearing like that is making that issue ? if thats the case what are the downsides of leaving it like that would it impact seo ?
Cumulative shift is when your page shifts around content after its been loaded aka the user can see something on their screen, so like for example an image resizing, text becoming big as the css renders etc.
Its bad cause it causes the page to move around
Its bad cause it causes the page to move around
this is also a major CLS offender: when it loads it shifts the paragraph above it upwards significantly. but yeah just refer to google lighthouse, it will tell you all about this
@joulev this is also a major CLS offender: when it loads it shifts the paragraph above it upwards significantly. but yeah just refer to google lighthouse, it will tell you all about this
JagdterrierOP
yea i fixed it it was because i set the width and hight of the Image componenet to 0 and then i used the style attribute, the right way to do it is to set a fixed width and height, this comes at a tradeoff of responsiveness but i guess its all fixed now, thank you for helping me out!