이미지 용량 줄이는 법 5가지 — 블로그·쇼핑몰 로딩 속도 개선

페이지가 3초 안에 안 뜨면 방문자 절반이 떠납니다. 그 원인의 대부분은 '무거운 이미지'입니다.

1) 표시 크기에 맞게 리사이즈

4000px 원본을 800px 영역에 그대로 넣는 건 낭비입니다. 실제 표시 폭에 맞춰 리사이즈만 해도 용량이 절반 이하로 떨어집니다.

2) 압축으로 마무리

리사이즈 후 품질 80% 압축을 더하면 눈에 안 띄게 용량이 또 줄어듭니다. 목표 용량(예: 200KB)을 정해두고 맞추면 편합니다.

3) WebP로 변환

같은 화질에서 더 가벼운 WebP로 바꾸면 추가로 25~35%를 아낄 수 있습니다.

4) 지연 로딩 & 5) 불필요한 이미지 정리

화면에 보일 때 불러오는 지연 로딩(lazy loading)과, 장식용 큰 이미지를 줄이는 것만으로도 체감 속도가 크게 개선됩니다.

본 글의 일부 링크는 제휴(스폰서) 링크이며, 이용자 추가 비용 없이 소정의 수수료가 발생할 수 있습니다.