Tối ưu hóa hình ảnh cho SEO
6 min
Tối ưu hóa hình ảnh tác động đến cả thứ hạng tìm kiếm (qua Google Image Search và Core Web Vitals) và trải nghiệm người dùng. Bốn hành động thiết yếu là: chọn định dạng phù hợp (WebP hoặc AVIF), nén mà không mất chất lượng rõ rệt, điền thẻ alt và triển khai lazy loading. Những hành động này đơn thuần có thể giảm LCP từ 20 đến 40%.
Hình ảnh chiếm trung bình 50 đến 70% kích thước một trang web. Không được tối ưu, chúng làm giảm Core Web Vitals và ảnh hưởng xấu đến thứ hạng. Được tối ưu tốt, chúng mở ra kênh lưu lượng bổ sung qua Google Hình ảnh.
Chọn định dạng hình ảnh phù hợp
Định dạng WebP cung cấp khả năng nén cao hơn 25 đến 35% so với JPEG với chất lượng hình ảnh tương đương. AVIF còn đi xa hơn nhưng khả năng tương thích trình duyệt của nó, mặc dù tốt vào năm 2026, vẫn cần kiểm tra theo đối tượng của bạn.
Hình ảnh vector (logo, biểu tượng, minh họa) phải ở định dạng SVG: chúng nhẹ, có thể co giãn và không bao giờ bị xuống cấp.
PNG vẫn phù hợp chỉ cho hình ảnh cần độ trong suốt hoặc chất lượng tuyệt đối mà không nén - các trường hợp hiếm trong bối cảnh web tiêu chuẩn.
- Ảnh chụp và hình ảnh phức tạp: WebP hoặc AVIF.
- Logo, biểu tượng, minh họa: SVG.
- Ảnh chụp màn hình có văn bản: WebP với nén vừa phải (chất lượng 80-85).
- Tránh GIF động: thay thế bằng video MP4 ngắn, nhẹ hơn 5 đến 10 lần.
Nén và kích thước phù hợp
Một hình ảnh rộng 3.000 px được hiển thị trong cột 800 px truyền tải 3 đến 4 lần nhiều dữ liệu hơn cần thiết. Luôn thay đổi kích thước trước khi nén.
Nhắm đến trọng lượng dưới 100 KB cho các hình ảnh phụ, dưới 200 KB cho hình ảnh hero hoặc hình ảnh chính. Vượt quá đó, tác động lên LCP trở nên có thể đo lường được.
Việc nén và thay đổi kích thước hình ảnh có thể giảm thời gian tải ban đầu từ 20 đến 40% trên các trang không được tối ưu, với tác động trực tiếp lên điểm Core Web Vitals.
Nghiên cứu ngành 2025-2026 về hiệu suất web và SEO
Thẻ alt, tên file và dữ liệu có cấu trúc
Thẻ alt là văn bản duy nhất mà Google có thể liên kết với một hình ảnh. Nó phải mô tả nội dung hình ảnh một cách chính xác, tích hợp tự nhiên từ khóa nếu phù hợp, mà không gượng ép.
Tên file là thứ yếu nhưng hữu ích: sử dụng từ khóa được phân tách bằng dấu gạch ngang (toi-uu-hinh-anh-seo.webp) thay vì IMG_4821.jpg.
Đối với hình ảnh sản phẩm hoặc hình ảnh chính, thêm dữ liệu có cấu trúc ImageObject hoặc Product với Schema.org để tăng khả năng hiển thị trong Google Hình ảnh và kết quả phong phú.
Lazy loading và hiệu suất
Lazy loading chỉ tải hình ảnh khi chúng xuất hiện trong viewport. Điều này giảm trọng lượng ban đầu của trang và cải thiện điểm FCP (First Contentful Paint).
Lưu ý: đừng bao giờ áp dụng lazy loading cho hình ảnh hero hoặc LCP - Google và trình duyệt phải tải nó ngay lập tức. Sử dụng loading='eager' hoặc bỏ qua thuộc tính cho hình ảnh ưu tiên này.
- Thêm loading='lazy' cho tất cả hình ảnh ngoài viewport ban đầu.
- Xác định rõ ràng các thuộc tính width và height để tránh dịch chuyển bố cục (CLS).
- Sử dụng srcset để đề xuất độ phân giải phù hợp theo màn hình người dùng.
FAQ
Lazy loading có được hỗ trợ bởi các trình duyệt không?
Có, từ năm 2019 cho Chrome và các trình duyệt hiện đại, và từ năm 2021 cho Firefox. Thuộc tính loading='lazy' là đủ mà không cần thư viện JavaScript bên ngoài cho hầu hết các website.
Google có lập chỉ mục hình ảnh WebP không?
Có, Google hỗ trợ và lập chỉ mục hình ảnh WebP và AVIF mà không có vấn đề gì. Những định dạng này thậm chí được khuyến nghị bởi hướng dẫn PageSpeed Insights của Google để giảm trọng lượng trang.
Thiếu thẻ alt có ảnh hưởng xấu đến SEO không?
Nó không phạt trực tiếp, nhưng nó tước đoạt của Google một tín hiệu ngữ cảnh và loại trừ hình ảnh khỏi thứ hạng trong Google Hình ảnh. Trên website thương mại điện tử hoặc blog có nhiều hình ảnh, việc thiếu thẻ alt đại diện cho sự mất lưu lượng đáng kể.