PNG, JPEG hay WebP: nên dùng định dạng ảnh nào?

Phần lớn việc chọn định dạng ảnh chỉ xoay quanh hai câu hỏi. Ảnh có cần vùng trong suốt không? Và mất một chút chất lượng thì có nhìn thấy không? Trả lời xong hai câu này, định dạng gần như tự hiện ra. Câu hỏi thứ ba, tệp sẽ được dùng ở đâu, quyết định bạn có được dùng các định dạng mới hay không, vì các sàn thương mại điện tử và nhiều ứng dụng vẫn chỉ nhận JPEG và PNG.

Bài này so sánh bốn định dạng bạn hay gặp nhất cho ảnh chụp và đồ họa trên web: JPEG, PNG, WebP và AVIF. Cuối bài là gợi ý nhanh cho những việc thường gặp: logo, ảnh sản phẩm, ảnh chụp thông thường và ảnh đã tách nền với nền trong suốt.

Bảng so sánh

Thông tin về định dạng lấy từ hướng dẫn định dạng ảnh của MDN. Dòng hỗ trợ không còn quá quan trọng với trình duyệt như trước: mọi trình duyệt lớn hiện nay đều hiển thị WebP, và AVIF được hỗ trợ trong các phiên bản gần đây của tất cả. Nơi nó còn quan trọng là những chỗ khác, như biểu mẫu tải lên, sàn thương mại điện tử, ứng dụng email và phần mềm máy tính cũ.

Có mất dữ liệu và không mất dữ liệu, nói đơn giản

Nén không mất dữ liệu thu nhỏ tệp mà không đổi một pixel nào. Giải nén PNG, bạn nhận lại đúng những gì đã lưu. Vì vậy nó lý tưởng cho mọi thứ có cạnh sắc và mảng màu phẳng, như chữ, logo, hình vẽ nét, giao diện người dùng và ảnh chụp màn hình, nơi chỉ cần hơi nhòe hay lem màu là thấy ngay.

Nén có mất dữ liệu bỏ bớt những chi tiết mắt khó nhận ra. Ảnh chụp chịu được điều này vì chúng đầy nhiễu và chuyển sắc từ từ. JPEG hoạt động theo cách này, và ở mức chất lượng hợp lý, một bức ảnh có thể nhỏ đi chỉ còn một phần so với bản PNG mà không thấy khác biệt.

Từ đó có hai nguyên tắc thực tế:

• Mỗi lần lưu có mất dữ liệu lại mất thêm một chút. Hãy giữ một bản gốc không mất dữ liệu (ảnh gốc từ máy ảnh, một tệp PNG hoặc tệp riêng của trình chỉnh sửa) và xuất các bản có mất dữ liệu từ đó, thay vì sửa rồi lưu đè cùng một tệp JPEG.
• Nén có mất dữ liệu tệ nhất ở cạnh sắc. Logo lưu dạng JPEG sẽ có "nhiễu muỗi" lem nhem quanh chữ, còn ảnh chụp màn hình thì chữ bị mờ.

Độ trong suốt: yếu tố quyết định với ảnh tách nền

JPEG không có kênh alpha. Không có cách nào lưu "pixel này nhìn xuyên qua được" trong JPEG, nên khi bạn xóa nền rồi lưu JPEG, vùng trống sẽ được tô một màu đặc, thường là trắng hoặc đen. Nếu muốn ảnh tách nền nằm đè lên nội dung khác, bạn cần PNG, WebP hoặc AVIF.

PNG lưu kênh alpha đầy đủ: mỗi pixel có thể ở bất kỳ mức nào từ đục hoàn toàn đến trong suốt hoàn toàn, nhờ vậy các cạnh mềm như tóc, lông và bóng đổ trông tự nhiên. PNG còn có một chế độ đơn giản hơn, trong đó một màu trong bảng màu được đánh dấu là trong suốt, ổn với đồ họa phẳng nhưng cho cạnh răng cưa trên ảnh chụp. Nếu muốn tìm hiểu kỹ, hãy đọc kênh alpha là gì.

WebP hỗ trợ độ trong suốt ở cả chế độ không mất dữ liệu lẫn có mất dữ liệu. Tài liệu WebP của Google cho biết WebP không mất dữ liệu chỉ tốn thêm khoảng 22% dung lượng cho độ trong suốt, và WebP có mất dữ liệu kèm độ trong suốt thường nhỏ hơn khoảng 3 lần so với tệp PNG tương đương. Vì vậy WebP có mất dữ liệu là cách hiệu quả nhất để đưa ảnh sản phẩm nền trong suốt lên website của chính bạn.

Dung lượng tệp

Với cùng một ảnh, thứ tự đại khái từ lớn đến nhỏ là PNG, JPEG, WebP, AVIF, nhưng cần lưu ý: PNG chỉ "nặng" với ảnh chụp. Với đồ họa phẳng ít màu, PNG thường nhỏ hơn JPEG và luôn sắc nét hơn.

Các số liệu Google công bố cho WebP là mốc tham khảo hữu ích:

• Tệp WebP không mất dữ liệu nhỏ hơn PNG 26%.
• Tệp WebP có mất dữ liệu nhỏ hơn JPEG tương đương từ 25 đến 34% ở cùng điểm chất lượng SSIM.

MDN khuyên với ảnh raster trên web nên ưu tiên WebP hoặc AVIF, vốn thường nén tốt hơn PNG, JPEG và GIF. AVIF còn hỗ trợ màu 10 và 12 bit, giúp chuyển sắc mượt hơn. Điểm yếu của nó là hỗ trợ bên ngoài trình duyệt: nhiều ứng dụng và biểu mẫu tải lên vẫn từ chối AVIF.

