이 페이지는 Cloud Translation API를 통해 번역되었습니다.

WebP 갤러리

갤러리 콘텐츠

이 갤러리 페이지는 다음과 같이 WebP를 지원하는 브라우저에서 가장 잘 표시됩니다. Chrome, Opera 기타

Google 크롬에 액세스할 수 없는 경우 다른 제품과 함께 사용하도록 로컬 드라이브를 WebP를 지원합니다.

JPEG 및 WebP의 샘플 이미지 파일 및 PNG 소스

아래 표는 배율이 조정된 JPEG (왼쪽)와 WebP 이미지 (오른쪽)를 보여줍니다. 나란히 놓고 비교해 보세요. WebP를 기본적으로 지원하는 브라우저가 존재하기 때문에 우리는 시작할 때처럼 더 이상 PNG 컨테이너에 WebP 이미지를 넣지 않습니다. 이미지 파일 크기가 정확해야 합니다. JPEG 및 WebP 썸네일 이미지를 클릭하면 새 탭의 대용량 이미지

썸네일 아래의 파일 크기는 이미지의 파일 크기와 일치함 표시됩니다. WebP 이미지가 30% 이상 더 작습니다. 훨씬 효율적입니다.

JPEG	WEBP
"Nærøyfjorden, Norway - from Breiskrednosi. 유네스코 세계 헤리티지' ¹
<ph type="x-smartling-placeholder"></ph> JPEG 파일 크기: 43.84KB	<ph type="x-smartling-placeholder"></ph> WebP 파일 크기: 29.61KB

"Kayaker at Ekstremsportveko 2010, Voss" ²
<ph type="x-smartling-placeholder"></ph> JPEG 파일 크기: 86.25KB	<ph type="x-smartling-placeholder"></ph> WebP 파일 크기: 59.18KB

'파크런' 프레임 10 시퀀스 ³
<ph type="x-smartling-placeholder"></ph> JPEG 파일 크기: 297.05KB	<ph type="x-smartling-placeholder"></ph> WebP 파일 크기: 198.38KB

이미지: 'A Wild Cherry (Prunus avium) in flower' ⁴
<ph type="x-smartling-placeholder"></ph> JPEG 파일 크기: 251.03KB	<ph type="x-smartling-placeholder"></ph> WebP 파일 크기: 172.82KB

이미지: 'Jaipur Maharaja Brass Band'를 호흡하는 불꽃 차서피에르 벨기에 ⁵
<ph type="x-smartling-placeholder"></ph> JPEG 파일 크기: 120.78KB	<ph type="x-smartling-placeholder"></ph> WebP 파일 크기: 80.76KB

이미지 제공

이 페이지의 이미지는 다양한 소스에서 가져옵니다. Google은 WebP의 자질을 보여주기 위해 몇 가지 유쾌하고 풍부한 사진을 선택했습니다. 레나, 개코원숭이 등의 유명한 고전 이미지로 안타깝게도 저작권이 없는 것은 아닙니다.

위 이미지의 크레딧은 여기에 순서대로 표시되어 있습니다.

