Cloudinary – công cụ miễn phí giúp bạn tối ưu hóa hình ảnh trong website

January 14, 2018

Có câu: “một bức ảnh có giá trị hơn ngàn lời nói”. Vì thế, việc sử dụng hình ảnh trong thiết kế website, đặc biệt là website bán hàng, trở nên rất quan trọng.

Tuy nhiên, hình ảnh cũng là nguyên nhân số 1 kéo tuột tốc độ tải trang của website.

Theo HTTP Archive, tính đến tháng 4 năm 2017, hình ảnh chiếm đến 66% dung lượng của toàn bộ websites. Vì thế, khi nghĩ đến việc tối ưu website, thay vì để ý đến script và font chữ, hình ảnh nên là ưu tiên số một của bạn. Trớ trêu thay, tối ưu hình ảnh tuy là việc đơn giản nhất một chủ website có thể làm, nhưng lại thường xuyên bị ngó lơ.

3 lợi ích nổi bật khi bạn tối ưu hóa hình ảnh trên website

  • Cải thiện tốc độ tải trang – Người dùng Internet rất ghét phải chờ đợi, nếu ảnh tải lâu, họ sẽ rời bỏ website của bạn không thương tiếc. Đau đớn hơn, Google cũng sẽ để ý tình trạng hoạt động kém này, và đánh tụt hạng website của bạn.
  • Cải thiện SEO – Tối ưu hình ảnh giúp website của bạn tải nhanh hơn - là một yếu tố giúp tăng vị trí website trong kết quả tìm kiếm của Google.
  • Tiết kiệm băng thông – File hình sau khi tối ưu có dung lượng nhỏ còn giúp website thân thiện hơn với các trình duyệt web.

Cloudinary - công cụ miễn phí giúp bạn tối ưu hình ảnh hiệu quả.

Mục tiêu khi tối ưu hình ảnh là tìm ra điểm cân bằng để file ảnh có dung lượng thấp nhất với chất lượng chấp nhận được.

Lời khuyên thường gặp nhất khi tối ưu hình ảnh là nén ảnh trước khi upload lên website.

Việc này có thể được thực hiện dễ dàng nhờ các phần mềm chỉnh sửa hình ảnh offline lẫn online - phổ biến nhất là Photoshop.

Quy trình resize ảnh thông thường là: mở file hình ảnh trong Photoshop, hoặc upload hình ảnh lên phần mềm chỉnh ảnh online. Chạy lệnh resize. Sau đó tải về máy tính, rồi mới upload lên website.

Dễ thì có dễ. Nhưng tốn khá nhiều thời gian.

Cloudinary “ngầu” hơn nhiều. Phần mềm này không những cho phép bạn lưu trữ hình ảnh, resize, crop, nén ảnh… mà còn cung cấp hàng tá các chức năng chỉnh sửa hình ảnh khác như tạo đường viền, thay đổi độ mờ (opacity), thêm gradient,… mà không cần cài đặt, tải xuống rồi up lên lại máy chủ loằng ngoằng.

Tuyệt nhất là, bạn có thể dùng miễn phí trọn đời. Đăng ký tài khoản Cloudinary tại đây.

Một vài ví dụ về những tính năng bạn có thể dùng với Cloudinary.

1. Giảm kích thước ảnh

Ảnh gốc - kích thước: 360 KB

cloudinary-original

Sau khi resize với độ rộng 800 px và quality 80 - kích thước: 46 KB

cloudinary-resize-quality

2. Thêm hiệu ứng cho ảnh

Chỉnh sửa hình ảnh với những hiệu ứng cực ngầu một cách dễ dàng.

Ảnh với opacity 50 và border 14 px:

cloudinary-opacity-border

Ảnh dùng hiệu ứng cartoonify:

cloudinary-cartoonify

Kết hợp opacity và blur:

cloudinary-opacity-blur

3. Thêm watermark

cloudinary-them-watermark

…Còn rất nhiều hiệu ứng khác đang chờ bạn khám phá đấy.


Liên hệ

Trụ sở chính
61 Mai Xuân Thưởng, P.3, Q.6, TP.HCM
Hotline
090.3636.270
Email
info@connected.com.vn

Kết nối

Về Connected

Made with ❤️ by Connected