Cách tối ưu hóa ảnh trên website bất động sản

Hình ảnh là một trong những yếu tố quan trọng, góp phần nâng cao hiệu quả thiết kế website bất động sản. Tuy nhiên, quá lạm dụng hình ảnh hoặc sử dụng hình ảnh có kích thước lớn sẽ có tác dụng ngược đến người dùng.
Cách tối ưu hóa ảnh trên website bất động sản

Xu hướng hiện nay là sử dụng hình ảnh lớn, toàn độ rộng màn hình, có tác động lớn đến cảm xúc của khách truy cập. Nhưng hình ảnh cũng là con dao 2 lưỡi đối với website bất động sản nếu bạn sử dụng không đúng cách.

3 giây là khoảng thời gian tạo ấn tượng với khách truy cập. Bên cạnh đó, Google đã tuyên bố rằng tốc độ tải trang sẽ ảnh hưởng đến thứ hạng tìm kiếm của một website. Và hình ảnh là một trong những yếu tố có tác động đến tốc độ tải trang, việc sử dụng hình ảnh quá lớn hoàn toàn không cần thiết.

Cách tối ưu hóa hình ảnh trên thiết kế website bất động sản

Để dễ hiểu hơn, chúng tôi sẽ lấy ví dụ minh họa cụ thể cho vấn đề này. Dưới đây là một hình ảnh tiêu chuẩn được chụp bởi iPhone:
 
Cách tối ưu hóa ảnh trên website bất động sản 2

Khi bạn nhấp vào hình ảnh, bạn sẽ thấy độ lớn của hình ảnh (kích thước thực tế là 4032px × 3024px). Trong khi đó, độ phân giải lớn nhất của các màn hình hiện nay là 1920 × 1080. Điều này có nghĩa rằng hình ảnh lớn hơn 200% so với màn hình hiển thị.

Một khía cạnh khác có thể so sánh là: kích thước tệp của hình ảnh là 4.3mb, trong khi kích thước trung bình của một trang web trong năm 2016 là 2.5mb. Điều này có nghĩa rằng hình ảnh bạn bạn tải lên có kích thước gấp 172% so với một trang web trung bình.

Trang web đạt được tốc độ tải nhanh nhất khi kích thước trang ít hơn 2mb. Vậy nếu bạn sử dụng những hình ảnh này, tốc độ tải trang sẽ bị chậm lại một cách đáng kể. Chưa hết, một trang web không chỉ sử dụng 1 hình ảnh mà là sử dụng rất nhiều hình ảnh.

Vậy bạn nên làm gì?

Bạn có thể thay đổi kích thước, giảm kích thước và tối ưu hóa hình ảnh. Kích thước tệp bị chi phối bởi 3 yếu tố:
  • Các kích thước
  • Độ phân giải (DPI)
  • Các dữ liệu lưu trữ (mọi thứ từ thời gian cho đến loại camera, phụ thuộc vào loại tệp tin)

Thay đổi kích thước (hoặc crop)

Hãy thay đổi kích thước hình ảnh xuống kích thước tối ưu. Một số chỉ số để bạn tham khảo:
  • Nếu hình ảnh toàn độ rộng màn hình, ảnh không được rộng hơn 2000px.
  • Nếu hình ảnh đặt trong phần nội dung, bạn nên xem xét kích thước phù hợp, thường thì nhỏ hơn 1000px.

Giảm DPI 

Thiết kế website bất động sản không yêu cầu mức độ DPI quá cao. Tiêu chuẩn ảnh là 72, bạn cũng có thể để hình ảnh xuống 60 DPI nếu bạn không cần hình ảnh phải quá rõ nét.
 
Cách tối ưu hóa ảnh trên website bất động sản 3

Chỉ cần 2 điều chỉnh trên bạn đã giảm hình ảnh từ 4.3mb xuống còn 954kbs (chỉ bằng 22% so với ảnh gốc). Crop ảnh với kích thước phù hợp hơn (750px) sẽ tiếp tục giảm ảnh xuống 549kb (chỉ còn 13% so với ảnh gốc)

Tối ưu hóa/nén

Cuối cùng, bằng cách đưa ảnh thành một tệp tối ưu hóa để loại bỏ những dữ liệu không cần thiết, kích thước ảnh cuối cùng chỉ còn 499kb (11.6% so với ảnh gốc).

499kb vẫn là một tệp lớn trên trang web, nhưng sau một số thử nghiệm, tốc độ tải khoảng 0.2 giây so với tốc độ tải bức ảnh 4.3mb ban đầu là 1.1 giây là hoàn toàn chấp nhận được.

Như vậy, tối ưu hóa nội dung website bao gồm cả tối ưu hóa hình ảnh. Điều bạn cần làm là cắt giảm hình ảnh cả về kích thước, khối lượng và độ phân giải phù hợp để tăng thời gian tải trang nhanh nhất có thể.

Ngoài ra đừng nên quên tìm một công ty thiết kế web chuyên nghiệp và uy tín giúp đỡ bạn nhanh chóng xây dựng ra trang web và đảm bảo tốc độ tải trang.

Tác giả bài viết: Hằng Nguyễn

Tổng số điểm của bài viết là: 0 trong 0 đánh giá

Click để đánh giá bài viết
Bạn đã không sử dụng Site, Bấm vào đây để duy trì trạng thái đăng nhập. Thời gian chờ: 60 giây