Nội dung
Xuất file hình Webp bằng Photoshop
Hi các bác !
Nói về hình ảnh thì chúng ta hay nhắc đến các định dạng quen thuộc như JPG, JPEG, PNG, GIF … mỗi loại định dạng nó sẽ có những đặc tính và ưu nhược điểm khác nhau, mục đích là để đáp ứng các nhu cầu khác nhau cho người sử dụng, các bác có thể tìm hiểu kỹ hơn thông qua chị gu gồ nhe !
Trong khuôn khổ bài viết này thì tui chỉ tập trung vào ảnh có định dạng WEBP và cách tạo ra nó như thế nào. Trước hết thì các bác xem sơ qua cho vui về WEB là cái gì trước đã.
Đuôi .Webp là gì
- Webp là phần mở rộng của tập tin (File) hình ảnh, do Google phát triển với mục đích là để tối ưu chất lượng hình ảnh và dung lượng từ đó giúp tăng tốc độ cho website.
- Hầu hết các trình duyệt web phiên bản mới nhất hiện nay đều có hỗ trợ đuôi ảnh .Webp: Chrome, Firefox, Opera, Edge, …
Ưu nhược điểm của WebP
– Ưu điểm
- Tăng hiệu suất load trang: Webp có dung lượng nhỏ gọn vì vậy mà các trang chứa hình ảnh định dạng Webp sẽ được tải nhanh hơn.
- Chiếm ít tài nguyên máy chủ, host: tính năng nén ảnh của webp mạnh mẽ giúp việc lưu trữ của bạn gọn gàng hơn. Sẽ rất hữu dụng nếu website của các bác chứa nhiều hình ảnh hoặc các bác làm web chuyên về lưu trữ hình ảnh.
- Ảnh tách nền và ảnh động: Như đã nói ở trên, WebP là định dạng hình ảnh duy nhất hỗ trợ cho người dùng cả nền trong suốt của PNG và ảnh động của GIF. Thêm vào đó, WebP còn vượt trội về tính năng nén của JPG. Nói một cách tổng quát thì WebP tổng hợp tất cả các thế mạnh của các định dạng ảnh đã được xuất hiện trên thị trường.
2. Nhược điểm
- Tính tương thích với trình duyệt: Do đây là định dạng ảnh mới ra mắt sau này nên sẽ có một số “ông già” như trình duyệt IE sẽ không thể hiển thị.
- Chất lượng ảnh vẫn bị giảm: Khi nén, không riêng gì với WebP mà tất cả các định dạng khác chất lượng ảnh vẫn bị giảm. Đối với hầu hết người dùng, đây là điều không đáng kể. Tuy nhiên, đối với những trang web đòi hỏi về chất lượng ảnh khắc khe như những người thiết kế đồ họa, nhiếp ảnh gia thì đây là một nhược điểm khá “chí mạng”.
Cách xuất file hình Webp bằng photoshop
Trước tiên các bác truy cập vào đường link https://github.com/webmproject/WebPShop/releases
Và tải xuống với phiên bản tương ứng với hệ điều hành của các bác.
Sau khi tải xuống các bạn copy file vừa tải (WebPShop 0.4.3bi) vào thư mục Plug-ins của thư mục cài đặt photoshop.
Ví dụ C:\Program Files\Adobe\Adobe Photoshop CS6\Plug-ins
Tiếp theo bạn mở photoshop lên là được. Sau khi chỉnh sửa anh xong bạn chọn File\Save As\Chọn Save as type với .webp là được
Rất đơn giản, chúc các bác thực hiện thành công.
Đã làm được, thanks bro