블로그 이미지 최적화 완벽 가이드

사진 한 장이 페이지 로딩을 몇 초씩 늦춥니다. 이미지 최적화는 방문자 이탈을 줄이고 검색 순위에도 영향을 주는, 블로그 운영의 기본기입니다. 이 글에서는 크기·용량·형식 세 가지를 어떻게 맞춰야 하는지 순서대로 정리합니다.

광고 영역

왜 이미지 최적화가 중요한가

웹페이지 용량의 절반 이상은 대개 이미지가 차지합니다. 스마트폰으로 찍은 사진은 한 장에 3~8MB에 달하는데, 이걸 그대로 여러 장 올리면 모바일에서 페이지가 열리는 데 수 초가 걸립니다. 방문자는 3초만 느려도 상당수가 뒤로가기를 누릅니다. 또 구글·네이버는 페이지 로딩 속도를 검색 평가 요소로 보기 때문에, 무거운 이미지는 검색 노출에도 불리합니다.

반대로 이미지를 잘 최적화하면 같은 사진이라도 용량이 5분의 1 이하로 줄고, 화면에서 보이는 화질은 거의 그대로입니다. 결국 "눈에 안 보이는 낭비"를 걷어내는 작업입니다.

최적화의 세 가지 축

1) 크기(픽셀) — 게시 위치에 맞추기

가장 먼저 할 일은 픽셀 크기를 줄이는 것입니다. 4000px짜리 원본을 900px 폭으로만 보여주면서 원본을 그대로 올리는 것은 낭비입니다. 게시 위치의 실제 표시 폭에 맞춰 리사이즈하세요. 네이버 블로그 본문은 가로 900px 안팎, 티스토리·워드프레스는 700~800px, 인스타그램은 1080px가 기준입니다.

2) 용량 — 품질 압축

크기를 맞춘 뒤에는 압축으로 용량을 줄입니다. 사진은 품질 70~80%에서 눈에 띄는 손실 없이 용량이 절반 이하로 줄어듭니다. 품질을 50% 아래로 내리면 얼룩(노이즈)이 보이기 시작하니 그 선은 넘지 마세요.

3) 형식 — 사진은 WebP 또는 JPG

같은 이미지라도 형식에 따라 용량이 다릅니다. 사진은 JPG가 기본이고, 요즘은 WebP가 같은 화질에서 20~30% 더 작아 웹 게시에 가장 유리합니다. 투명 배경이 필요한 로고·아이콘만 PNG를 쓰세요.

실전: 순서대로 하면 됩니다

  1. 크기 줄이기이미지 크기 변경으로 게시 폭(예: 900px)에 맞춤.
  2. 압축하기이미지 압축에서 WebP 75% 정도로 저장.
  3. 여러 장이면 한 번에일괄 압축으로 폴더째 처리.

순서가 중요합니다. 먼저 크기를 줄이고 그다음 압축하면, 두 효과가 겹쳐 용량이 가장 크게 줄어듭니다.

흔한 실수

업로드 전 체크리스트