Nội dung của Thư viện này
Thư viện này trình bày một số hình ảnh mẫu để giới thiệu hai chế độ mới của WebP: WebP không suy hao và có hao tổn WebP với alpha (hỗ trợ độ trong suốt).
So sánh song song
Bảng dưới đây trình bày hình ảnh PNG (được nén bằng pngcrush và pngout), Hình ảnh không mất WebP và hình ảnh suy hao với định dạng Alpha được đặt cạnh nhau so sánh. Hình ảnh được phủ lên nền ca rô như thông thường thực hiện trong phần mềm đồ hoạ.
Lưu ý rằng chúng tôi đã sử dụng webp chất lượng 90 cho hình ảnh mờ WebP với alpha và chất lượng mặc định cho hình ảnh WebP không suy hao. Xem Phần Tái tạo hình ảnh để biết thêm thông tin chi tiết.
Chúng ta trình bày các hình ảnh WebP (được chuyển đổi trở lại thành PNG) đối với các trình duyệt không có khả năng kết xuất WebP. Nếu có một trình duyệt tương thích, bạn có thể tìm thấy Các đường liên kết đến tệp WebP bên dưới. Ngoài ra, các hình ảnh trên trang này thu nhỏ để xem thuận tiện. Nhấp vào hình ảnh bất kỳ để xem hình ảnh có kích thước đầy đủ hình ảnh.
Bảng này cũng biểu thị kích thước hình ảnh thu được ở mỗi chế độ.
PNG | WebP không suy hao | WebP suy hao (có alpha) |
---|---|---|
"Hoa hồng vàng" 1 | ||
Kích thước tệp tối ưu PNG: 110,7 KB |
Kích thước tệp không suy hao WebP: 79,9 KB |
Kích thước tệp WebP suy hao (có alpha): 17,7 KB |
"baby tux cho người dùng của tôi" 2 | ||
Kích thước tệp tối ưu PNG: 38,1 KB |
Kích thước tệp không suy hao WebP: 27,0 KB |
Kích thước tệp WebP suy hao (có alpha): 13,8 KB |
"Minh hoạ độ trong suốt bằng PNG" 3 | ||
Kích thước tệp tối ưu PNG: 213,5 KB |
Kích thước tệp không suy hao WebP: 149,0 KB |
Kích thước tệp WebP suy hao (có alpha): 51,6 KB |
"Kỷ niệm 189 năm ngày sinh của Gregor Mendel" 4 | ||
Kích thước tệp tối ưu PNG: 49,2 KB |
Kích thước tệp WebP không suy hao: 33,2 KB |
Kích thước tệp WebP suy hao (có alpha): 18,3 KB |
"Thẻ la bàn trong suốt cho lớp phủ" 5 | ||
Kích thước tệp tối ưu PNG: 126,8 KB |
Kích thước tệp không suy hao WebP: 97,1 KB |
Kích thước tệp WebP suy hao (có alpha): 57,3 KB |
Dưới đây là các đường liên kết đến tệp WebP (có thể xem trong Chrome 22 trở lên):
"Hoa hồng vàng": | Tệp WebP không suy hao (80,1 KB) | Tệp WebP suy (có alpha) (18,4 KB) |
"baby tux for my user page": | Tệp WebP không hao tổn (27,0 KB) | Tệp WebP suy (có alpha) (14,1 KB) |
"Bản minh hoạ độ xuyên suốt của PNG": | Tệp WebP không suy hao (149,1 KB) | Tệp WebP suy (có alpha) (52,6 KB) |
Kỷ niệm 189 năm ngày sinh của Gregor Mendel: | Tệp WebP không suy hao (33,3 KB) | Tệp WebP suy (có alpha) (19,0 KB) |
"Thẻ la bàn trong suốt cho lớp phủ": | Tệp WebP không suy hao (97,1 KB) | Tệp WebP suy (có alpha) (57,3 KB) |
Bản quyền hình ảnh
Các hình ảnh trên trang này đến từ một số nguồn. Tín dụng cho các hình ảnh bên trên được liệt kê theo thứ tự tại đây.
1 |
"Ảnh có sẵn miễn phí ở độ phân giải cao - Hoa hồng vàng 3 - Hoa" Tác giả hình ảnh: Jon Sullivan Tệp này thuộc phạm vi công cộng. Nguồn JPEG |
2 |
"baby tux for my user page" Tác giả hình ảnh: Fizyplankton Tệp này thuộc phạm vi công cộng. Nguồn PNG |
3 |
"Minh hoạ độ trong suốt bằng PNG" Tác giả của hình ảnh: Mã nguồn POV-Ray Ảnh được cấp phép theo Giấy phép Creative Commons Giấy phép Ghi nhận bản quyền-Chia sẻ Tương tự 3.0 Chưa chuyển đổi. Nguồn PNG |
4 |
"Kỷ niệm 189 năm ngày sinh của Gregor Mendel" Tác giả hình ảnh: Nhóm Google Hình tượng trưng Xin cảm ơn nhóm Google Hình tượng trưng đã gửi hình ảnh này. Nguồn PNG |
5 |
"Thẻ la bàn trong suốt cho lớp phủ" Tác giả hình ảnh: Denelson83 Tệp này được cấp phép theo Giấy phép Creative Commons Giấy phép Ghi nhận bản quyền-Chia sẻ Tương tự 3.0 Chưa chuyển đổi. Nguồn PNG |
Tái tạo hình ảnh
Nhằm mục đích tái tạo và để minh hoạ việc sử dụng một số WebP tham số nén, chúng tôi sẽ mô tả ở đây các bước chính xác liên quan khi tạo hình ảnh trong thư viện này.
Công cụ
Đối với nén PNG, kết quả tốt nhất từ pngcrush 1.8.13 và ZopfliPNG 1.0.3 sẽ được sử dụng. Các tuỳ chọn dòng lệnh sau được sử dụng
Pngrush:
pngcrush -brute -rem tEXt -rem tIME -rem iTXt -rem zTXt -rem gAMA -rem cHRM -rem iCCP -rem sRGB -rem alla -rem text input.png output-candidate.png
ZopfliPNG:
zopflipng --lossy_transparent input.png output-candidate.png
ZopfliPNG với tất cả các bộ lọc:
zopflipng --iterations=500 --filters=01234mepb --lossy_8bit --lossy_transparent input.png output-candidate.png
Để thay đổi tỷ lệ một số ảnh nguồn lớn hơn (chỉ để xem), chúng tôi đã sử dụng
phiên bản công cụ mới nhất của ImageMagick có tên là convert
, có tại
https://www.imagemagick.org. Dòng lệnh chính xác như sau:
convert image.png -resize 240x image_resized.png
Nén để không làm mất tệp WebP
Chúng tôi sử dụng thuật toán 'không mất dữ liệu' trong công cụ cwebp để chuyển đổi PNG sang WebP- không tổn hao. Để có kết quả đầu ra tối thiểu, dòng lệnh chính xác được sử dụng là như sau:
cwebp input.png -lossless -m 6 -q 100 -o webp_lossless.webp
Hiển thị WebP không suy hao
Chúng tôi đã chuyển đổi các hình ảnh không suy hao về định dạng WebP về định dạng PNG bằng công cụ dwebp để kết xuất hình ảnh. Dòng lệnh chính xác được sử dụng như sau:
dwebp webp_lossless.webp -o output.png
Nén thành tệp WebP suy hao (với alpha)
Chúng tôi đã sử dụng công cụ cwebp để chuyển đổi PNG sang WebP bị suy hao (có alpha). Chúng tôi đã chọn Chất lượng WebP là 90 (nén suy hao) và chất lượng alpha 100 (không tổn hao) nén). Dòng lệnh chính xác được sử dụng như sau:
cwebp input.png -q 90 -alpha_q 100 -m 6 -o webp_alpha.webp
Hiển thị WebP dạng suy (có alpha)
Chúng tôi đã chuyển đổi các hình ảnh WebP bị suy hao (có alpha) về PNG bằng công cụ dwebp cho kết xuất hình ảnh. Dòng lệnh chính xác được sử dụng như sau:
dwebp webp_alpha.webp -o output.png