티스토리 뷰

728x90
반응형

WebP is a modern image format that provides superior lossless and lossy compression for images on the web. Using WebP, webmasters and web developers can create smaller, richer images that make the web faster.

WebP lossless images are 26% smaller in size compared to PNGs. WebP lossy images are 25-34% smaller than comparable JPEG images at equivalent SSIM quality index.

Lossless WebP supports transparency (also known as alpha channel) at a cost of just 22% additional bytes. For cases when lossy RGB compression is acceptable, lossy WebP also supports transparency, typically providing 3× smaller file sizes compared to PNG.

출처 : https://developers.google.com/speed/webp

 

위 내용을 보면 google 에서 만든 이 webp 라는 이미지 포맷은 웹 상의 이미지로써 png나 jpeg 보다 훨씬 더 효율적인 이미지 압축 포맷이라고 하는데요. 그래서 그런지 구글 크롬에서 웹페이지 성능 평가 도구인 lighthouse 를 실행시켜서 웹페이지 성능 평가 보고서를 생성해보면, "이미지를 webp 로 변경해서 속도를 높여라!" 라는 문구를 볼 수 있곤 합니다.

 

그럼 이제 png, jpeg 포맷의 이미지를 어떻게 webp 로 변환하는지 한번 알아보겠습니다. (사실 구글에서 이미 이런 webp converter 라는 것을 따로 제공해주고 있고 사용방법도 제공해주고 있습니다. 아래 링크에서 확인해볼 수 있습니다.)

https://developers.google.com/speed/webp

 

An image format for the Web  |  WebP  |  Google Developers

An image format for the Web.

developers.google.com

 

읽기 귀찮으신 분도 계실 수 있기에 제가 간단히 명령어랑 다운로드 링크만 정리해서 드리자면 이렇습니다.

 

webp converter 다운로드 링크 주소는 아래와 같습니다. 운영체제별로 있기 때문에 본인에게 맞는 파일을 다운로드해야 합니다.

https://storage.googleapis.com/downloads.webmproject.org/releases/webp/index.html

 

Index of downloads.webmproject.org/releases/webp

 

storage.googleapis.com

 

저는 우선 Windows 10 64bit 운영체제를 사용하고 있기 때문에 libwebp-1.2.2-windows-x64.zip 를 다운받아 주었습니다. 다운하고 압축풀어주면 아래와 같이 bin 폴더에 여러 exe 파일이 있는 걸 확인하실 수 있습니다.

 

 

위 많은 exe 파일 중 PNG 나 JPEG 이미지 파일을 webp 포맷으로 변환할 때 사용하는 도구 이름은 cwebp 입니다.

그리고 webp 포맷을 다시 PNG 나 JPEG 이미지 포맷으로 변환할 때 사용하는 도구 이름은 dwebp 입니다.

 

각각 명령어 사용법은 아래와 같습니다.

# png 파일을 webp 로 변환
cwebp -q 80 image.png -o image.webp

# webp 파일을 png 로 변환
dwebp image.webp -o image.png

위에서 cwebp 명령 사용 시에 -q 옵션에 80 값을 준 이유는 이미지 품질을 80 으로 낮춰서 변환하는 기능을 합니다. -q 옵션은 최소 0 에서 최대 100까지 설정해줄 수 있는데, 따로 설정하지 않았을 때 기본값으로는 75로 설정됩니다. 가장 좋은 품지을 유지하기 위해서는 100으로 설정해주면 되겠습니다. 이 외에도 다양한 옵션이 있는데 자세한 건 아래 링크에서 확인하실 수 있습니다.

https://developers.google.com/speed/webp/docs/cwebp

 

cwebp  |  WebP  |  Google Developers

cwebp Name cwebp -- Compress an image file to a WebP file Synopsis cwebp [options] input_file -o output_file.webp Description cwebp compresses an image using the WebP format. Input format can be either PNG, JPEG, TIFF, WebP or raw Y'CbCr samples. Note: Ani

developers.google.com

 

사실 구글이나 검색엔진에 webp converter 라고 검색해보시면 online webp converter 를 보실 수 있는데, 해당 웹사이트가 안전하고 정확하게 이상없이 잘 converting 해주는지는 신뢰의 문제가 있을 수 있습니다. 그래서 보다 정확하고 안전하게 webp 이미지 포맷으로 변환하고 싶으시다면 구글에서 공식적으로 지원해주는 도구를 사용하심을 추천드립니다.

 

- 끝 -

728x90
반응형
댓글