가이드 목록무료 상담 →

홈페이지 이미지 용량 기준과 변환 방법

#셀프 트러블슈팅2026.08.09노아 편집팀

같은 사진 한 장 — 촬영 원본 8MB, 웹용 변환본 200KB.

화면에서 보이는 화질 차이는 거의 없고, 로딩 시간 차이는 몇 초 단위입니다.

이 글은 용도별 권장 해상도·용량표와 무료 변환 도구 사용 절차를 안내드립니다.

⚡ 3줄 요약

  • 기준은 용도별로 다릅니다. 메인 배너 200~400KB, 본문 이미지 100~200KB, 썸네일 50KB 이하입니다.
  • 형식은 WebP를 권장합니다. 같은 화질에서 JPG보다 용량이 25~34% 작다는 것이 구글의 공식 수치입니다.
  • 변환은 무료 도구로 충분합니다. 품질 75~80 설정이면 화면에서 원본과 구분이 어렵습니다.

홈페이지 이미지는 몇 KB가 적당한가요?

메인 이미지는 200~400KB, 본문 이미지는 100~200KB, 썸네일은 50KB 이하가 기준입니다. 형식은 같은 화질에서 JPG보다 25~34% 가벼운 WebP를 권장합니다. 촬영 원본 3~8MB를 그대로 올리는 것이 속도 저하의 가장 흔한 원인입니다.

용량 기준이 필요한 이유는 모바일 회선 때문입니다. 8MB 사진 5장이 올라간 페이지는 총 40MB로, LTE 환경에서 수 초 이상 걸립니다. 같은 페이지를 장당 200KB로 바꾸면 총 1MB가 되어 로딩이 1초 안팎으로 줄어듭니다. 화면에 표시되는 크기는 어차피 가로 1000~2000px 수준이라, 그 이상의 해상도는 화질이 아니라 용량만 남깁니다.

용도별 용량 기준은 어떻게 되나요?

표의 기준은 절대 규칙이 아니라 출발점입니다. 사진 중심의 포트폴리오 사이트라면 본문 이미지를 300KB까지 허용하되 장수를 줄이고, 텍스트 중심 사이트라면 더 낮춰도 됩니다. 원칙은 하나입니다. 페이지 전체 용량을 3MB 이내로 관리하면 모바일에서도 로딩 체감이 무너지지 않습니다.

용도별 권장 해상도·용량 기준
용도권장 가로폭권장 용량권장 형식
메인 배너·전면 이미지1920px200~400KBWebP
본문·소개 이미지1200px100~200KBWebP 또는 JPG
목록 썸네일400~600px50KB 이하WebP
로고·아이콘벡터수십 KBSVG
투명 배경 이미지용도에 맞게가급적 100KB 이하WebP 또는 PNG

WebP 변환은 어떻게 하나요?

구글이 만든 무료 웹 도구 Squoosh(squoosh.app)를 쓰면 설치 없이 브라우저에서 변환됩니다. 이미지를 끌어다 놓고 형식을 WebP로, 품질을 75~80으로 설정하면 변환 전후 화면을 나란히 비교하며 용량을 확인할 수 있습니다. 품질 75~80 구간이 화질과 용량의 균형점입니다.

변환 전에 해상도부터 줄이는 것이 순서입니다. 가로 4000px 원본을 품질만 낮추면 한계가 있지만, 표의 권장 폭(1200~1920px)으로 리사이즈한 뒤 변환하면 용량이 10분의 1 이하로 줄어드는 경우가 많습니다. 원본은 별도 폴더에 보관하고 홈페이지에는 변환본만 올립니다.

변환 작업은 어떤 순서로 하나요?

교체는 용량이 큰 이미지부터 합니다. 관리자 화면이나 PageSpeed 결과의 이미지 항목에서 용량 상위 10장을 먼저 처리하면, 전체를 다 바꾸지 않아도 체감 개선의 대부분을 얻습니다. 사진 10장 기준으로 백업부터 재측정까지 걸리는 시간은 30분~1시간 수준입니다.

  1. 원본 사진을 별도 폴더에 백업합니다.
  2. 용도에 맞는 가로폭(1920·1200·400px)으로 리사이즈합니다.
  3. Squoosh에서 WebP·품질 75~80으로 변환합니다.
  4. 변환본이 용량 기준(메인 400KB 이하 등)에 드는지 확인합니다.
  5. 홈페이지의 기존 이미지를 변환본으로 교체합니다.
  6. PageSpeed Insights를 재측정해 LCP 변화를 확인합니다.

그래서 지금 무엇부터 하면 되나요?

오늘 할 것
  • 내 홈페이지 메인 이미지 1장의 용량을 확인하고 400KB와 비교합니다.
이번 주 할 것
  • 용량 상위 10장을 리사이즈·WebP 변환해 교체하고 PageSpeed로 전후를 비교합니다.
맡길 것
  • 이미지가 100장 이상이면 일괄 변환을 제작사나 외주에 맡기고, 용도별 용량 기준표를 작업 기준으로 전달합니다.

자주 묻는 질문

PNG·JPG·WebP 중 무엇을 쓰나요?
사진은 WebP, 로고와 아이콘은 SVG가 기준입니다. WebP는 같은 화질에서 JPG보다 25~34% 가볍고 투명 배경도 지원하므로 PNG의 자리까지 대체합니다. 오래된 브라우저 대응이 걱정이라면 JPG를 예비로 두는 방법도 있습니다.
이미 올린 이미지도 전부 바꿔야 하나요?
전부는 아닙니다. 방문이 많은 메인·랜딩 페이지의 용량 상위 10장부터 바꾸면 체감 개선의 대부분을 얻습니다. 나머지는 새 콘텐츠를 올릴 때부터 기준을 적용하는 방식으로 점진 전환하면 작업 부담이 줄어듭니다.
용량을 줄이면 화질이 나빠지지 않나요?
품질 75~80으로 변환하면 일반 화면에서 원본과 구분이 어렵습니다. 화면에 가로 1200px로 표시되는 이미지에 4000px 원본을 쓰는 것은 화질 향상이 아니라 용량 낭비입니다. 변환 도구의 좌우 비교 화면으로 직접 확인하고 결정하면 됩니다.

NOAH가 이 문제를 없애는 방식

NOAH는 검증된 템플릿 구조를 사장님 브랜드에 맞춰 7일 안에 오픈하는 홈페이지 제작 서비스입니다. 사장님이 주신 사진을 웹 기준 용량으로 정리해 적용하므로 원본 그대로 올라가 느려지는 문제를 만들지 않고, 쓸 사진이 부족하면 AI 이미지 10장 이상을 ₩50,000 옵션으로 채울 수 있습니다. 기본 ₩199,000이며 부가세는 별도입니다. 지금 사이트가 무거운지 궁금하시면 주소만 보내 주셔도 상담에서 용량 상위 이미지를 무료로 짚어 드립니다. 결정은 그 뒤에 하셔도 됩니다.

무료 상담 신청 →

참고 자료 — PageSpeed Insights · 구글 검색 센터 문서