홈페이지를 만들 때 "사진을 크고 예쁘게 쓰고 싶다"는 요청이 많습니다. 당연히 좋은 사진은 홈페이지 퀄리티를 높입니다. 그런데 최적화 없이 원본 사진을 그대로 올리면 파일 크기가 수 MB에 달해 로딩 속도가 치명적으로 느려집니다. 잘 최적화된 이미지는 화질 손실 없이 파일 크기를 80% 이상 줄일 수 있습니다.

01

이미지 파일 포맷 선택

WebP
권장 포맷
구글이 만든 차세대 이미지 포맷. JPEG보다 25~35% 더 작은 파일 크기로 동일한 화질을 냅니다. 현재 모든 주요 브라우저에서 지원합니다. 홈페이지 이미지의 기본 포맷으로 WebP를 사용하세요.
JPEG
사진 일반
사진에 가장 널리 쓰이는 포맷. WebP를 지원하지 않는 환경을 위한 폴백으로 사용합니다. 품질 80~85%로 압축하면 육안으로 차이가 거의 없으면서 파일 크기를 크게 줄일 수 있습니다.
PNG
투명 배경
투명 배경이 필요한 로고, 아이콘, 그래픽에 사용합니다. 파일 크기가 JPEG보다 크므로 사진에는 사용하지 마세요. 투명도가 필요 없는 이미지라면 JPEG나 WebP가 훨씬 효율적입니다.
02

이미지 크기와 압축

업로드 전에 크기를 줄여야 한다

스마트폰이나 카메라로 찍은 원본 사진은 보통 3,000~6,000px 너비에 5~20MB 크기입니다. 홈페이지에서 전체 너비로 표시되는 이미지도 1,920px이면 충분합니다. 원본을 그대로 올리면 브라우저가 작게 표시하더라도 큰 파일을 모두 다운로드해야 하므로 느려집니다. 업로드 전에 반드시 크기를 줄이세요.

권장 이미지 크기 기준

무료 압축 도구

Squoosh(squoosh.app)는 구글이 만든 무료 이미지 압축 도구입니다. 브라우저에서 바로 사용할 수 있고, WebP 변환과 품질 조정이 직관적입니다. TinyPNG(tinypng.com)는 PNG와 JPEG 압축에 특화되어 있고, 드래그앤드롭으로 간편하게 사용할 수 있습니다. 아임웹, Wix, 카페24는 이미지 업로드 시 자동 압축 기능을 제공하기도 하지만, 업로드 전에 직접 압축하는 것이 더 효과적입니다.

03

alt 텍스트 — SEO와 접근성 동시에

alt 텍스트가 하는 두 가지 역할

이미지의 alt(대체 텍스트) 속성은 이미지가 로드되지 않을 때 표시되는 텍스트이자, 구글이 이미지 내용을 이해하는 근거입니다. alt 텍스트를 제대로 작성하면 구글 이미지 검색에서 노출될 수 있고, 시각 장애인을 위한 스크린 리더도 이 텍스트를 읽어 접근성이 높아집니다.

좋은 alt 텍스트 작성법

이미지가 무엇을 보여주는지 간결하고 구체적으로 설명하되, 자연스럽게 SEO 키워드를 포함시키세요. "image001.jpg"나 "사진"처럼 의미 없는 alt는 쓰지 마세요. "강남 필라테스 스튜디오 소그룹 수업 모습"처럼 장소, 서비스, 상황을 담은 설명이 이상적입니다. 장식용 이미지(배경 패턴 등)는 alt=""로 비워두는 것이 올바른 방법입니다.

아임웹, Wix, 카페24 모두 이미지 업로드 시 alt 텍스트를 입력할 수 있습니다. 홈페이지에 이미지를 올릴 때 alt 입력을 습관화하세요. 한 번 작성해두면 SEO 효과가 장기적으로 쌓입니다. 특히 뷰티샵, 인테리어, 음식점처럼 이미지 검색으로 발견되는 업종에서 이미지 alt는 매우 중요합니다.

04

이미지 파일명도 SEO에 영향을 준다

의미 있는 파일명을 쓰자

카메라에서 나오는 "IMG_4523.jpg"나 "DSC_0012.jpg" 같은 파일명은 구글이 이미지 내용을 파악하는 데 도움이 되지 않습니다. 업로드 전에 파일명을 "gangnam-pilates-class.jpg"나 "강남-필라테스-수업.jpg"처럼 내용을 설명하는 이름으로 바꾸세요. 영문 파일명이 한글보다 SEO에 조금 더 유리합니다.