Kinh Bắc Web xin có chút kinh nghiệm về tối ưu hình ảnh để giúp đỡ các bác tăng tốc độ website WordPress:
1. Sử dụng thumbnail, image size phù hợp với các kích cỡ hiển thị
– Ví dụ: Khung hiển thị giới thiệu bài viết có size tầm 300x200px thì các bác cần cắt ảnh image size kích cỡ như thế chứ không nên được dùng ảnh full size để nhét vào đó. Page speed google đánh giá cực chặt vấn đề này và nếu các bác vi phạm sẽ bị hạ điểm cực nhiều.
2. Nếu các bác sử dụng share host, không nên để quá nhiều ảnh load trên 1 trang
– Hạn chế tối đa hoặc cần dùng các kĩ thuật lazyload để tải ảnh dần theo hành vi load trang của người dùng.
3. Không bao giờ để người dùng tải ảnh full khi load trang, ảnh full dung lượng có thể tới vài MB, vài ảnh cũng đủ khổ người dùng rồi.
– Lúc này plugin hỗ trợ tối ưu có thể giúp các bạn tối ưu, nó sẽ nén đáng kể lại dung lượng của ảnh full và tất cả ảnh image size
– Các bác hiển thị ảnh max size chỉ nên sử dụng load ảnh có size bằng với kích cỡ width tối đa của bài viết – còn ảnh full chỉ nên liên kết thành link của ảnh, khi người dùng hover hay click vào ảnh sẽ xem được ảnh full với các hiệu ứng image zoom jquery
1. Sử dụng thumbnail, image size phù hợp với các kích cỡ hiển thị
– Ví dụ: Khung hiển thị giới thiệu bài viết có size tầm 300x200px thì các bác cần cắt ảnh image size kích cỡ như thế chứ không nên được dùng ảnh full size để nhét vào đó. Page speed google đánh giá cực chặt vấn đề này và nếu các bác vi phạm sẽ bị hạ điểm cực nhiều.
2. Nếu các bác sử dụng share host, không nên để quá nhiều ảnh load trên 1 trang
– Hạn chế tối đa hoặc cần dùng các kĩ thuật lazyload để tải ảnh dần theo hành vi load trang của người dùng.
3. Không bao giờ để người dùng tải ảnh full khi load trang, ảnh full dung lượng có thể tới vài MB, vài ảnh cũng đủ khổ người dùng rồi.
– Lúc này plugin hỗ trợ tối ưu có thể giúp các bạn tối ưu, nó sẽ nén đáng kể lại dung lượng của ảnh full và tất cả ảnh image size
– Các bác hiển thị ảnh max size chỉ nên sử dụng load ảnh có size bằng với kích cỡ width tối đa của bài viết – còn ảnh full chỉ nên liên kết thành link của ảnh, khi người dùng hover hay click vào ảnh sẽ xem được ảnh full với các hiệu ứng image zoom jquery
Tp Image Optimizer là một plugin chất lượng nén rất tốt các bạn có thể tham khảo link plugin (//wordpress.org/plugins/tp-image-optimizer/) Các bạn có thể tải nó trên kho Plugin WordPress.org hoặc trong trình cài đặt plugin wordpress nhé.
