Image Alt Text

Image Alt Text là gì?

Image Alt Text (còn gọi là thuộc tính alt) là một đoạn văn bản ngắn trong thẻ HTML <img>, mô tả nội dung hoặc chức năng của hình ảnh. Đây không phải là tiêu đề hay chú thích hiển thị trên trang, mà là thông tin ẩn — chỉ được đọc bởi phần mềm đọc màn hình, công cụ tìm kiếm và trình duyệt khi hình ảnh không tải được.

Ví dụ: <img src="ban-do-ha-noi.jpg" alt="Bản đồ đường phố Hà Nội với các quận trung tâm được đánh dấu">. Đoạn văn sau alt="..." chính là alt text.

Tại sao quan trọng trong SEO?

Alt text đóng vai trò kép: hỗ trợ khả năng tiếp cận (accessibility) và tăng hiệu quả SEO hình ảnh. Google xác nhận rõ ràng rằng họ dùng alt text để hiểu chủ đề hình ảnh — đặc biệt khi không phân tích được nội dung pixel (do giới hạn kỹ thuật hoặc thiếu dữ liệu bổ sung).

Cụ thể:

• Với người dùng: Giúp người khiếm thị hiểu nội dung hình ảnh qua phần mềm đọc màn hình (screen reader). Nếu không có alt text, hình ảnh trở thành “khoảng trống vô nghĩa”.
• Với công cụ tìm kiếm: Là một trong những tín hiệu mạnh nhất để xác định chủ đề, ngữ cảnh và mức độ liên quan của hình ảnh với từ khóa tìm kiếm.
• Với trải nghiệm người dùng: Khi hình ảnh lỗi hoặc chậm tải, alt text hiện lên thay thế — giúp người dùng vẫn nắm được thông tin cốt lõi.

Lưu ý: Alt text không trực tiếp nâng thứ hạng trang tổng thể, nhưng góp phần cải thiện tỷ lệ nhấp (CTR) từ kết quả tìm kiếm hình ảnh, tăng lưu lượng truy cập gián tiếp và hỗ trợ xếp hạng cho các trang có nội dung hình ảnh phong phú (ví dụ: blog nấu ăn, website bất động sản, cửa hàng thời trang).

Cách hoạt động

Khi Googlebot thu thập trang web, nó đọc toàn bộ mã HTML — bao gồm thuộc tính alt. Hệ thống sau đó so sánh nội dung alt text với:

• Từ khóa trong tiêu đề, mô tả và nội dung xung quanh hình ảnh;
• File name hình ảnh (ví dụ: banh-mi-ga-viet-nam.jpg);
• Text trong thẻ <figcaption> (nếu có);
• Ngữ cảnh bố cục (vị trí hình ảnh trên trang, khoảng cách với heading gần nhất).

Alt text càng mô tả chính xác, ngắn gọn và phù hợp ngữ cảnh, khả năng hình ảnh xuất hiện trong kết quả tìm kiếm hình ảnh (Google Images) càng cao. Không có cơ chế “điểm số alt text” riêng — đây là một yếu tố trong hệ thống xếp hạng đa chiều.

Hướng dẫn thực hiện

Dưới đây là quy trình viết alt text chuẩn SEO và thân thiện người dùng:

1. Xác định mục đích hình ảnh: Hình ảnh mang tính minh họa (giải thích nội dung), mang tính chức năng (nút bấm, biểu tượng) hay mang tính trang trí? Chỉ hình ảnh có thông tin giá trị mới cần alt text mô tả chi tiết.
2. Viết ngắn gọn, rõ ràng: Độ dài lý tưởng từ 5–15 từ (tối đa 125 ký tự). Tránh viết quá dài — screen reader thường cắt sau ~125 ký tự.
3. Mô tả đúng sự thật: Không bịa chi tiết không có trong ảnh (ví dụ: không ghi “người phụ nữ đang cười hạnh phúc” nếu mặt cô ấy không nhìn thấy hoặc biểu cảm trung lập).
4. Chèn từ khóa một cách tự nhiên: Chỉ thêm từ khóa nếu nó phản ánh đúng nội dung. Không nhồi nhét (ví dụ: alt="bánh mì Việt Nam ngon nhất Hà Nội rẻ nhất Sài Gòn món ăn đường phố nổi tiếng" → sai).
5. Không dùng cụm thừa: Tránh bắt đầu bằng “Hình ảnh của…”, “Ảnh chụp…”, vì phần mềm đọc màn hình đã thông báo đó là “image”.
6. Xử lý hình ảnh trang trí: Dùng alt="" (rỗng) — không bỏ trống thuộc tính, không để alt bị thiếu. Điều này báo cho máy đọc biết đây là yếu tố không mang thông tin.

