이미지 최적화는 웹 페이지 로딩 속도에 직접적인 영향을 미칩니다. 검색 엔진은 사용자 경험을 중요시하기 때문에 로딩 속도가 빠른 웹 페이지를 선호합니다. 하지만 최적화가 되지 않은 이미지를 사용하면 로딩 속도가 오래 걸려 검색 결과에서 낮은 순위를 받을 수 있습니다. 높은 순위를 얻기 위해 부정적인 영향을 받지 않으면서 로딩 속도를 향상하는 방법에 대해 알아보겠습니다.

3-3-1. 이미지 사이즈 조절

사이트에 적용되는 이미지의 크기는 고유 크기와 사이트에 보여주기 위해 렌더링 된 크기가 다를 수 있습니다. 고유 크기와 렌더링 된 크기의 차이가 클수록 이미지 로딩 시간이 길어져 ****검색 엔진 평가에서 불리한 요소로 작용할 수 있습니다. 고유 크기와 렌더링 된 크기의 차이가 2배 이하인 경우가 적절합니다. 이미지의 가로와 세로 크기를 줄이면 이미지의 용량이 줄어들고 로딩 속도가 줄어듭니다.

고유 크기가 렌더링 된 크기의 2배인 경우

고유 크기가 렌더링 된 크기의 2배인 경우

3-3-2. 이미지 포맷(format) 설정

이미지를 내려받을 때 선택하는 것이 파일 포맷입니다. 이미지 포맷디지털 이미지 파일을 저장하고 전송하기 위해 사용되는 파일 형식입니다. 올바른 포맷 설정은 검색 엔진에서 이미지를 인식하고 색인화하는 데 도움을 줄 수 있으며 평가에서 로딩 속도와 관련된 요소에서 이점을 얻을 수 있습니다.

① 이미지 포맷의 유형

각각의 포맷들은 고유한 특징을 가지고 있습니다. 각 파일 포맷에 따라 이미지 품질과 파일 크기가 달라지기 때문에 이미지의 목적과 특성에 맞는 적절한 포맷을 선택해야 합니다. 다양한 이미지 포맷의 유형이 있지만 가장 일반적으로 사용되는 이미지 포맷은 다음과 같습니다.

JPEG PNG GIF
압축 방식 손실 무손실 무손실
애니메이션 미지원 미지원 지원
투명 미지원 지원 미지원
지원 브라우저 모든 브라우저 모든 브라우저 모든 브라우저

무손실 압축 VS 손실 압축

무손실 압축과 손실 압축은 이미지 압축 방법 중 주요한 접근 방식으로 상황과 목표에 따라 선택해야 합니다. 선택 기준으로는 이미지의 품질, 로딩 속도 및 사용자 경험 등 여러 요소가 있습니다.

③ 최대한 저용량으로 저장할 수 있는 이미지 포맷

이미지 포맷 형식에 따라 이미지의 압축 용량이 달라집니다. 이미지의 파일 크기를 줄이고 이미지 품질을 유지하는 대표적인 이미지 포맷으로는 JPEG 2000, JPEG XR, WebP이 있습니다. 이미지 용량을 최대한 작게 유지하여 전송하는 것이 웹 페이지의 로딩 속도를 향상하는 데 도움이 됩니다.