Nén tối ưu ảnh cho website bằng TinyPNG

Nén ảnh bằng TinyPNG là cách giảm dung lượng ảnh trước khi đưa lên website mà mắt thường gần như không thấy khác. Mỗi ảnh nhẹ đi thường từ 40 tới 70 phần trăm. Cả quy trình cho một bộ ảnh vài chục tấm mất chừng năm tới mười phút, không cần cài phần mềm.

1. Chuẩn bị các ảnh cần nén, để chung một thư mục trên máy.
2. Mở trang TinyPNG và kéo ảnh vào ô nén.
3. Chờ nén xong rồi tải ảnh nhẹ về máy.
4. Thay ảnh cũ trên website bằng ảnh vừa nén.

Ảnh nặng làm website chậm ở chỗ nào

Ảnh thường là thứ nặng nhất trên một trang web. Một tấm ảnh chụp từ điện thoại có thể lên tới bốn hoặc năm MB, trong khi cả trang chỉ nên nặng dưới hai MB. Trình duyệt phải tải hết ảnh mới dựng xong trang, nên ảnh càng nặng thì người xem càng chờ lâu.

Chuyện này rõ nhất trên điện thoại dùng mạng yếu. Bạn mở một trang có mười ảnh chưa nén, mỗi ảnh ba MB, là ba mươi MB phải tải. Nén xuống còn một phần ba thì trang mở nhanh hơn hẳn mà nhìn vẫn như cũ.

TinyPNG nén ảnh bằng cách nào mà vẫn giữ nét

TinyPNG dùng kỹ thuật nén có mất dữ liệu nhưng gom các màu gần giống nhau lại thành một, giảm số màu phải lưu. Cách này cắt được phần lớn dung lượng của ảnh chụp và ảnh đồ hoạ nhiều màu mà mắt người khó nhận ra khác biệt. Công cụ nhận cả định dạng PNG và JPG.

Điểm mạnh là bạn không phải chỉnh thông số gì. Kéo ảnh vào là công cụ tự chọn mức nén hợp lý cho từng tấm. Ảnh PNG có nền trong suốt thì phần trong suốt vẫn giữ nguyên sau khi nén.

Nén một bộ ảnh bằng TinyPNG từng bước

Toàn bộ việc làm trên trình duyệt, không cần tài khoản. Bản miễn phí cho nén tối đa hai mươi ảnh mỗi lần, mỗi ảnh dưới năm MB. Nếu bộ ảnh nhiều hơn, bạn chia thành nhiều đợt.

1. Mở trang nén và kéo ảnh vào

Vào trang TinyPNG, bạn sẽ thấy một ô lớn ghi kéo thả ảnh vào đây. Mở thư mục ảnh trên máy, chọn các ảnh cần nén rồi kéo thẳng vào ô đó. Có thể chọn nhiều ảnh một lúc bằng cách giữ phím Ctrl khi bấm.

2. Chờ thanh nén chạy xong

Mỗi ảnh hiện một dòng với thanh tiến trình. Nén xong, dòng đó ghi rõ ảnh giảm bao nhiêu phần trăm, ví dụ giảm 63 phần trăm. Bộ hai mươi ảnh thường xong trong khoảng một phút tuỳ tốc độ mạng.

3. Tải ảnh nhẹ về máy

Bấm nút tải từng ảnh, hoặc bấm tải tất cả để nhận một file nén chứa toàn bộ ảnh đã nén. Bạn nên tải về một thư mục mới để không lẫn với ảnh gốc, phòng khi cần dùng lại bản gốc.

So sánh trước và sau khi nén một ảnh chụp

Con số dưới đây lấy từ một ảnh chụp sản phẩm cỡ thường gặp trên website bán hàng. Mức giảm tuỳ ảnh, ảnh nhiều chi tiết giảm ít hơn ảnh nền phẳng, nhưng khoảng giảm chung khá ổn định.

Thay ảnh cũ trên website bằng ảnh vừa nén

Ảnh đã nén giờ là file mới trên máy bạn. Giờ chỉ cần đưa nó lên website thay cho ảnh nặng cũ. Cách đưa lên tuỳ nền tảng bạn dùng, nhưng nguyên tắc chung là xoá ảnh cũ rồi tải ảnh mới vào đúng chỗ.

Trên website WordPress, bạn vào Thư viện Media, xoá ảnh cũ và tải ảnh nén lên, sau đó gắn lại vào bài. Nếu bạn quản lý website qua bảng điều khiển hosting, bạn dùng trình quản lý file để thay ảnh trong thư mục chứa ảnh của trang.

Vài điểm dễ vấp khi nén ảnh

Lỗi hay gặp nhất là nén nhưng chưa giảm kích thước điểm ảnh. TinyPNG giữ nguyên chiều rộng chiều cao, nên nếu ảnh gốc là 4000 điểm mà chỗ hiển thị chỉ cần 800 điểm, ảnh vẫn thừa. Bạn nên thu nhỏ điểm ảnh về đúng cỡ hiển thị trước, rồi mới nén.

Một điểm nữa là đừng nén đi nén lại cùng một ảnh nhiều lần. Mỗi lần nén lại làm ảnh mất thêm chi tiết, tới lúc nào đó sẽ thấy nhoè. Nén một lần từ ảnh gốc là đủ. Nếu cần bản chất lượng cao hơn, quay lại nén từ ảnh gốc chứ không nén tiếp bản đã nén.

Việc nên làm tiếp sau khi nén

Sau khi thay hết ảnh nặng bằng ảnh nén, bạn nên đo lại tốc độ trang để thấy khác biệt thật. Nếu website còn nhiều ảnh cỡ lớn hiển thị ở khung nhỏ, cân nhắc chuyển ảnh sang định dạng WebP để nhẹ thêm một mức nữa. Ảnh là phần dễ tối ưu nhất, làm một lần dùng được lâu.