한눈에 보는 정의
웹페이지에 올린 이미지 파일이 차지하는 데이터 크기. 클수록 페이지가 늦게 뜬다.
이런 말로 들어요
- 메인 사진이 10MB라 첫 화면이 늦게 떠요. 줄여서 다시 올릴게요.
- 원본은 보관하고 웹용은 WebP로 따로 만들게요.
그림으로 보기
화면 크기에 맞춰 줄이고 WebP로 바꾸면 용량이 크게 줄어 페이지가 빨리 뜹니다. 숫자는 예시입니다.
하캄솔루션 자체 제작 설명도식자세히 알아보기
휴대폰 원본 사진은 한 장에 수 MB인 경우가 많습니다. 그대로 올리면 모바일 데이터와 로딩 시간이 늘어 방문자가 떠나기 쉽습니다. 화면에 필요한 크기로 줄이고 WebP 같은 효율적인 형식으로 바꾸면 화질 차이를 거의 느끼지 않으면서 용량을 크게 줄일 수 있습니다.
실무 예시
예를 들어 가로 4,000픽셀 원본 사진을 화면 표시 폭에 맞춰 줄이고 WebP로 바꾸면, 같은 화면에서 용량이 수십 분의 일로 줄어드는 경우가 흔합니다.
함께 살펴볼 점
너무 많이 압축하면 얼굴·글자가 뭉개집니다. 원본은 따로 보관하고 웹용 사본만 줄입니다. 이미지 속 글자는 검색엔진이 읽기 어려우니 중요한 문구는 본문 텍스트로 씁니다.
AI에게 이렇게 요청해 보세요
이 폴더 이미지들을 가로 1600px 이하 WebP(품질 80)로 변환하고, 원본은 그대로 두고 변환 전후 용량 표를 만들어 줘.
코딩·작성 도구에 붙여 쓰기 전에 내 상황에 맞게 바꾸고, 결과는 직접 확인하세요.출처와 검토 정보
- Choose the right image format | web.dev 새 창
web.dev에서 이미지 형식 선택(래스터 형식 PNG·JPEG·WebP·AVIF 등) 기준을 확인했습니다.
자료 확인 - Learn Images | web.dev 새 창
웹 이미지 최적화 학습 과정의 존재와 범위를 확인했습니다.
자료 확인
내용 검토
최초 발행 · 내용 수정