Hình ảnh là một yếu tố quan trọng để làm cho bài viết trở nên sinh động, hấp dẫn và thu hút độc giả hơn. Tuy nhiên, chỉ đơn thuần việc đăng tải hình ảnh không đủ để tối ưu hóa website của bạn trên công cụ tìm kiếm Google. Để giúp Google đọc được nội dung trong hình ảnh của bạn, bạn cần mô tả hình ảnh đó bằng Alt Text trong HTML. Trong bài viết này, hãy cùng Click Media & SEO tìm hiểu cách tối ưu hóa Alt Text là gì và cách để đạt được hiệu quả tốt nhất trên công cụ tìm kiếm Google.
Alt Text là gì?
Alt Text (viết tắt của “Alternative Text”) là một phần mô tả hình ảnh hoặc đoạn video, được sử dụng để giải thích nội dung của hình ảnh đó đến người dùng khi không thể xem hình ảnh hoặc khi trình duyệt không hỗ trợ hiển thị hình ảnh. Alt Text thường được sử dụng cho mục đích truy cập và SEO (tối ưu hóa công cụ tìm kiếm).
Cách dùng Alt Text
Để sử dụng Alt Text cho hình ảnh trên trang web, bạn có thể thực hiện các bước sau:
- Thêm thuộc tính “alt” vào thẻ <img> của hình ảnh trong mã HTML.
- Nhập nội dung mô tả hình ảnh vào thuộc tính “alt”. Nội dung này nên là ngắn gọn, chính xác và mô tả đầy đủ nội dung của hình ảnh.
- Chỉ sử dụng các từ khóa chính liên quan đến hình ảnh và tránh sử dụng những từ khóa không liên quan hoặc spam.
- Nếu hình ảnh được sử dụng như một liên kết, bạn có thể bao gồm cả nội dung của liên kết vào trong alt text.
- Cần đảm bảo rằng alt text không quá dài, vì vậy chỉ nên sử dụng các từ và cụm từ cần thiết để mô tả hình ảnh.
Ví dụ:
<img src=”hinh-anh.jpg” alt=”Cặp đôi trẻ tay trong tay đi dạo trên bãi biển vào buổi chiều”>
Trong ví dụ trên, alt text là “Cặp đôi trẻ tay trong tay đi dạo trên bãi biển vào buổi chiều”, mô tả đầy đủ và chính xác về nội dung của hình ảnh.
Thẻ Alt là gì?
Thẻ Alt (viết tắt của “Alternative Tag”) là một thuộc tính HTML được sử dụng để định nghĩa Alt Text cho hình ảnh hoặc đoạn video.
Thẻ Alt nên được sử dụng để cung cấp thông tin chi tiết về hình ảnh đến người dùng với khả năng thị giác bị giới hạn, và nó cũng được sử dụng để cải thiện SEO cho trang web của bạn.
Ví dụ về cấu trúc thẻ ALT:
<img src=”path/to/image.jpg” alt=”Mô tả về hình ảnh”>
Tại sao Alt Text lại quan trọng?
Tăng khả năng tiếp cận
Alt Text là một phần quan trọng của một hình ảnh trên trang web vì nó giúp tăng khả năng tiếp cận nội dung của trang web cho những người dùng bị giới hạn khả năng thị giác, chẳng hạn như người khiếm thị hoặc người dùng màn hình đọc.
Alt Text cung cấp một mô tả văn bản cho hình ảnh, giúp người dùng hiểu được nội dung của hình ảnh đó.
Ngoài ra, Alt Text cũng giúp tăng khả năng truy cập trang web cho người dùng sử dụng các công cụ hỗ trợ, như màn hình đọc hoặc trình duyệt web có tính năng đọc, bằng cách cung cấp thông tin đầy đủ và chính xác về hình ảnh.
SEO hình ảnh
Alt Text cũng rất quan trọng để cải thiện SEO cho hình ảnh trên trang web. Các công cụ tìm kiếm không thể đọc được hình ảnh, do đó, Alt Text được sử dụng để mô tả hình ảnh cho các công cụ tìm kiếm.
Việc sử dụng Alt Text đầy đủ, chính xác và phù hợp với nội dung của trang web có thể cải thiện khả năng xuất hiện của trang web trong kết quả tìm kiếm.
Ngoài ra, việc sử dụng Alt Text cũng giúp tăng khả năng chia sẻ hình ảnh của trang web trên các mạng xã hội bằng cách cho phép các công cụ tự động tạo mô tả văn bản khi chia sẻ hình ảnh đó.
Cách tạo một Alt Text chuẩn
Sau khi đã nắm rõ khái niệm Alt Text là gì. Và tiếp theo là cách tạo một Alt Text chuẩn SEO:
Mô tả hình ảnh càng cụ thể càng tốt
Alt Text cần phải mô tả đầy đủ và chính xác về hình ảnh đó. Các thông tin cần bao gồm trong Alt Text bao gồm mục đích của hình ảnh, nội dung của hình ảnh. Mô tả càng cụ thể, người dùng sẽ càng hiểu rõ hơn về hình ảnh và tăng khả năng tiếp cận cho những người khiếm thị hoặc sử dụng công cụ hỗ trợ.
Ngắn gọn
Alt Text cần phải ngắn gọn và trực tiếp để người dùng có thể đọc và hiểu nhanh chóng. Nên giới hạn Alt Text trong khoảng từ 80 đến 100 ký tự.
Sử dụng từ khóa
Alt Text nên sử dụng từ khóa phù hợp với nội dung của trang web và hình ảnh.
Tránh nhồi từ khóa
Việc sử dụng quá nhiều từ khóa trong Alt Text có thể làm giảm chất lượng nội dung và gây ảnh hưởng đến trải nghiệm người dùng. Vì vậy, cần tránh nhồi từ khóa và đảm bảo mô tả hình ảnh là tự nhiên và chính xác.
Tránh dùng văn bản trong hình ảnh
Không nên đặt văn bản trực tiếp vào hình ảnh vì các công cụ tìm kiếm không thể đọc được nội dung của hình ảnh. Thay vào đó, nên sử dụng thẻ HTML để đặt văn bản trên trang web.
Sử dụng thẻ longdesc=””
Nếu mô tả của Alt Text không đủ để mô tả hình ảnh, bạn có thể sử dụng thẻ HTML longdesc để cung cấp một mô tả chi tiết hơn về hình ảnh.
Đừng quên dùng Alt cho các nút Form
Nếu trang web của bạn có các nút Form, cần đảm bảo rằng các nút đó cũng có mô tả Alt Text để người dùng biết chính xác chức năng của nút đó.
Một số vấn đề thường gặp với Alt Text hình ảnh
Hình ảnh bị hỏng
Nếu hình ảnh bị hỏng, người dùng sẽ không thể xem được nội dung của nó và các phần mềm hỗ trợ cho người khuyết tật sẽ không thể hiển thị nội dung tương tự.
Vì vậy, cần chú ý kiểm tra kỹ trước khi tải lên website, đảm bảo rằng hình ảnh được tải lên đúng định dạng và kích thước và không bị lỗi.
Hình ảnh không có thuộc tính Alt
Khi hình ảnh không có thuộc tính Alt, người dùng sẽ không biết được nội dung của hình ảnh đó là gì và các phần mềm hỗ trợ cho người khuyết tật sẽ không thể hiển thị nội dung tương tự.
Ngoài ra, Google và các công cụ tìm kiếm khác sẽ không thể hiểu được nội dung của hình ảnh. Do đó, cần đảm bảo rằng tất cả các hình ảnh trên trang web đều có thuộc tính Alt được điền đầy đủ và chính xác, cung cấp cho người dùng và các công cụ tìm kiếm thông tin về nội dung của hình ảnh.
Một số Alt Text được đánh giá cao
Hình ảnh ví dụ cụ thể:
Chú chó Husky trắng đang chơi đùa trên tuyết.
Nam thanh niên đang chạy bộ trên đường phố vào buổi sáng
Bãi biển Boracay ở Philippines với cát trắng và nước biển trong suốt
Câu hỏi thường gặp về Alt Text
Câu hỏi thường gặp về Alt Text? Hãy trả lời theo những ý sau:
Làm thế nào để tìm Alt tag trên trang?
Để tìm Alt tag của hình ảnh trên một trang web, bạn có thể nhấn chuột phải vào hình ảnh và chọn “Xem nguồn trang” hoặc “Inspect Element” (Tùy thuộc vào trình duyệt bạn đang sử dụng). Sau đó, tìm đến đoạn mã HTML của hình ảnh và xem nội dung của thuộc tính “alt”.
Làm cách nào để đọc Alt Text trong mã HTML?
Để đọc Alt Text trong mã HTML, bạn cần tìm đến đoạn mã HTML của hình ảnh và xem nội dung của thuộc tính “alt”.
Làm cách nào để biết một hình ảnh có Alt Text?
Để biết một hình ảnh có Alt Text hay không, bạn có thể nhấn chuột phải vào hình ảnh và chọn “Xem nguồn trang” hoặc “Inspect Element”. Sau đó, tìm đến đoạn mã HTML của hình ảnh và kiểm tra xem có thuộc tính “alt” không. Nếu có, nội dung của thuộc tính “alt” sẽ hiển thị.
Làm cách nào để thêm Alt Text vào tệp JPG?
Bạn không thể thêm Alt Text vào tệp JPG vì Alt Text chỉ là một thuộc tính được sử dụng trên trang web. Tuy nhiên, bạn có thể thêm mô tả vào tên tệp hoặc sử dụng các trình quản lý ảnh để thêm mô tả vào thông tin EXIF của tệp.
Có thể sử dụng dấu phẩy, dấu chấm trong Alt Text không?
Có thể sử dụng dấu phẩy và dấu chấm trong Alt Text, tuy nhiên bạn cần tránh sử dụng quá nhiều dấu câu và đảm bảo nội dung mô tả hình ảnh là rõ ràng, ngắn gọn và chính xác.
Bài viết đã cung cấp cho bạn đọc những thông tin cơ bản về Alt Text. Hy vọng từ bài viết này, các bạn sẽ biết được khái niệm Alt Text là gì và các cách tạo một Alt Text chuẩn. Hãy chia sẻ những thông tin hữu ích này đến nhiều người hơn bạn nhé!