Cách nén ảnh và chuyển sang WebP cho WordPress (giảm 70% dung lượng)

Hình ảnh – “thủ phạm” giấu mặt làm chậm website

Bạn có biết hình ảnh thường chiếm tới 50–70% tổng dung lượng tải về của một trang web? Một bài viết với 5–10 ảnh JPEG chưa nén, mỗi ảnh 1–2MB, có thể khiến trang nặng tới 10–20MB — người dùng 4G phải chờ cả chục giây mới thấy nội dung.

Tin vui là tối ưu hình ảnh là việc dễ làm, hiệu quả cao: chỉ cần nén ảnh đúng cách và chuyển sang định dạng hiện đại như WebP, bạn có thể giảm 50–70% dung lượng mà mắt thường gần như không nhận ra sự khác biệt về chất lượng.

1. Hiểu các định dạng ảnh trên web

  • JPEG: tốt cho ảnh chụp, ảnh nhiều màu sắc. Nhược điểm: file khá nặng.
  • PNG: tốt cho ảnh cần nền trong suốt, logo, screenshot. Nhược điểm: rất nặng với ảnh chụp.
  • WebP: định dạng hiện đại của Google, nhẹ hơn JPEG/PNG khoảng 25–35% ở cùng chất lượng, hỗ trợ cả nền trong suốt. Được tất cả trình duyệt phổ biến hỗ trợ từ lâu.
  • AVIF: thế hệ mới hơn, nén tốt hơn WebP nữa, nhưng độ hỗ trợ trình duyệt chưa phủ hết.

Kết luận: với đa số website WordPress năm 2026, WebP là lựa chọn tối ưu — cân bằng giữa dung lượng và độ tương thích.

2. Nguyên tắc vàng trước khi upload ảnh

  1. Resize đúng kích thước: nếu khung hiển thị rộng 800px, đừng upload ảnh 4000px. Dùng Photoshop, Photopea (miễn phí online) hoặc ngay công cụ cắt ảnh của WordPress để resize trước.
  2. Chọn đúng định dạng: ảnh chụp → JPEG/WebP; logo, icon, ảnh nền trong suốt → PNG/WebP.
  3. Đừng upload ảnh chụp màn hình PNG dung lượng lớn khi có thể dùng JPEG/WebP.

3. Nén ảnh tự động bằng plugin (khuyên dùng)

Thay vì nén thủ công từng ảnh, hãy để plugin làm tự động mỗi khi bạn upload:

ShortPixel (khuyên dùng nhất)

  • Miễn phí 100 ảnh/tháng, đủ cho blog cá nhân và site vừa.
  • Hỗ trợ nén Lossy, Glossy, Lossless và tự động tạo bản WebP/AVIF.
  • Cài đặt đơn giản: cài plugin → đăng ký lấy API key miễn phí → chọn mức nén Lossy → bật “tạo WebP”.

Imagify

  • Cùng nhà phát triển với WP Rocket, giao diện đẹp, dễ dùng.
  • Miễn phí ~200MB/tháng (~2000 ảnh nhỏ).

Converter for Media (miễn phí 100%)

  • Chuyên chuyển đổi ảnh sang WebP/AVIF hoàn toàn miễn phí, không giới hạn.
  • Phù hợp nếu bạn chỉ cần chuyển định dạng mà không cần nén sâu.

Smush

  • Miễn phí không giới hạn số ảnh (bản free nén lossy giới hạn nhẹ).
  • Tích hợp lazy load sẵn.

4. Hướng dẫn từng bước với ShortPixel

  1. Vào Plugins → Cài mới, tìm “ShortPixel Image Optimizer”, cài đặt và kích hoạt.
  2. Đăng ký tài khoản miễn phí để lấy API key, dán vào phần cài đặt plugin.
  3. Ở mục Compression type, chọn Lossy (giảm dung lượng mạnh nhất, chất lượng vẫn rất tốt cho web).
  4. Bật tùy chọn tạo ảnh WebP/AVIF và chọn phân phối WebP thay cho ảnh gốc.
  5. Nhấn Save & Go to Bulk Process để nén toàn bộ ảnh cũ đã upload trước đó.
  6. Từ nay mỗi ảnh mới upload sẽ được tự động nén + tạo bản WebP.

5. Bật Lazy Load cho hình ảnh

Lazy load giúp trình duyệt chỉ tải ảnh khi người dùng cuộn tới, thay vì tải toàn bộ ảnh ngay từ đầu. WordPress từ phiên bản 5.5 đã tự động thêm loading="lazy" cho ảnh trong nội dung. Nếu theme của bạn cũ hoặc muốn kiểm soát kỹ hơn, các plugin như Smush, LiteSpeed Cache đều có tùy chọn lazy load nâng cao (bao gồm cả lazy load iframe video YouTube).

6. Dùng đúng kích thước ảnh với srcset

WordPress tự động tạo nhiều kích thước thumbnail (thumbnail, medium, large…) mỗi khi upload ảnh, và dùng thuộc tính srcset để trình duyệt tự chọn bản phù hợp với màn hình. Hãy đảm bảo theme của bạn dùng đúng hàm the_post_thumbnail('medium') thay vì lúc nào cũng gọi ảnh gốc full.

Mẹo: vào Cài đặt → Media, đặt lại các kích thước thumbnail cho phù hợp với theme, tránh tạo ra quá nhiều bản thumbnail không dùng đến gây tốn ổ cứng.

7. Cân nhắc CDN cho hình ảnh

Nếu website có nhiều ảnh (blog du lịch, ẩm thực, portfolio…), hãy cân nhắc:

  • Cloudflare (miễn phí): cache ảnh tại edge server gần người dùng.
  • BunnyCDN / ShortPixel Adaptive Images: tự động resize + nén + phân phối ảnh theo thiết bị, trả phí nhưng rất đáng tiền với site ảnh nặng.

Kết luận

Tóm lại quy trình tối ưu ảnh chuẩn cho WordPress: resize đúng kích thước → nén tự động bằng ShortPixel/Imagify → chuyển sang WebP → bật lazy load → dùng CDN nếu cần. Làm đủ 5 bước này, dung lượng ảnh trên site của bạn có thể giảm 50–70%, tốc độ tải trang cải thiện rõ rệt chỉ sau một buổi chiều.

4.9/5 - (47 bình chọn)
Đăng ký
Thông báo về
guest
0 Bình Luận
Oldest
Newest Most Voted
Inline Feedbacks
Xem tất cả
0
Rất thích suy nghĩ của bạn, hãy bình luận.x
()
x