워드프레스 | 이미지 WebP 용량 압축 플러그인
개요
우리가 사이트를 활용할 때 사용하는 이미지들은 일반적으로 JPG 와 PNG 를 사용합니다. 하드디스크 용량이 점점 늘어남에 따라 1mb정도의 용량은 가벼운 수준으로 보이기 때문입니다.
그러나 온라인 서버에서의 이미지 용량은 100명이 접속했을 때 100mb의 용량을 감당해야 하기에 더욱 가볍게 만들 필요가 있습니다.
특징
구글에서 만든 웹피(Web) 는 기존 이미지 포맷 삼대장(JPG, PNG, GIF) 을 모두 커버할 수 있다는 장점을 가지고 있습니다. 약 20~30%의 용량 압축을 할수 있습니다.
재밌는 점은 단지 무손실 변환을 했을 경우 20~30%의 압축량이지만 만약 WebP 품질 조절을 90으로 맞추어 놓고 렌더링을 진행하면 용량을 기하급수적으로 줄일 수 있습니다.
물론 이미지가 중요한 갤러리나 쇼핑몰의 경우는 무손실을 활용해야 하겠지만 그렇지 않은 경우는 약 70% 이상의 드라마틱한 효과를 확인할 수 있습니다.
크로스브라우징
WebP는 분명 매력적인 서비스임은 변함이 없지만 모든 브라우저에서 정상적으로 노출되는 것은 아닙니다. 다른 브라우저에서 에러 없이 노출되어야 하는 경우 (대형 업체, 공공기관) 의 경우에서는 활용하기가 어려울 수 있다는 문제가 있습니다.
특히나 익스플로러 11에서는 WebP 가 지원되지 않기 때문에 기존 유저들의 점유율 추이를 확인하면서 작업하는 것이 좋습니다.
그러나 익스플로러는 22년 5월 기준 국내 점유율 1.88%을 기록하는 수순이기에 더이상 신경 쓰는 것이 옳은 것인지 고민해볼 필요가 있습니다. 현재 1위는 크롬 71.63% 입니다.
워드프레스 활용방법
<혹시 모를 상황을 대비하기 위해 따라하기 전 백업 한 뒤 진행해주세요>
워드프레스 플러그인 중에서는 WebP Converter 라는 좋은 대안을 소개하고 있습니다. 무료로 이용할 수 있으며, 필요한 경우 최신 압축방식인 AVIF 를 유료로 지원한다고 합니다.
그러나, 아직 많은 브라우저에서 지원하지 않기에 시기상조인 기술로 보입니다.
설치한 다음 설정 > WebP Converter 에 들어오면 위와같은 에러가 뜨게 됩니다.
아파치를 사용중이라면 [여기] 를 통해 .htaccess 파일을 생성하고 해결하세요
NGINX를 사용중이고 rewrites_not_executed 문제를 보고 있다면 [여기] 를 통해 문제를 해결하세요. 그러나 저는 이 기술을 사용하지 않을 것이기 때문에 아래에서 기능을 끄도록 하겠습니다.
저는 압축률 90%에 이미지 모드를 Pass Thru 를 선택하여 진행하였습니다.
Force convert all images again 을 체크하면 기존에 업로드했던 모든 이미지를 강제로 변환한다는 의미입니다. Regenerate All 을 클릭하여 변환작업을 완료합니다.
변환작업이 진행되는 모습입니다. 파일 양이 많아 오래걸리지만 잠시 커피한잔 마시고 오면 해결될 정도의 속도로 진행됩니다. 용량을 자세히 보시면 기존에 비하여 약 80%가 줄어든 것을 확인할 수 있습니다.