이미지와 홈페이지 속도

홈페이지 이미지 용량 줄이는 기준

홈페이지가 늦게 뜨는 이유는 여러 가지입니다. 그중 처음 손보기 쉬운 것은 이미지 용량입니다. 첫 화면에 큰 사진이 여러 장 있으면 방문자는 내용을 보기 전에 나갈 수 있습니다.

모든 이미지를 한 번에 손보려 하지 마십시오. 첫 화면 대표 사진, 상품 사진, 시공 사진부터 줄이면 됩니다.

휴대폰 원본 사진은 그대로 올리기엔 큽니다

휴대폰 사진은 가로 폭이 3000px을 넘는 경우가 많습니다. 홈페이지 화면에서 그 크기가 그대로 필요한 경우는 많지 않습니다. 모바일 방문자가 많다면 더 그렇습니다.

이미지 위치 권장 시작값
첫 화면 큰 사진 너비 1600~2000px
본문 사진 너비 1000~1400px
작은 썸네일 너비 400~800px

WebP는 일반 사진에 먼저 써볼 만합니다

WebP는 사진 용량을 줄이는 데 자주 쓰는 형식입니다. 일반 사진, 제품 사진, 배경 사진은 WebP로 변환해서 비교해보는 것이 좋습니다.

로고처럼 선이 뚜렷하고 투명 배경이 필요한 파일은 PNG가 더 나을 수 있습니다. 사진이 흐려 보이면 품질을 올리면 됩니다.

처음 품질은 80% 근처에서 봅니다

압축 품질은 80~85%부터 확인하십시오. 화면에서 차이가 거의 없는데 용량만 줄었다면 그대로 쓰면 됩니다. 흐려 보이면 품질을 조금 올리십시오.

확인은 모바일에서 해야 합니다

PC에서 괜찮아 보여도 모바일에서는 다르게 보일 수 있습니다. 줄인 뒤에는 휴대폰으로 홈페이지를 열어보고 사진, 글자, 문의 버튼이 함께 잘 보이는지 확인하십시오.

먼저 할 일은 단순합니다. 첫 화면 큰 사진을 줄이고, WebP로 바꾸고, 모바일에서 다시 보면 됩니다.