---
title: "Discussion on \"How to prevent Cumulative Layout Shift for responsive images\" | Hashnode"
description: "Discussion on \"How to prevent Cumulative Layout Shift for responsive images\". Core Web Vitals"
url: "https://hashnode.com/posts/how-to-prevent-cumulative-layout-shift-for-responsive-images/6299cbf0699a8b2370161774"
---

[Feed](https://hashnode.com/feed) /

Discussion

# [How to prevent Cumulative Layout Shift for responsive images](https://blog.jankoritak.com/how-to-prevent-cumulative-layout-shift-for-responsive-images?utm_source=hashnode&utm_medium=feed)

Core Web Vitals

Jun 3, 2022 · 4 min read · blog.jankoritak.com  
Updated Jun 2  
Read the article

-   [#web-development](https://hashnode.com/tag/web-development)
-   [#css](https://hashnode.com/tag/css)
-   [#html5](https://hashnode.com/tag/html5)
-   [#core-web-vitals](https://hashnode.com/tag/core-web-vitals)

## Written by

[Jan Koriťák](https://hashnode.com/@jankoritak)

@jankoritak · Brno, Czech Republic

  
[View profile](https://hashnode.com/@jankoritak)

Tech-Lead @webscope.io - React, Next.js

Hi, I'm Jan. I'm a Tech-Lead @webscopeio and I'm taking a leap into the startup world with hire.dev app. I spend most of my time in front-end engineering. When I'm not programming, I work on hire.dev app. I'm active daily on Twitter @jankoritak! See you there!

## Responses 3

Markdown supported · ⌘↵ to post

[Victor Eke](https://hashnode.com/@Eke)

[Jun 4, 2022](https://hashnode.com/posts/how-to-prevent-cumulative-layout-shift-for-responsive-images/6299cbf0699a8b2370161774/comment/629abd9af3e81428fc18959a)

Lol. I never knew there was an `aspect-ratio` property in CSS, This is a great article. Thanks for sharing [Jan Koriťák](https://hashnode.com/@jankoritak). 😅

[Rajesh Khadka](https://hashnode.com/@rajeshkhadka)

[Jun 3, 2022](https://hashnode.com/posts/how-to-prevent-cumulative-layout-shift-for-responsive-images/6299cbf0699a8b2370161774/comment/629a6427b9e64a289701ca77)

loved it 🩸❤

[Diego Ballesteros (Relatable Code)](https://hashnode.com/@diegoballesteros)

[Jun 3, 2022](https://hashnode.com/posts/how-to-prevent-cumulative-layout-shift-for-responsive-images/6299cbf0699a8b2370161774/comment/629a172c3096cc2656dfb364)

Nice breakdown Jan. Thanks for sharing. This can have significant benefits for all users and is usually not too difficult to solve.

[Jan Koriťák](https://hashnode.com/@jankoritak)

[Jun 3, 2022](https://hashnode.com/posts/how-to-prevent-cumulative-layout-shift-for-responsive-images/6299cbf0699a8b2370161774/comment/629a172c3096cc2656dfb364#reply-629a232ba7681524f75bdc3f)

Thanks [Diego Ballesteros (Relatable Code)](https://hashnode.com/@diegoballesteros)!

Most of the Core Web Vitals concepts are simple in nature but can get tedious to address if the developer encounters them for the first time.

I'll try to dissect as many of them as I can, one by one, and share my findings along the way.

Hope you'll find the upcoming posts also useful.