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

  • [WP]워드프레스 댓글 비활성화 방법 3가지

    워프프레스 블로그를 운영하다 보면 해외에서 많은 스팸 댓글이 달릴 때가 많습니다. 댓글을 스팸 및 삭제하기 전에 달린 댓글들은 DB 용량을 차지해서 서버의 리소스를 잡아 먹습니다. 커뮤니티 or 전자상거래 목적의사이트가 아니라면 ‘워드프레스 댓글 비활성화’를 설정을 해 놓는 것이 옳은 결정입니다. 목차1. WebP 파일 정의2. 배경과 용도3. 지원 브라우저4. JPEG(&PNG) vs WebP File5. 웹피와 워드프레스…

  • Ghost CMS에 cPanel Nodejs 설치 및 관리 방법

    Node.js는 Chrome V8JavaScript 엔진 기반 JavaScript 런타임입니다. 보통 기존 JavaScript보다 Node.js를 사용할 경우 웹 사이트의 속도가 빠른 것으로 생각할 수 있으며, 사용 중인 호스팅에서 cPanel Nodejs를 지원할 경우 설정하는 방법에 대해 알아 보겠습니다. Node.js는 오픈 소스 Javascript 런타임 환경으로, 웹 호스팅 서버에서 클라이언트의 웹 브라우저 대신 Javascript 코드를 실행시키기 위해 사용됩니다. Node.js는 웹 페이지의…

  • WP OPcache 플러그인

    PHP 5.5 이상 버전의 서버에서는 OPcache가 기본적으로 설치되어 있으며, 활성화되어 있는 경우가 많습니다. 플러그인이 많지 않은 간단한 워드프레스 사이트에서는 큰 차이를 느끼기 어려울 수도 있지만, OPcache는 전체적인 사이트 속도를 평균 3배 이상 향상시키며, 특히 중대형 사이트일수록 그 효과가 더욱 뚜렷하게 나타납니다. 서버에 설치만 되어 있다면 기본적으로 작동하지만, OPcache를 직접 관리하고 통제하고 싶다면 ‘WP…

  • 워드프레스 호스팅 RocketNet 가격·스펙 & Starter 플랜 $1

    워드프레스 호스팅 중 RocketNet은 속도와 안정성을 중시하는 개발자형 관리형 호스팅 서비스로, 캐시·보안·CDN 기능을 기본 제공하며 별도의 설정 없이 빠른 환경을 구축할 수 있습니다. 엔터프라이즈 호스팅을 제외한 관리형 호스팅 및 에이전시 호스팅은 첫 달 $1로 할인과 1년 결제 시에도 30일 환불 정책이 있기 때문에 가입 후 충분히 검토 후에 연장 여부를 검토할 수 있습니다….

  • 워드프레스 서버 이전하기: WordPress Migration 작업

    워드프레스 사이트를 직접 AWS LightSail에서 관리하기 위해 워드프레스 서버 이전 작업을 진행하게 되었습니다. 서버 이전을 진행하게 된 이유는 위와 같은 이유 외 다양한 이유로 서버 이전을 결정하게 되었습니다. 목차1. WebP 파일 정의2. 배경과 용도3. 지원 브라우저4. JPEG(&PNG) vs WebP File5. 웹피와 워드프레스 1. 워드프레스 서버 이전을 위한 기존 서버 SSH 접속 먼저 이용하는…

  • [WP] 워드프레스 렌더링 차단 리소스 제거 방법 2가지

    워드프레스를 이용하다 보면 ‘렌더링 차단 리소스 제거‘ 설정이란 내용을 플러그인 사용 중 본 경우가 있을 수 있습니다. 워드프레스 렌더링이란 무엇이며, ‘렌더링‘과 ‘렌더링 차단 리소스 제거‘는 무엇을 뜻 하는지 풀어 보도록 하겠습니다. 먼저 렌더링은 HTML, CSS, 자바스크립트 등 웹 사이트의 문서가 웹 브라우저에서 출력 되는 과정입니다. 웹 페이지에 접속 했을 때 브라우저에 표시되는 것이…