Nén Hình Ảnh

Mỗi bức ảnh chứa nhiều thông tin hơn mức mắt bạn có thể phân biệt. Nén tìm ra phần dư thừa đó và loại bỏ nó: các giá trị màu lặp lại trên nền trời quang, chi tiết độ sáng trong vùng tối mà mắt đọc thành đồng nhất, những biến thiên ở mức không ai xem xét. Còn lại là một tệp nhỏ hơn nhiều nhưng vẫn được đọc thành cùng bức ảnh đó.

Có thể loại bỏ bao nhiêu trước khi khác biệt trở nên rõ ràng phụ thuộc vào từng ảnh. Ảnh chân dung với hậu cảnh mờ nén được rất nhiều; ảnh chụp màn hình dày chữ nhỏ, hoặc ảnh nhiều cạnh sắc và kết cấu mịn, có ít phần dư thừa hơn và xuất hiện nhiễu sớm hơn. Vì vậy hai ảnh cùng kích thước có thể phản ứng rất khác nhau ở cùng một mục tiêu.

Các định dạng có mất dữ liệu như JPEG, WebP và AVIF loại bỏ thông tin vĩnh viễn để đổi lấy tệp nhỏ hơn nhiều. Các định dạng không mất dữ liệu như PNG sắp xếp lại dữ liệu hiệu quả hơn mà không bỏ đi thứ gì, giữ ảnh giống hệt từng pixel nhưng đặt ra giới hạn rõ ràng về mức có thể nhỏ đến đâu.

Với ảnh chụp, nén có mất dữ liệu gần như luôn là lựa chọn đúng: mức tiết kiệm lớn và ở thiết lập hợp lý thì không nhìn thấy được ở kích thước xem bình thường. Với logo, sơ đồ và ảnh chụp màn hình có chữ, PNG không mất dữ liệu thường tốt hơn, vì nhiễu tập trung đúng ở các cạnh sắc, nơi chúng dễ thấy nhất.

Hình ảnh thường là thành phần nặng nhất của một trang web, nhiều khi nặng hơn cả HTML, CSS, JavaScript và phông chữ cộng lại. Vì thế đó là nơi đầu tiên cần xem khi một trang có cảm giác chậm.

Ảnh quá lớn ảnh hưởng trực tiếp tới Largest Contentful Paint, một trong các Core Web Vitals của Google. Ảnh bìa mất ba giây để hiện ra sẽ làm chậm thời điểm người truy cập thấy một trang dùng được, và trên kết nối di động ảnh hưởng này còn lớn hơn. Ba thay đổi luôn hữu ích: nén về một mục tiêu hợp lý, phục vụ ảnh đúng kích thước thực sự hiển thị và ưu tiên WebP ở nơi bạn kiểm soát mã nguồn.

Biểu mẫu tải lên thường áp giới hạn cứng. Hồ sơ xin việc, cổng thông tin đại học, giấy tờ thị thực và đăng ký thi cử thường giới hạn ảnh và bản quét chữ ký ở 20 KB, 50 KB, 100 KB hoặc 200 KB, và từ chối mọi tệp vượt mức mà không giải thích.

Vì ở đây bạn đặt dung lượng mục tiêu rõ ràng thay vì phần trăm chất lượng, việc đáp ứng các giới hạn đó rất trực tiếp: nhập mức tối đa mà biểu mẫu yêu cầu rồi tải kết quả về. Nếu cổng thông tin còn nêu kích thước pixel, hãy giảm kích thước trước rồi mới nén — kết quả sạch hơn hẳn so với việc ép một ảnh nguyên độ phân giải xuống một tệp rất nhỏ.

Nén lại một tệp JPEG đã nén sẽ làm giảm chất lượng. Mỗi lần xử lý lại bỏ đi thêm một phần và các mất mát dồn lại, nên hãy luôn làm việc từ bản gốc chất lượng cao nhất bạn có thay vì một tệp đã qua quy trình này nhiều lần.

Lưu ảnh chụp dưới dạng PNG là một sai lầm phổ biến khác: kết quả thường lớn gấp nhiều lần tệp JPEG tương đương mà không có lợi ích nhìn thấy được. Ngoài ra không có lý do gì để nén thấp hơn nhiều so với mức cần: nếu biểu mẫu cho phép 200 KB, việc ép ảnh xuống 40 KB chỉ làm mất chất lượng rõ rệt một cách vô ích.