Lỗi thường gặp

Lỗi	Hậu quả	Cách khắc phục
Alt text trống hoặc thiếu thuộc tính alt	Hình ảnh không được hiểu bởi Googlebot và screen reader; vi phạm WCAG 2.1 (tiêu chuẩn tiếp cận)	Thêm alt="" cho ảnh trang trí; viết mô tả ngắn cho ảnh có thông tin
Dùng từ khóa trùng lặp / nhồi nhét	Gây khó hiểu cho người dùng; có thể bị coi là spam (tùy trường hợp)	Viết lại theo nguyên tắc: mô tả + từ khóa (nếu phù hợp), tối đa 1 lần
Dùng file name làm alt text (ví dụ: alt="IMG_20231015_142233.jpg")	Không cung cấp thông tin hữu ích; giảm khả năng xếp hạng hình ảnh	Thay bằng mô tả bằng tiếng Việt, rõ nghĩa, có chủ ngữ – vị ngữ
Alt text quá dài hoặc chứa hướng dẫn (ví dụ: alt="Nhấn vào đây để xem chi tiết sản phẩm")	Screen reader đọc to toàn bộ → gây rối; không mô tả nội dung hình ảnh	Với nút bấm có hình ảnh, nên dùng aria-label hoặc đặt text trong thẻ <button>; alt text chỉ mô tả hình

Ví dụ thực tế

✅ Tốt:
<img src="may-tinh-xach-tay-dell-inspiron.jpg" alt="Laptop Dell Inspiron 15 5000 màu bạc, bàn phím đầy đủ, màn hình 15.6 inch">
→ Mô tả chính xác, có thương hiệu, model, đặc điểm nổi bật, độ dài 10 từ.

❌ Kém:
<img src="product.jpg" alt="laptop dell giá rẻ hà nội">
→ Không mô tả hình ảnh, nhồi từ khóa, file name chung chung.

✅ Ảnh chức năng (icon):
<img src="icon-search.svg" alt="Tìm kiếm">
→ Ngắn gọn, đúng chức năng, không cần giải thích “biểu tượng kính lúp”.

✅ Ảnh trang trí:
<img src="border-decor.png" alt="">
→ Rỗng đúng chuẩn, không gây nhiễu.

Câu hỏi thường gặp

Alt text có ảnh hưởng đến tốc độ tải trang không?

Không. Thuộc tính alt là văn bản thuần, kích thước vài byte — không làm chậm tải trang. Việc tối ưu hóa hình ảnh (nén, chọn định dạng WebP/AVIF, đặt kích thước đúng) mới ảnh hưởng đến tốc độ.

Có nên dịch alt text sang nhiều ngôn ngữ khi làm website đa ngôn ngữ?

Có. Nếu trang có phiên bản tiếng Anh, tiếng Nhật… thì alt text cũng cần được dịch chính xác sang ngôn ngữ tương ứng. Google xử lý alt text theo ngôn ngữ của trang, không tự động dịch.

Alt text có cần giống nhau giữa các hình ảnh giống nhau trên cùng một trang?

Không. Mỗi hình ảnh dù trông giống nhau nhưng có thể có ngữ cảnh khác nhau. Ví dụ: ảnh logo ở header nên có alt="Logo công ty ABC", còn cùng ảnh logo trong phần “Giới thiệu đối tác” nên là alt="Đối tác chiến lược: Công ty ABC". Ngữ cảnh quyết định nội dung alt text — tùy trường hợp.