JPG는 잊어라! WebP보다 50% 더 가벼운 ‘AVIF’로 사이트 속도 날개 달기

안녕하세요! 1kb의 용량도 용납하지 않는 속도 집착남, SEO 디렉터입니다.

블로그 로딩 속도를 잡아먹는 가장 큰 원흉은 언제나 **’이미지’**입니다. 그래서 우리는 무거운 JPG나 PNG 대신 구글이 권장하는 **’WebP(웹피)’**를 열심히 써왔죠.

그런데 2025년 현재, 구글의 눈높이가 더 높아졌습니다. “WebP도 좋지만, 더 가벼운 거 없어?”

네, 있습니다. 바로 넷플릭스와 구글이 주도해서 만든 차세대 이미지 표준, **AVIF(AV1 Image File Format)**입니다.

1. AVIF, 도대체 얼마나 대단한가? (압축률 비교)

백문이 불여일견, 데이터로 증명합니다. 같은 고화질 사진을 각 포맷으로 저장했을 때 용량 차이는 다음과 같습니다.

포맷용량 (예시)화질 유지력비고
JPG100 KB낮음구형 표준. 압축 시 깍두기 현상 심함.
WebP60 KB높음현재 표준. JPG 대비 약 40% 절감.
AVIF30 KB매우 높음차세대 표준. WebP 대비 추가 50% 절감.

AVIF는 최신 동영상 압축 기술(AV1 코덱)을 이미지에 적용한 것입니다. 그래서 WebP보다 훨씬 더 작게 압축하면서도, 뭉개짐 없이 선명한 화질을 유지합니다. 심지어 HDR 같은 풍부한 색감 표현도 가능합니다.

2. 왜 지금 AVIF로 넘어가야 하는가?

A. 사이트 속도 혁명 (LCP 개선)

이미지 용량이 절반으로 줄면, 다운로드 속도는 2배 빨라집니다. 이는 구글의 핵심 속도 지표인 LCP(최대 콘텐츠 풀 페인트) 점수를 비약적으로 향상시킵니다.

B. 브라우저 호환성 문제 해결

“좋은 건 알겠는데, 아이폰에서 안 보이면 어쩌죠?” 걱정 마세요. 2024년을 기점으로 크롬, 파이어폭스는 물론, 애플의 사파리(Safari)까지 AVIF를 공식 지원하기 시작했습니다. 전 세계 브라우저의 90% 이상이 이미 준비되었습니다.

3. 워드프레스에 AVIF 도입하는 실전 가이드

Step 1. 서버 환경 확인 (호스팅 설정)

AVIF는 최신 기술이라 서버가 받쳐줘야 합니다.

  • PHP 버전: 8.1 이상을 권장합니다.
  • 이미지 라이브러리: 서버에 Imagick 또는 GD 라이브러리가 최신 버전으로 설치되어 있어야 AVIF 처리가 가능합니다. (대부분의 최신 호스팅은 지원하지만, 안 된다면 호스팅 사에 문의해야 합니다.)

Step 2. 워드프레스 6.5 이상 업데이트

워드프레스 6.5 버전부터 AVIF 업로드 공식 지원이 시작되었습니다. 이제 미디어 라이브러리에 .avif 파일을 직접 올릴 수 있습니다.

Step 3. 플러그인으로 ‘자동 변환’ 및 ‘방어 코드’ 구축 (가장 중요)

우리는 JPG로 이미지를 올리면 자동으로 AVIF로 변환해주고, AVIF를 못 보는 구형 브라우저 사용자에게는 JPG를 대신 보여주는(Fallback) 똑똑한 시스템이 필요합니다.

  • 추천 플러그인:
    • ShortPixel (강추): 가장 강력한 이미지 최적화 플러그인 중 하나입니다. 설정에서 ‘WebP/AVIF 버전 생성’을 체크하면 알아서 다 해줍니다.
    • Imagify, EWWW Image Optimizer: 이들 역시 유료 또는 무료 버전에서 AVIF 변환 기능을 지원합니다.

플러그인을 사용하면 <picture> 태그를 활용해 브라우저가 지원하는 최적의 이미지를 알아서 선택해 보여주므로 호환성 걱정이 완벽하게 사라집니다.


💡 실제 경험담

“제 여행 블로그는 고화질 사진이 많아서 항상 로딩이 느렸습니다. WebP 플러그인을 쓰고 있었지만, 모바일 속도 점수는 70점대에 머물렀죠.

최근에 서버 PHP 버전을 8.2로 올리고, 사용 중이던 플러그인(ShortPixel)에서 ‘AVIF 생성’ 옵션을 활성화했습니다. 그리고 기존 이미지들을 일괄 변환(Bulk Optimization) 돌렸죠.

결과는 충격적이었습니다. 메인 페이지 전체 용량이 3MB에서 1.2MB로 줄었고, LCP 시간이 2.5초에서 1.2초로 단축되었습니다. 속도 점수는 90점대(초록색)로 진입했고요. 눈으로 보기엔 화질 차이가 전혀 없는데 용량만 반토막이 난 겁니다. 이건 안 쓰면 손해입니다.”


❓ 자주 묻는 질문 (FAQ)

Q1. 포토샵에서 AVIF로 저장이 안 되는데요?

A. 아직 많은 이미지 편집 프로그램이 AVIF 저장을 기본 지원하지 않습니다. 별도의 플러그인을 설치하거나, ‘Squoosh.app’ 같은 온라인 변환 사이트를 이용해야 합니다. 하지만 가장 편한 건 워드프레스에 JPG로 올리고 플러그인이 자동으로 변환하게 하는 것입니다.

Q2. 변환하는 데 비용이 드나요?

A. AVIF 포맷 자체는 오픈 소스라 무료지만, 서버에서 이미지를 변환할 때 CPU 자원을 많이 씁니다. 그래서 이미지 최적화 플러그인들은 WebP 변환보다 AVIF 변환에 더 많은 크레딧을 요구하거나 유료 플랜 가입을 유도하는 경우가 많습니다.

Q3. 기존 WebP 이미지는 어떻게 하나요?

A. 굳이 WebP를 AVIF로 다시 바꿀 필요는 없습니다. 하지만 원본(JPG/PNG)이 서버에 남아있다면, 플러그인의 일괄 작업 기능을 통해 AVIF 버전을 추가로 생성하는 것이 좋습니다.


결론

WebP의 시대는 저물고, AVIF의 시대가 왔습니다. 이는 단순한 유행이 아니라 웹 표준의 진화입니다. 더 적은 데이터로 더 좋은 화질을 보여주는 것, 그것이 2025년 사용자에게 제공할 수 있는 최고의 배려이자 가장 강력한 SEO 전략입니다.

댓글 남기기