1	"Nærøyfjorden, Norway - from Breiskrednosi. 유네스코 세계 유산' 이미지 작성자: 케틸 버클랜드 모에 작성자의 허가를 받아 복제했습니다. <ph type="x-smartling-placeholder"></ph> PNG 소스 <ph type="x-smartling-placeholder"></ph> 저자가 작성한 블로그 게시물(JPEG 및 WebP 비교). 마우스 마우스를 가져가면 예시가 활성화됩니다
2	'Kayaker at Ekstremsportveko 2010, Voss' 이미지 작성자: 케틸 버클랜드 모에 작성자의 허가를 받아 복제했습니다. <ph type="x-smartling-placeholder"></ph> PNG 소스 <ph type="x-smartling-placeholder"></ph> 저자가 작성한 블로그 게시물(JPEG 및 WebP 비교). 마우스 마우스를 가져가면 예시가 활성화됩니다
3	'파크런' 프레임 10 시퀀스 이미지 제작자: 라스 해글룬드, SVT Sveriges Television AB 제작자의 허가를 받아 복제되었습니다. <ph type="x-smartling-placeholder"></ph> PNG 소스
4	이미지: 'A Wild Cherry (Prunus avium) in flower' 이미지 작성자: 벤자민 기멜 <ph type="x-smartling-placeholder"></ph> PNG 소스 에 따라 사용이 허가된 사진 크리에이티브 커먼즈 저작자표시-동일조건변경허락 3.0 Unported 라이선스에 대한 계약을 체결하시기 바랍니다.
5	이미지: 'Jaipur Maharaja Brass Band'를 호흡하는 불꽃 챠서피에르 벨기에 작성자: 뤼크 비아투르 <ph type="x-smartling-placeholder"></ph> PNG 소스 에 따라 사용이 허가된 사진 크리에이티브 커먼즈 저작자표시-동일조건변경허락 3.0 Unported 라이선스에 대한 계약을 체결하시기 바랍니다. 저자 웹사이트: www.lucnix.be

이미지 재현

재현성을 위해 일부 WebP의 사용을 시연하기 위해 압축 매개변수와 관련하여 이미지를 생성하는 과정입니다.

도구

원본 사진을 변환하고 크기를 조정하기 위해 우리는 convert라는 ImageMagick의 도구(https://www.imagemagick.org에서 제공) 버전 정보는 다음과 같습니다.

Version: ImageMagick 6.5.7-8 2010-12-02 Q16 https://www.imagemagick.org

JPEG 압축의 경우 우리는 IJG의 참조 인코더 버전 8b를 사용했습니다. https://www.ijg.org/files/jpegsrc.v8b.tar.gz에서 제공됩니다.

버전 정보는 다음과 같습니다.

Independent JPEG Group's CJPEG, version 8b  16-May-2010
Copyright (C) 2010, Thomas G. Lane, Guido Vollbeding

소스 PNG 사진 생성

첫째, JPEG 소스는 다음을 사용하여 무손실로 PNG 형식으로 변환됩니다.

convert in.jpg out.png

그런 다음 큰 소스 이미지가 1024픽셀의 작은 너비로 재조정됩니다. 사용하여 다음 명령어를 실행합니다.

convert in.png -depth 16 -gamma 0.454545 -filter lanczos -resize 1024 -gamma 2.2 -depth 8 out.png

소스 PNG 이미지의 최종 세트를 생성합니다.

JPEG 형식으로 압축

JPEG의 인코더 (cjpeg)는 PPM 형식으로 입력 이미지를 받습니다. Google에서는 다음을 위해 convert를 사용합니다. 생성합니다. 전체 전환 시퀀스는 다음과 같습니다.

convert in.png tmp.ppm
cjpeg -optimize -quality 80 -outfile out.jpg tmp.ppm

품질 계수 80으로 최적화된 JPEG 파일을 생성합니다.

WebP 형식으로 압축

최적화된 JPEG 파일에 비해 파일 크기를 30% 줄이는 것을 목표로 삼았습니다. 따라서 우리는 각 사진의 타겟 크기를 명시적으로 지정했습니다. 또한 각 필터의 필터링 강도에 임시 값을 설정합니다. cwebp 도구의 -f 옵션 덕분에 가능합니다. 진폭은 공간 노이즈 형태 또한 -sns 옵션. 사용된 정확한 명령줄은 read:

cwebp -m 6 -f 50 -size 31500 1.png -o 1.webp
cwebp -m 6 -f 20 -sns 100 -size 62000 2.png -o 2.webp
cwebp -m 6 -sns 90 -size 213000 3.png -o 3.webp
cwebp -m 6 -f 40 -size 181000 4.png -o 4.webp
cwebp -m 6 -f 40 -size 89000 5.png -o 5.webp

전반적으로 그 결과 WebP 파일의 전 세계에서 JPEG 파일 크기로 자동 변환하세요.

이 페이지에 사용된 WebP 썸네일도 26% 더 작습니다. 상응해야 합니다.