Dung lượng quan trọng nhất khi bạn phục vụ nhiều ảnh cho nhiều người xem. Với một lần tải lên sàn vốn sẽ nén lại mọi thứ, định dạng mà sàn chấp nhận quan trọng hơn số byte bạn tiết kiệm được.

Định dạng nào được chấp nhận ở đâu

Trình duyệt là phần dễ. Sàn thương mại điện tử và ứng dụng mới là nơi định dạng bị từ chối. Dưới đây là các định dạng được chấp nhận theo tài liệu của chính từng nền tảng, kiểm tra vào tháng 10/2026:

Có hai điểm đáng chú ý. Thứ nhất, Amazon, Walmart và danh mục Meta không nhận WebP và AVIF, nên hãy dùng JPEG hoặc PNG khi tải lên sàn. Thứ hai, Etsy cho biết không hỗ trợ PNG trong suốt và vùng trong suốt có thể hiện màu đen, nên hãy làm phẳng ảnh tách nền lên một màu nền trước khi tải lên đó. Để biết kích thước pixel chính xác cho từng nền tảng, xem bảng kích thước ảnh sản phẩm.

Nên dùng định dạng nào cho từng việc

Logo

Dùng SVG khi bạn có bản gốc vector; MDN khuyên dùng SVG cho logo và biểu tượng. Khi cần tệp raster, hãy dùng PNG nền trong suốt, hoặc WebP không mất dữ liệu trên website của bạn. Đừng bao giờ dùng JPEG: nó làm nhòe quanh các cạnh và không thể trong suốt.

Ảnh sản phẩm

Với ảnh chính trên sàn, hãy dùng JPEG trên nền trắng tinh. Blog dành cho người bán của Amazon gọi JPEG là định dạng được ưu tiên, và mọi sàn trong bảng trên đều chấp nhận nó. Xuất ở mức chất lượng cao (khoảng 85 đến 92 trong đa số công cụ) từ một bản gốc không mất dữ liệu.

Trên cửa hàng riêng, hãy tải lên JPEG hoặc PNG chất lượng cao và để nền tảng tự chuyển đổi. Ví dụ, Shopify cho biết dịch vụ ảnh của họ tự động phục vụ mỗi khách truy cập định dạng tốt nhất mà trình duyệt của họ hỗ trợ.

Ảnh chụp thông thường

JPEG là lựa chọn mặc định an toàn để chia sẻ và tải lên. Trên website bạn quản lý, WebP hoặc AVIF kèm JPEG dự phòng cho hình ảnh như nhau mà nhẹ hơn. Nếu điện thoại lưu ảnh dạng HEIC, hãy chuyển sang JPEG trước khi tải lên những nơi không ghi nhận HEIC.

Ảnh tách nền và ảnh trong suốt

Dùng PNG khi tệp phải chạy được ở mọi nơi: trong slide, văn bản, công cụ thiết kế và hầu hết biểu mẫu tải lên. Dùng WebP khi bạn đặt ảnh trên trang web của chính mình và muốn nó nhẹ. Chỉ dùng JPEG nếu bạn đã chủ động tô nền bằng một màu đặc, ví dụ nền trắng cho sàn thương mại điện tử.

Ảnh chụp màn hình và sơ đồ

PNG, hoặc WebP không mất dữ liệu. Định dạng có mất dữ liệu làm mờ chữ.

Phục vụ định dạng hiện đại kèm phương án dự phòng

Nếu bạn tự vận hành website, bạn không phải chọn chỉ một định dạng. Thẻ HTML picture cho phép trình duyệt chọn định dạng đầu tiên mà nó hiểu:

<picture>
  <source srcset="product.avif" type="image/avif">
  <source srcset="product.webp" type="image/webp">
  <img src="product.png" alt="Leather wallet, front view" width="1200" height="1200">
</picture>

Trình duyệt hỗ trợ AVIF sẽ lấy nguồn đầu tiên, các trình duyệt khác chuyển sang WebP, và mọi trình duyệt cũ hơn dùng PNG. Nhiều nền tảng hosting và CDN ảnh tự làm việc chuyển đổi này dựa trên header Accept của trình duyệt, thường đơn giản hơn so với tự tạo mọi định dạng.

Chuyển đổi định dạng mà không gặp bất ngờ

• PNG hoặc WebP sang JPEG: vùng trong suốt bị làm phẳng. Hãy tự chọn màu tô (thường là trắng) thay vì để công cụ chọn, vì một số công cụ mặc định tô đen.
• JPEG sang PNG: tệp lớn hơn nhưng không đẹp hơn. Chất lượng đã mất ở JPEG không quay lại.
• Định dạng bất kỳ sang WebP hoặc AVIF: kiểm tra độ trong suốt còn nguyên và màu hiển thị đúng; chuyển sang hồ sơ màu sRGB trước nếu ảnh sẽ được xem trên web.
• Lưu lại JPEG nhiều lần: mỗi lần lưu ở chất lượng thấp hơn lại cộng dồn phần mất mát. Hãy xuất một lần từ bản gốc.

Cách nhanh hơn cho ảnh tách nền

Nếu bạn cần tách nền hàng loạt, removebackground.dev xuất ảnh tách nền dạng PNG hoặc WebP trong suốt, hoặc JPG trên bất kỳ màu đặc nào, nên từ cùng một lần tải lên bạn có thể tạo ảnh JPEG nền trắng cho sàn và PNG trong suốt cho website của mình.