Trong bối cảnh tìm kiếm trực quan ngày càng trở nên phổ biến, tối ưu hoá SEO cho hình ảnh trên Google là một bước quan trọng để nâng cao khả năng hiển thị của trang web. Hình ảnh không chỉ giúp cải thiện trải nghiệm người dùng mà còn có thể đóng góp đáng kể vào hiệu suất SEO của trang. Trong bài viết này, chúng ta sẽ khám phá các phương pháp hay nhất để tối ưu hoá hình ảnh cho kết quả tìm kiếm trên Google, từ việc lập chỉ mục đến tối ưu hoá trang đích và sử dụng các định dạng hình ảnh thích hợp.
Google cung cấp nhiều sản phẩm và tính năng trên công cụ tìm kiếm để hỗ trợ người dùng khám phá thông tin trực quan trên web, bao gồm các định dạng như kết quả hình ảnh minh hoạ cho văn bản, Google khám phá và Google hình ảnh. Mặc dù mỗi tính năng và sản phẩm có những đặc điểm riêng biệt, nhưng các phương pháp tối ưu hoá để hình ảnh xuất hiện trong các kết quả tìm kiếm của những tính năng này lại tương đồng.
Để đảm bảo hình ảnh của bạn được tối ưu hoá và có cơ hội xuất hiện cao hơn trong kết quả tìm kiếm của Google, bạn cần áp dụng những chiến lược SEO hình ảnh tốt nhất:
- Giúp chúng tôi khám phá và lập chỉ mục hình ảnh của bạn
- Tối ưu hoá trang đích của hình ảnh
Giúp chúng tôi khám phá và lập chỉ mục hình ảnh của bạn
Để giúp Google khám phá và lập chỉ mục hiệu quả hình ảnh trên trang web của bạn, cần tuân thủ các yêu cầu kỹ thuật nhất định trong quá trình tối ưu hóa. Mặc dù các nguyên tắc chung về SEO áp dụng cho nội dung văn bản cũng được áp dụng cho hình ảnh, nhưng do hình ảnh có định dạng khác biệt so với HTML, nên cần phải thực hiện thêm các bước chuyên biệt để đảm bảo hình ảnh được lập chỉ mục đúng cách. Điều này bao gồm việc tối ưu hoá quá trình tìm kiếm hình ảnh trên trang và cách hình ảnh được hiển thị, nhằm đảm bảo rằng chúng có liên quan và chứa các từ khoá phù hợp.
Sử dụng các phần tử hình ảnh HTML để nhúng hình ảnh
Việc sử dụng các phần tử HTML tiêu chuẩn như <img> để nhúng hình ảnh vào trang là rất quan trọng. Các trình thu thập dữ liệu của Google (Googlebot) có khả năng phát hiện và xử lý hình ảnh thông qua thuộc tính src của thẻ <img>. Ngay cả khi hình ảnh là phần tử con của các thẻ khác, chẳng hạn như <picture>, Google vẫn có thể thu thập dữ liệu và lập chỉ mục hình ảnh. Tuy nhiên, hình ảnh được nhúng thông qua CSS sẽ không được Google lập chỉ mục.
Ví dụ tốt:
<img src="puppy.jpg" alt="Chú chó retriever lông vàng" />
Ví dụ kém:
<div style="background-image:url(puppy.jpg)">Chú chó retriever lông vàng</div>
Dùng sơ đồ trang web dành cho hình ảnh
Việc sử dụng sơ đồ trang web dành cho hình ảnh là một chiến lược quan trọng trong SEO nhằm đảm bảo rằng tất cả hình ảnh trên trang web của bạn được Googlebot phát hiện và lập chỉ mục. Bằng cách gửi sơ đồ trang web chuyên biệt cho hình ảnh, bạn có thể cung cấp URL của những hình ảnh mà Google có thể không tự động tìm thấy thông qua quá trình thu thập dữ liệu thông thường.
Không giống như sơ đồ trang web tiêu chuẩn, sơ đồ trang web dành cho hình ảnh cho phép bạn đưa vào các URL từ những miền khác nhau trong phần tử <image:loc>. Điều này tạo điều kiện cho việc sử dụng CDN (mạng phân phối nội dung) để lưu trữ hình ảnh, giúp tối ưu hóa tốc độ tải trang và phân phối nội dung hiệu quả hơn. Tuy nhiên, nếu bạn sử dụng CDN, điều quan trọng là phải xác minh quyền sở hữu tên miền của CDN trong Google Search Console. Việc này giúp đảm bảo rằng bạn sẽ nhận được thông báo về bất kỳ lỗi thu thập dữ liệu nào mà Google có thể phát hiện, từ đó giúp bạn kịp thời điều chỉnh và tối ưu hóa hiệu suất SEO hình ảnh của mình.
Hình ảnh thích ứng
Thiết kế trang web thích ứng là yếu tố then chốt để nâng cao trải nghiệm người dùng, đảm bảo rằng trang web của bạn có thể truy cập và hiển thị tốt trên nhiều loại thiết bị khác nhau. Việc tối ưu hóa hình ảnh thích ứng đóng vai trò quan trọng trong việc duy trì hiệu suất và tính thẩm mỹ của trang web trên các kích thước màn hình khác nhau. Bạn nên tham khảo các hướng dẫn về tối ưu hóa hình ảnh thích ứng để áp dụng những phương pháp tốt nhất trong xử lý hình ảnh.
Để hỗ trợ việc hiển thị hình ảnh thích ứng, các trang web thường sử dụng phần tử <picture> hoặc thuộc tính srcset trong thẻ <img>. Những thuộc tính này cho phép bạn cung cấp nhiều phiên bản của cùng một hình ảnh, tương thích với các kích thước màn hình khác nhau. Tuy nhiên, cần lưu ý rằng không phải tất cả các trình duyệt và công cụ thu thập dữ liệu đều hỗ trợ đầy đủ các thuộc tính này. Do đó, luôn đảm bảo chỉ định một URL dự phòng qua thuộc tính src để hình ảnh có thể hiển thị đúng cách ngay cả khi thuộc tính srcset hoặc phần tử <picture> không được hỗ trợ.
Ví dụ về việc sử dụng srcset để chỉ định nhiều phiên bản của cùng một hình ảnh cho các kích thước màn hình khác nhau:
<img
srcset="maine-coon-nap-320w.jpg 320w, maine-coon-nap-480w.jpg 480w, maine-coon-nap-800w.jpg 800w"
sizes="(max-width: 320px) 280px, (max-width: 480px) 440px, 800px"
src="maine-coon-nap-800w.jpg"
alt="A watercolor illustration of a maine coon napping leisurely in front of a fireplace">
Phần tử <picture> được sử dụng để nhóm nhiều phiên bản <source> của cùng một hình ảnh, cung cấp một giải pháp dự phòng để trình duyệt có thể chọn phiên bản hình ảnh phù hợp nhất dựa trên khả năng của thiết bị, như mật độ pixel hoặc kích thước màn hình. Đây cũng là giải pháp hữu ích khi bạn sử dụng các định dạng hình ảnh mới nhưng vẫn muốn duy trì khả năng hiển thị trên các ứng dụng chưa hỗ trợ định dạng đó.
Theo mục 4.8.1 của Tiêu chuẩn HTML, hãy nhớ cung cấp phần tử img dưới dạng phần tử dự phòng có thuộc tính src khi sử dụng phần tử picture theo định dạng sau:
<picture>
<source type="image/svg+xml" srcset="pyramid.svg">
<source type="image/webp" srcset="pyramid.webp">
<img src="pyramid.png" alt="An 1800s oil painting of The Great Pyramid">
</picture>
Sử dụng những định dạng hình ảnh được hỗ trợ
Google tìm kiếm hỗ trợ các định dạng hình ảnh được tham chiếu trong thuộc tính src của thẻ <img> bao gồm BMP, GIF, JPEG, PNG, WebP và SVG. Điều này có nghĩa là bạn cần đảm bảo sử dụng đúng định dạng tệp tương ứng với phần mở rộng tệp để tối ưu hóa khả năng hiển thị của hình ảnh trên công cụ tìm kiếm. Việc sử dụng đúng định dạng và phần mở rộng sẽ giúp Google dễ dàng nhận diện và xử lý hình ảnh của bạn.
Ngoài ra, bạn cũng có thể nhúng hình ảnh cùng dòng trực tiếp vào mã HTML dưới dạng URI dữ liệu. URI dữ liệu cho phép nhúng tệp, chẳng hạn như hình ảnh, bằng cách chuyển thuộc tính src của thẻ <img> thành một chuỗi mã hóa Base64. Ví dụ:
<img src="data:image/svg+xml;base64,[data]">
Hình ảnh cùng dòng có thể giảm số lượng yêu cầu HTTP, từ đó giúp tối ưu hóa tốc độ tải trang. Tuy nhiên, cần cân nhắc kỹ lưỡng khi sử dụng phương pháp này, vì nó có thể làm tăng đáng kể kích thước tổng thể của trang web, ảnh hưởng đến hiệu suất tải trang. Để hiểu rõ hơn về ưu và nhược điểm của việc sử dụng hình ảnh cùng dòng, bạn nên tham khảo các tài liệu chuyên môn trên trang web.dev của Google.
Tối ưu hoá để tăng tốc độ và chất lượng
Hình ảnh chất lượng cao không chỉ tạo ấn tượng mạnh mẽ đối với người dùng mà còn đóng vai trò quan trọng trong việc thu hút và giữ chân họ. Đặc biệt, các hình thu nhỏ sắc nét xuất hiện trong kết quả tìm kiếm có thể tăng cường khả năng nhấp chuột, từ đó cải thiện tỷ lệ chuyển đổi. Tuy nhiên, do hình ảnh thường chiếm phần lớn dung lượng tải trang, việc tối ưu hóa kích thước và chất lượng hình ảnh là yếu tố then chốt để đảm bảo trang web không bị chậm và sử dụng tài nguyên một cách hiệu quả.
Hãy áp dụng các phương pháp tối ưu hóa hình ảnh tiên tiến nhất và kỹ thuật hình ảnh thích ứng để đảm bảo trang web của bạn cung cấp trải nghiệm nhanh chóng và chất lượng cao cho người dùng. Sử dụng công cụ PageSpeed Insights để phân tích tốc độ tải trang và truy cập tài liệu “Tại sao tốc độ trang lại quan trọng?” để tìm hiểu các kỹ thuật và phương pháp tốt nhất nhằm nâng cao hiệu suất tổng thể của trang web.
Tối ưu hoá trang đích của hình ảnh
Mặc dù không dễ nhận thấy ngay lập tức, nhưng nội dung và siêu dữ liệu của các trang mà hình ảnh được nhúng có thể tác động đáng kể đến cách và vị trí mà hình ảnh xuất hiện trong kết quả tìm kiếm của Google.
Kiểm tra tiêu đề và nội dung mô tả trang
Google Tìm kiếm tự động tạo tiêu đề liên kết và đoạn trích nhằm cung cấp mô tả tốt nhất về từng kết quả và mức độ liên quan của kết quả đó với từ khóa tìm kiếm của người dùng. Điều này giúp người dùng quyết định xem có nên nhấp vào kết quả hay không. Dưới đây là hai ví dụ về cách tiêu đề liên kết và đoạn trích hiển thị trên trang kết quả tìm kiếm của Google:
Chúng tôi sử dụng nhiều nguồn thông tin khác nhau, bao gồm cả dữ liệu từ thẻ title và meta của từng trang.
Bạn có thể cải thiện chất lượng tiêu đề liên kết và đoạn trích hiển thị cho các trang của mình bằng cách tuân theo nguyên tắc của Google về tiêu đề và đoạn trích.
Thêm dữ liệu có cấu trúc
Nếu bạn triển khai dữ liệu có cấu trúc, Google có thể hiển thị hình ảnh của bạn trong các kết quả nhiều định dạng, chẳng hạn như huy hiệu nổi bật trên Google Hình ảnh, giúp cung cấp thông tin liên quan về trang của bạn và có thể tăng cường lưu lượng truy cập mục tiêu một cách hiệu quả hơn đến website của bạn.
Hãy tuân thủ nguyên tắc chung đối với dữ liệu có cấu trúc cũng như các nguyên tắc cụ thể cho loại dữ liệu có cấu trúc mà bạn sử dụng. Nếu không, dữ liệu có cấu trúc của bạn có thể không đủ điều kiện để xuất hiện trong các kết quả nhiều định dạng trên Google Hình ảnh. Trong mỗi loại dữ liệu có cấu trúc đã nêu, thuộc tính hình ảnh là trường bắt buộc để trang đủ điều kiện xuất hiện kèm theo huy hiệu và trong các kết quả nhiều định dạng trên Google Hình ảnh. Dưới đây là hai ví dụ về cách hiển thị kết quả nhiều định dạng trên Google Hình ảnh:
Sử dụng tên tệp, tiêu đề và văn bản thay thế mang tính mô tả
Google trích xuất thông tin về chủ đề của hình ảnh dựa trên nội dung của trang, bao gồm cả chú thích và tiêu đề của hình ảnh. Hãy đảm bảo hình ảnh được đặt gần văn bản liên quan và xuất hiện trên các trang có nội dung phù hợp với chủ đề của hình ảnh bất cứ khi nào có thể.
Tên tệp cũng có thể cung cấp thông tin ban đầu cho Google về chủ đề của hình ảnh. Hãy sử dụng tên tệp ngắn gọn nhưng mang tính mô tả. Ví dụ, my-new-black-kitten.jpg tốt hơn IMG00023.JPG. Hạn chế sử dụng các tên tệp chung chung như image1.jpg, pic.gif, 1.jpg. Nếu trang web của bạn chứa hàng nghìn hình ảnh, bạn nên xem xét việc tự động hóa quá trình đặt tên tệp hình ảnh. Nếu bạn bản địa hóa hình ảnh, hãy nhớ dịch cả tên tệp và chú ý đến quy tắc mã hóa URL nếu sử dụng ký tự đặc biệt hoặc ký tự không phải chữ La-tinh.
Thuộc tính quan trọng nhất khi bổ sung siêu dữ liệu cho hình ảnh là văn bản thay thế (alt text). Văn bản thay thế không chỉ cải thiện khả năng hỗ trợ tiếp cận cho những người không thể xem được hình ảnh trên trang, chẳng hạn như người dùng sử dụng trình đọc màn hình hoặc kết nối băng thông thấp, mà còn giúp tối ưu hóa hình ảnh cho SEO.
Google sử dụng văn bản thay thế kết hợp với thuật toán thị giác máy tính và nội dung trang để hiểu rõ hơn về chủ đề của hình ảnh. Bên cạnh đó, văn bản thay thế cũng có thể đóng vai trò như văn bản liên kết nếu bạn sử dụng hình ảnh làm đường liên kết.
Khi viết văn bản thay thế, hãy tạo ra nội dung cung cấp thông tin hữu ích, sử dụng từ khóa phù hợp với ngữ cảnh của nội dung trên trang. Tránh việc nhồi nhét từ khóa vào thuộc tính alt, vì hành động này có thể gây ra trải nghiệm tiêu cực cho người dùng và khiến trang web của bạn bị Google coi là nội dung rác.
Ví dụ về cách sử dụng văn bản thay thế:
- Kém (thiếu văn bản thay thế):
<img src="puppy.jpg"/>
- Kém (nhồi nhét từ khóa):
<img src="puppy.jpg" alt="chó cún chó con chó nhỏ chó cún chó con retriever labrador husky thức ăn cho chó đồ ăn giá rẻ cho chó con"/>
- Tốt hơn:
<img src="puppy.jpg" alt="chó con"/>
- Tốt nhất:
<img src="puppy.jpg" alt="Chú chó đốm chơi nhặt đồ"/>
Ngoài ra, hãy cân nhắc khả năng hỗ trợ tiếp cận của văn bản thay thế theo nguyên tắc W3. Đối với phần tử <img>, bạn có thể thêm thuộc tính alt, trong khi đối với phần tử <svg> cùng dòng, bạn có thể sử dụng phần tử <title>. Ví dụ:
<svg aria-labelledby="svgtitle1">
<title id="svgtitle1">Googlebot wearing an apron and chef hat, struggling to make pancakes on the stovetop</title>
</svg>
Hãy kiểm tra nội dung của bạn bằng cách sử dụng các công cụ kiểm tra khả năng hỗ trợ tiếp cận và mô phỏng kết nối mạng chậm để đảm bảo mọi người dùng đều có thể truy cập thông tin một cách hiệu quả.
Chọn không liên kết cùng dòng trong Google Hình ảnh
Nếu bạn muốn, có thể ngăn hình ảnh có kích thước đầy đủ xuất hiện trên trang kết quả tìm kiếm của Google Hình ảnh bằng cách chọn không liên kết cùng dòng trong kết quả tìm kiếm. Để thực hiện việc này:
- Khi hình ảnh của bạn được yêu cầu, hãy kiểm tra tiêu đề liên kết giới thiệu HTTP trong yêu cầu đó.
- Nếu yêu cầu đến từ một miền của Google, hãy trả lời bằng mã trạng thái HTTP 200 hoặc mã trạng thái HTTP 204 mà không kèm theo nội dung.
Google sẽ vẫn thu thập dữ liệu trang của bạn và thấy hình ảnh, nhưng chỉ hiển thị hình thu nhỏ được tạo tại thời điểm thu thập dữ liệu trong kết quả tìm kiếm. Bạn có thể chọn không liên kết cùng dòng bất kỳ lúc nào mà không cần xử lý lại hình ảnh của trang web. Hành vi này không được coi là kỹ thuật che giấu hình ảnh và sẽ không dẫn đến việc Google áp dụng hình phạt thủ công.
Ngoài ra, bạn cũng có thể ngăn hình ảnh hoàn toàn không xuất hiện trong kết quả tìm kiếm.
Tối ưu hóa cho tính năng Tìm kiếm an toàn
Tìm kiếm an toàn là một cài đặt trong tài khoản của người dùng Google, giúp quyết định liệu các hình ảnh, video và trang web phản cảm có được hiển thị, làm mờ hay chặn trong kết quả tìm kiếm trên Google hay không. Hãy đảm bảo Google hiểu rõ nội dung trang web của bạn để có thể áp dụng bộ lọc Tìm kiếm an toàn một cách chính xác khi cần thiết. Bạn có thể tìm hiểu thêm về cách gắn nhãn các trang để phù hợp với tính năng Tìm kiếm an toàn.
Tối ưu hoá SEO cho hình ảnh không chỉ dừng lại ở việc cải thiện vị trí xếp hạng trên Google mà còn giúp nâng cao trải nghiệm người dùng và tăng cường khả năng tiếp cận của trang web. Bằng cách tuân thủ các phương pháp hay nhất như tối ưu hoá trang đích, sử dụng định dạng hình ảnh phù hợp và tạo văn bản thay thế mô tả, bạn có thể đảm bảo hình ảnh của mình sẽ được hiển thị một cách hiệu quả nhất trong kết quả tìm kiếm của Google.
