Sử dụng hình ảnh trong bài viết là việc không thể nào bỏ qua bởi những hình ảnh lồng trong bài viết sẽ làm cho bài viết có giá trị hơn, người đọc dễ hiểu và dễ tưởng tượng tới vấn đề hơn… Nhưng việc upload ảnh lên tuỳ tiện thì sẽ làm bạn bị tốn thêm dung lượng của website. Mà tốn quá nhiều dung lượng nhất là trên wordpress sẽ gây ra những hậu quả nhất định. Vậy phải upload hình ảnh như thế nào để được tối ưu nhưng vẫn đảm bảo chất lượng? Hãy cùng nhau tìm hiểu trong bài viết này.
Phải sử dụng định dạng ảnh nào trên website?
Không phải ngẫu nhiên mà người ta lại chia ra làm đủ các loại định dạng hình ảnh như GIF, PNG-8 hoặc PNG-24 và JPEG bởi mỗi định dạng sẽ có một tác dụng khác nhau cho dù nhìn sơ qua thì bạn thấy nó cũng khá giống nhau đó là chỉ hiển thị hình ảnh. Tác dụng của mỗi loại ảnh như sau.
- GIF: Là ảnh động.
- PNG-8: Ảnh có độ nét cao nhưng màu chỉ sử dụng trong bảng RBG mà thôi
- PNG-24: Giống nảh PNG-8 nhưng có hỗ trọ đa màu
- JPEG/JPG: Định dạng phổ biến nhất do kích thước nhỏ, có thể giảm chất lượng ảnh, có hỗ trợ nhiều màu Nhưng không hỗ trợ ảnh trong suốt
Khi nào nên dùng ảnh JPEG?
Nên sử dụng JPEG khi có nhiều màu sắc trong hình, có dốc màu (gradient) Hình ảnh sẽ chi tiết, sắc nét và màu sắc đẹp hơn
Gif Vs Jpeg
Ưu tiên hơn với các hình có màu đa dạng bởi JPEG sẽ hỗ trợ tốt hơn.
Khi nào sử dụng ảnh PNG?
PNG-8 Hay PNG-24 thì cũng khá là giống nhau về đặc tính. bạn có thể thay thế ảnh JPEG bằng ảnh PNG-24 khi làm ảnh trong suốt hoặc các hình ảnh có màu sắc đơn giản, ít màu sắc.
Ảnh PNG-24 sẽ phù hợp hơn với các bạn nào muốn giữ nguyên chất lượng, dung lượng hình ảnh khi upload lên website. Bởi với kiểu nén Lossless của PNG-24 sẽ giữ chất lượng hình ảnh tốt hơn kiểu nén Lossy của JPEG. Khuyến khích các bạn nên sử dụng luôn ảnh PNG-24 nếu không có nhu cầu ảnh động bởi khi sử dụng các côgn cụ giảm dung lượng của ảnh PNG-24 thì dung lượng ảnh giảm nhưng chất lượng tương đương.
So sánh giữa PNG và JPEG
Để so sánh mình xin được đưa ra 2 tấm hình chụo băng snagit và mình lưu lại dưới 2 định dạng khác nhau đó là PNG và JPEG để các bạn dễ so sánh.
JPEG – 45kB
PNG – 13KB
Hãy nén ảnh trước khi tải lên website
Thiết kế website bán hàng với quá nhiều hình ảnh mà không được tối ưu sẽ dẫn tới tình trạng website load cực kì chậm. Bạn nên sử dụng các công cụ để nén ảnh lại trước khi đăng lên website bởi bằng mắt thường chúng ta sẽ khó mà phân biệt được chất lượng của hình ảnh khi giảm dung lượng với hình ảnh gốc. Điều này có thể tiết kiệm tới 80% dung lượng website từ đó giúp trang web của bạn trở nên nhanh hơn.
Mình xin được giới thiệu cho các bạn một số phần mềm giảm dung lượng ảnh tốt nhất hiện nay. Được chia làm ba nền tảng.
- Trên windows: Caesium, PngOptimizer, EWWW Image Optimizer
- Trên MacOS: ImageOptim
- Trực tiếp trên web: Krake, Nén trên WordPress, WP Smush.
Giảm kích thước ảnh
Có một điều khi bạn thiết kế website cũng như khi đăng các bài viết có hình ảnh cần nhớ đó là không cần phải upload các hình ảnh có chất lượng cao lên website trừ các trang web chuyên dụng để hiển thị và tải hình ảnh. Còn lại với mắt thường bạn chỉ nên đăng các hình ảnh có chiều rộng tối đa là 1024px bởi quá lớn sẽ khiến người đọc phải zoom lên mới thấy hết hay thậm chí với thiết bị di động còn có thể sẽ bị lỗi khi hiển thị quá lớn và che cả màn hình.
Lời kết
Vậy tại sao mình lại phải sử dụng hình ảnh hợp lý? đó là bởi vì nó liên quan tới lợi nhuận của công ty hay doanh nghiệp bạn đó. Upload hình ảnh dung lượng lớn sẽ làm bạn tốn dung lượng lưu trữ, tốn băng thông từ đó bạn sẽ cần một máy chủ mới hoặc tốn tiền hơn khi thuê host. Ngoài ra không tối ưu hình ảnh sẽ làm trang web trở nên ì ạch và load chậm. Hãy tối ưu hình ảnh cho website của bạn ngay hôm nay!
