WebP 파일이란?

2010년 Google은 온라인 이미지를 줄이기 위해 ‘WebP 파일‘ 포맷을 만들었습니다. 사진의 그래픽과 크기를 줄여 더 빠른 웹사이트 로딩이 가능합니다. 무료로 사용할 수 있는 오픈 소스 파일입니다.

1. WebP 파일 정의

WebP‘는 기존의 PNG 및 JPEG 파일보다 포맷 파일 크기가 작습니다. 확장자 또한 [.WEBP]로 표시되기 때문에 알아보기 쉽습니다. 두 개의 포맷 파일인 PNG와 JPEG 파일을 압축(무손실, 손실압축)해서 웹 사이트의 성능을 높이는데 사용됩니다. 구글 개발자의 말에 따르면 무손실 WebP 이미지는 PNG 포맷보다 최대 26%까지 줄일 수 있다고 합니다.

2. 배경과 용도

WebP는 2010년 온투 테크놀로지스(On2 Technologies)가 구상했으며, 2010년 2월 구글에서 1억 2,460만 달러에 인수 했습니다. On2 의 ‘VP8 기술’은 구글의 WebM 동영상 파일 형식의 핵심 기술이 되었습니다. ‘WebM‘과 함께 진행된 프로젝트가 ‘WebP‘입니다. ‘웹피‘가 사용자의 서버 속도 향상과 트래픽 양을 줄여 주듯이 구글의 서비 트래픽 역시 줄어들어 구글의 서버 비용을 절감할 수 있습니다. 구글의 영업 이익이 상승하기 때문에 구글이 ‘On2’를 인수 했다고 봐도 좋습니다.

JPEG의 손실/무손실 , PNG 파일의 무손실 압축을 지원합니다. 결과적으로 웹사이트의 빠른 로딩이 가능합니다.

WebP 파일

3. 지원 브라우저

사실 상 ‘Internet Explorer’처럼 이미 오래된 브라우저 외에 거의 모든 브라우저에서 지원됩니다.

4. JPEG(&PNG) vs WebP File

기존의 두 이미지 확장자 파일보다 훨씬 작으며 손실 압축을 한 WebP 이미지는 JEEG 파일보다 25~34%까지 작으며, 무손실 압축을 한 파일은 PNG보다 26%까지 작습니다. WebP file의 최대 크기는 16,383 x 16,383픽셀까지입니다.

JPEG 이미지 파일
PNG 이미지 파일

5. 웹피와 워드프레스

웹피 파일은 개발자가 운영하는 사이트 외에도 전세계에서 많이 사용되는 CMS인 워드프레스에서 특히 많이 사용되고 있습니다. 워드프레스에서 JPEG 및 PNG 파일을 WebP로 지원해 주는 캐시 플러그인들이 많이 있습니다.

워드프레스

Similar Posts

  • W3 Total Cache 속도 테스트

    워드프레스 캐시 플러그인 중 W3 Total Cache는 10년 넘게 꾸준한 인지도를 가지고 있는 플러그인입니다. 다만, 최근 몇 년간은 업데이트가 좀 뜸해지고, UI도 복잡해서 초보자들이 사용하기 어렵다는 평가도 많습니다. 높은 인지도를 가진 W3 Total Cache 속도 테스트를 통해, 이 플러그인이 어떻게 페이지 캐시, 데이터베이스 캐시, 오브젝트 캐시, 브라우저 캐시 등 여러 캐시 유형을 활용했을…

  • [WP] 워드프레스 홈페이지 예시 List 9

    WordPress의 전 세계 점유율은 2023년 현재 43%에 달하고 있습니다. 10개 중 4개의 웹 사이트는 워드프레스로 만들었다는 뜻이지요. 블로그 기능으로 시작한 워드프레스는 전자상거래, 회사 홈페이지, 교육용, 엔터테인먼트 등 생각하는 모든 웹 사이트 구축이 가능한 워드프레스 홈페이지 예시에 대해 알아 보겠습니다. 목차1. WebP 파일 정의2. 배경과 용도3. 지원 브라우저4. JPEG(&PNG) vs WebP File5. 웹피와 워드프레스1….

  • 워드프레스 고유주소(Permalink)와 슬러그

    워드프레스 고유주소(Permalink, 영구링크, 고유링크 등)는 도메인 뒤에 붙는 게시물이나 페이지의 전체 URL 주소를 제공합니다. 특정 콘텐츠에 엑세스하는 데 사용되는 Permalink는 워드프레스 콘텐츠의 영구적인 주소로써 URL이 필요한 모든 워드프레스 콘텐츠에 사용됩니다. 목차1. WebP 파일 정의2. 배경과 용도3. 지원 브라우저4. JPEG(&PNG) vs WebP File5. 웹피와 워드프레스 워드프레스 고유주소 일반설정을 사용하면 안되는 이유 워드프레스를 처음 설치하고…

  • [WP] Gzip 압축 vs Brotli 압축: 2개 압축 알고리즘 차이점

    워드프레스 CMS를 비롯한 웹 사이트를 빠르게 만들기 위해, 서버에서 데이터를 압축하는 설정을 하는 것이 유용합니다. 이렇게 하면 웹 서버와 브라우저 간에 전송되는 데이터를 더욱 빠르게 로딩할 수 있으며, 웹 사이트의 속도를 더 빠르게 만들어 줍니다. 이는 웹사이트를 운영하는 관리자들이 많이 고려하는 요소 중 하나입니다. gzip 압축은 많이 사용되고 있으며, 많은 웹 서버에서 gzip에서…

  • Clearfy Cache: 캐시 그 이상, 워드프레스 최적화에 중점을 둔 플러그인

    워드프레스 사이트의 속도가 느린 경우 캐시 플러그인 또는 최적화 플러그인을 고려할 수 있습니다. Clearfy Cache는 이름처럼 캐시 기능을 포함하고 있지만, 다른 캐시 플러그인과 비교하면 그 범위는 다소 제한적입니다. 따라서 Clearfy 는 최적화와 관리 보조 도구에 중점을 둔 플러그인으로 보는 것이 더 적절합니다. Clearfy는 기본적으로 간단한 캐싱 기능을 제공하지만, 자산 관리 기능을 통해 사용되지…

  • [WP] 워드프레스 글 ID 및 카테고리 ID 확인 방법

    워드프레스 사이트를 관리할 때 글 ID를 확인해야 하는 경우가 있습니다. 작업 도중 워드프레스 글 ID는 좌측 하단에서 확인할 수 있습니다. 워드프레스 카테고리 ID 역시 카테고리 페이지에서 동일한 방법으로 확인할 수 있습니다. 메모장에 글 ID를 좀 더 큰 글자로 쉽게 확인하는 방법입니다. 목차1. WebP 파일 정의2. 배경과 용도3. 지원 브라우저4. JPEG(&PNG) vs WebP File5….