Sử dụng định dạng WebP cho hình ảnh trong WordPress

Source: Sử dụng định dạng WebP cho hình ảnh trong WordPress

Hướng dẫn sử dụng định dạng WebP cho hình ảnh trong WordPress.

Nếu bạn chưa biết thì WebP chính là một trong những chìa khóa quan trọng giúp WP Căn bản có được tốc độ load “thần sầu” như hiện nay, bên cạnh những bí mật đã được bật mí trước đó. Với WebP, bạn có thể giảm đáng kể kích thước trang vì kích thước của hình ảnh ở định dạng WebP thấp hơn nhiều so với PNG hoặc JPG / JPEG truyền thống. Việc sử dụng WebP trong WordPress hiện nay cũng trở nên rất dễ dàng với sự trợ giúp của một số plugin chuyên dụng.

Tìm hiểu thêm:

WebP là gì?

WebP là một định dạng hình ảnh mới, được phát triển bởi Google, với mục tiêu giảm dung lượng của trang web giúp trang web tải nhanh hơn mà không ảnh hưởng đến chất lượng thực tế. Với tính năng nén không mất dữ liệu (không làm giảm chất lượng), hình ảnh ở định dạng WebP có thể nhẹ hơn tới 22% so với định dạng PNG. Đối với việc nén mất dữ liệu, hình ảnh ở định dạng WebP có thể nhẹ hơn tới 34% so với định dạng JPG / JPEG. Đây là những con số rất có ý nghĩa, đặc biệt là với những bức ảnh có kích thước lớn.

Những trình duyệt nào hỗ trợ WebP?

Không phải tất cả các trình duyệt web ngày nay đều hỗ trợ định dạng WebP. Tuy nhiên, các trình duyệt web phổ biến như Google Chrome, Mozilla Firefox, Microsoft Edge, Safari hoặc Opera đã hỗ trợ định dạng này.

Ghi chú:

• Màu xanh lam: Hỗ trợ WebP.
• Màu đỏ: chưa hỗ trợ WebP.

Sử dụng định dạng WebP trong WordPress

Để sử dụng định dạng WebP trong WordPress, bạn cần thực hiện 2 bước cơ bản sau:

Tạo định dạng WebP cho hình ảnh

Các plugin nén ảnh phổ biến như ShortPixel, EWWW Image Optimizer, Optimus… đều được tích hợp sẵn công cụ tạo ảnh WebP tự động cho WordPress. Trong một bài viết cách đây không lâu, mình đã hướng dẫn các bạn cách sử dụng plugin ShortPixel để tạo ảnh WebP. Bạn có thể tham khảo lại liên kết ở đầu bài viết này.

Tuy nhiên, ShortPixel không phải là một dịch vụ miễn phí. Do đó, nếu muốn nén ảnh hàng loạt, bạn cần mua gói tín dụng của họ. Theo tôi, ShortPixel là nhà cung cấp rẻ nhất trong số các dịch vụ nén ảnh trả phí. Hiệu suất nén của nó cũng thuộc hàng tốt nhất. WP Căn bản cũng đang sử dụng dịch vụ này. Đăng ký mua tín dụng ShortPixel theo link bên dưới nếu bạn có nhu cầu tương tự:

Ngoài ra, nếu bạn đang sử dụng dịch vụ WordPress Hosting do WP Căn bản cung cấp hoặc các loại hosting chạy Web Server LiteSpeed ​​/ OpenLiteSpeed, bạn có thể sử dụng plugin LiteSpeed ​​Cache để nén và tạo ảnh WebP. Xem thêm: Hướng dẫn nén ảnh bằng plugin LiteSpeed ​​Cache.

Một giải pháp khác mà bạn cũng có thể tham khảo đó là: Tạo ảnh WebP miễn phí bằng plugin WebP Converter for Media.

Bật WebP cho trang web

Sau khi tạo ảnh với định dạng WebP, bạn cần kích hoạt chúng để trình duyệt web có thể nhận ra chúng. Để bật WebP, bạn có thể sử dụng một trong hai phương pháp sau:

Sử dụng tệp .htaccess hoặc tệp cấu hình

Đối với Web Server Apache hoặc LiteSpeed, bạn cần chèn mã sau vào tệp .htaccess của thư mục cài đặt WordPress:

Đối với Máy chủ Web NginX, hãy thêm mã sau vào tệp cấu hình NginX (nginx.conf):

Tuy nhiên, việc sử dụng mã thường có rủi ro, vì vậy chúng tôi khuyến khích bạn sử dụng một plugin.

Sử dụng plugin ShortPixel

Nếu bạn sử dụng plugin ShortPixel để tạo ảnh WebP, nó cũng được trang bị tính năng tải ảnh. Bạn chỉ cần đánh dấu vào ô Cung cấp các phiên bản thế hệ tiếp theo của hình ảnh trong giao diện người dùng sau đó chọn một trong hai tùy chọn bên dưới.

Bên trong:

• Sử dụng cú pháp thẻ: thay thế thẻ với để tải hình ảnh WebP.
• Không thay đổi mã trang (thông qua .htaccess): sử dụng tệp .htaccess để tải hình ảnh WebP.

Hãy cùng tham khảo từng cách để có được sự lựa chọn phù hợp nhất cho website của mình.

Sử dụng plugin Cache Enabler

Đây là một trong số ít plugin miễn phí hỗ trợ tạo cache với định dạng WebP. Cách sử dụng plugin này khá đơn giản. Bạn chỉ cần cài đặt và kích hoạt plugin Trình kích hoạt bộ nhớ cache (Tải xuống).

Tiếp theo, đi tới Cài đặt => Trình kích hoạt bộ nhớ cache. Đặt như hình bên dưới và lưu lại.

Ghi chú:

• Hủy kích hoạt và xóa các plugin bộ nhớ đệm bạn đang sử dụng trước khi cài đặt plugin Cache Enabler để tránh xung đột.
• Định dạng WebP chỉ hoạt động trên bộ nhớ cache. Vì vậy, nếu bạn đã đăng nhập, WebP sẽ không hoạt động.

Sử dụng plugin LiteSpeed ​​Cache

Nếu trang web WordPress của bạn đang chạy trên Máy chủ Web LiteSpeed ​​/ OpenLiteSpeed, bạn có thể tải hình ảnh WebP thông qua plugin LiteSpeed ​​Cache. Tham khảo bài viết “Hướng dẫn tải ảnh WebP bằng plugin LiteSpeed ​​Cache” để biết thêm chi tiết.

Kiểm tra WebP

Để xem định dạng WebP có hoạt động bình thường hay không, bạn nên truy cập web thông qua trình duyệt hỗ trợ WebP, chẳng hạn như Google Chrome.

Nhấp chuột phải vào bất kỳ trang nào, chọn Quan sát => chọn tab Mạng => chọn hàng Img => Tải lại trang (F5) và xem chuyên mục Kiểu. Chúc may mắn!

Bạn có đang sử dụng định dạng WebP trên trang web của mình không? Bạn đánh giá thế nào về tác động của nó đối với tốc độ tải của trang web? Hãy chia sẻ quan điểm và ý kiến ​​của bạn với chúng tôi trong khung bình luận bên dưới.

Nếu bạn đã thích bài viết này, hãy theo dõi blog của tôi để thường xuyên cập nhật những bài viết hay và mới nhất. Cảm ơn rất nhiều.

4.8 / 5 – (34 phiếu bầu)

Via: sieucoder.com

from sieucoder.com https://ift.tt/3FVhshx
via Sieucoder.com