OROVA.VN — BIZ AI AGENT
Hướng dẫn

Thẻ alt là gì? Cách kiểm ảnh thiếu alt và viết alt cho người không biết code

Thẻ alt là gì? Cách kiểm ảnh thiếu alt và viết alt cho người không biết code

Thẻ alt là gì? Đó là dòng chữ ngắn gắn kèm mỗi hình ảnh trên website, mô tả ảnh đó cho người không nhìn thấy ảnh: người khiếm thị dùng trình đọc màn hình, người mạng chậm khi ảnh chưa tải, và cả Google khi đọc trang của bạn. Bài này viết cho chủ website, chủ shop và người tự đăng bài không biết code: cách biết ảnh nào đang thiếu alt trong khoảng một phút, cách thêm alt trong WordPress bằng đúng tên nút trên màn hình, và mẫu câu alt cho từng loại ảnh, kể cả khi nào nên để trống alt.

Thẻ alt là gì và nằm ở đâu trong một bức ảnh

Thẻ alt (alt text, văn bản thay thế) thật ra là một thuộc tính của thẻ ảnh <img> trong mã HTML. Bạn không cần viết mã để có nó: mỗi khi bạn điền ô "Văn bản thay thế" trong WordPress hay ô "Alt text" ở các nền tảng bán hàng, hệ thống sẽ tự ghi dòng chữ đó vào mã của trang. Một ảnh có alt trông như sau trong mã nguồn:

<img src="ao-so-mi-linen-trang.jpg" alt="Áo sơ mi linen trắng tay dài, mặt trước, treo trên móc gỗ">

Phần nằm giữa hai dấu ngoặc kép sau chữ alt= chính là nội dung bạn viết. Dòng chữ này làm ba việc:

  • Đọc cho người khiếm thị nghe. Trình đọc màn hình đọc to alt khi gặp ảnh. Ảnh không có alt thì phần mềm thường đọc tên tệp, kiểu "IMG chấm 4 5 8 2 chấm jpg", người nghe không hiểu gì.
  • Hiện thay ảnh khi ảnh không tải được. Mạng yếu, đường dẫn ảnh hỏng thì trình duyệt hiện dòng alt ở chỗ ảnh lẽ ra phải hiện.
  • Giúp Google hiểu ảnh. Tài liệu hướng dẫn về Google Hình ảnh của Google Search Central khuyên viết alt mô tả đúng ảnh, có ích cho người đọc và hợp với nội dung trang; Google dùng alt cùng với chữ xung quanh để hiểu ảnh nói về gì. Đây là phần quan trọng của seo hình ảnh, nhưng không phải chỗ để nhồi từ khoá.

Một điểm hay bị nhầm: alt khác thuộc tính title của ảnh. Title là dòng chữ nhỏ hiện lên khi bạn rê chuột vào ảnh trên máy tính; alt thì không hiện khi ảnh tải bình thường, nó dành cho trình đọc màn hình và công cụ tìm kiếm. Trong WordPress, ô "Tiêu đề" và ô "Văn bản thay thế" là hai ô khác nhau, điền nhầm ô là ảnh vẫn thiếu alt.

Trang hướng dẫn chính thức của Google Search Central về hình ảnh trên Google Tìm kiếm, có mục viết văn bản thay thế (alt).
Trang hướng dẫn chính thức của Google Search Central về hình ảnh trên Google Tìm kiếm, có mục viết văn bản thay thế (alt).

Cách biết ảnh nào trên website đang thiếu alt trong 1 phút

Bạn không cần mở mã nguồn cả trang. Có bốn cách, từ nhanh nhất cho một ảnh tới quét cả website.

Cách 1: Chuột phải vào ảnh, chọn Kiểm tra

Đây là cách kiểm một ảnh cụ thể, mất chưa tới một phút:

  1. Mở trang có ảnh trên Chrome hoặc Edge (máy tính).
  2. Bấm chuột phải đúng vào bức ảnh, chọn Kiểm tra (trình duyệt tiếng Anh là Inspect).
  3. Một khung công cụ mở ra bên phải hoặc bên dưới, dòng mã của ảnh đã được tô sẵn, bắt đầu bằng <img.
  4. Nhìn trong dòng đó tìm chữ alt=. Có alt="một câu mô tả" là ảnh đã có alt. Có alt="" là alt rỗng (đúng nếu đó là ảnh trang trí). Không thấy chữ alt nào là ảnh đang thiếu.
Sơ đồ ba trường hợp khi kiểm alt của một ảnh: không có alt, alt rỗng và alt có câu mô tả.
Ba trường hợp bạn sẽ gặp khi xem dòng mã của ảnh và việc cần làm với từng trường hợp.

Nếu chuột phải ra menu "Lưu hình ảnh" mà không thấy dòng <img được tô, có thể ảnh được đặt làm hình nền bằng CSS. Loại ảnh nền này không có alt; nếu nó chứa thông tin quan trọng (ví dụ banner có chữ khuyến mãi) thì nên nhờ người làm web đổi sang ảnh thường hoặc ghi thông tin đó bằng chữ trên trang.

Cách 2: Dùng Lighthouse có sẵn trong Chrome để liệt kê cả trang

Muốn biết cả một trang có bao nhiêu ảnh thiếu alt, bạn dùng Lighthouse, công cụ kiểm tra đi kèm Chrome:

  1. Mở trang cần kiểm, bấm chuột phải ở chỗ trống, chọn Kiểm tra.
  2. Trong khung vừa mở, chọn thẻ Lighthouse (nếu không thấy, bấm dấu » để hiện thêm thẻ).
  3. Chỉ đánh dấu mục Accessibility (Hỗ trợ tiếp cận), bấm Analyze page load (Phân tích lượt tải trang).
  4. Chờ báo cáo chạy xong, tìm dòng "Image elements do not have [alt] attributes" (Phần tử hình ảnh không có thuộc tính [alt]). Bấm vào dòng đó, Lighthouse liệt kê từng ảnh thiếu alt kèm hình thu nhỏ.
Bảng Lighthouse trong Chrome DevTools với nút Analyze page load và mục Accessibility trong Categories
Bảng Lighthouse trong Chrome DevTools (ảnh từ tài liệu chính thức developer.chrome.com): đánh dấu Accessibility rồi bấm Analyze page load.

Dòng này không xuất hiện ở phần lỗi nghĩa là trang không có ảnh nào thiếu hẳn thuộc tính alt. Lưu ý Lighthouse chỉ biết alt có hay không, nó không biết câu alt của bạn viết có đúng với ảnh hay không.

Cách 3: Cài tiện ích kiểm tra trợ năng cho trình duyệt

Nếu bạn hay phải kiểm nhiều trang, một tiện ích như WAVE của WebAIM sẽ đánh dấu trực tiếp lên trang: ảnh thiếu alt hiện biểu tượng báo lỗi màu đỏ "Missing alternative text", ảnh có alt hiện biểu tượng khác để bạn bấm vào đọc nội dung alt. Cách này trực quan vì bạn thấy luôn ảnh nào bị lỗi nằm ở đâu, không phải đọc mã.

Cách 4: Dùng công cụ quét cả website

Ba cách trên kiểm từng trang. Website có vài chục tới vài trăm bài thì mở từng bài sẽ rất lâu. Lúc đó bạn nên dùng một công cụ quét toàn website để có danh sách trang có ảnh thiếu alt, rồi sửa theo danh sách. Mục "Tìm ảnh thiếu alt trên cả website bằng 1clickseo" ở cuối bài hướng dẫn một cách làm như vậy cho người không làm kỹ thuật.

Cách kiểmHợp khi nàoThấy được gìGiới hạn
Chuột phải → Kiểm traNghi một ảnh cụ thểAlt của đúng ảnh đóMỗi lần một ảnh
Lighthouse trong ChromeKiểm cả một trangDanh sách ảnh thiếu alt trên trangKhông chấm câu alt hay hay dở
Tiện ích như WAVEKiểm nhiều trang, muốn thấy trực quanBiểu tượng lỗi đặt ngay trên ảnhPhải cài tiện ích, kiểm từng trang
Công cụ quét websiteWebsite nhiều bàiDanh sách trang có ảnh thiếu altCần dán link website để quét

Ảnh nào cần alt, ảnh nào nên để trống alt=""

Không phải ảnh nào cũng cần câu mô tả. Hướng dẫn về ảnh của W3C (nhóm WAI, tổ chức soạn chuẩn tiếp cận web WCAG) chia ảnh theo vai trò, và cách viết alt đi theo vai trò đó. Câu hỏi để phân loại rất đơn giản: nếu bỏ ảnh này đi, người đọc có mất thông tin gì không?

  • Ảnh mang thông tin (ảnh sản phẩm, ảnh minh hoạ một bước làm, ảnh chụp màn hình, biểu đồ): cần alt mô tả đúng thông tin ảnh đưa ra.
  • Ảnh trang trí (hoa văn, đường kẻ phân cách, biểu tượng đứng cạnh chữ đã nói đủ ý, ảnh nền cho đẹp): để alt rỗng alt="". Trình đọc màn hình sẽ bỏ qua ảnh, người nghe không bị làm phiền.
  • Ảnh là đường link hoặc nút bấm (logo dẫn về trang chủ, banner bấm sang trang khuyến mãi): alt ghi nơi sẽ tới hoặc việc sẽ xảy ra khi bấm, ví dụ "Trang chủ Tiệm Bánh Mây" hay "Xem bộ sưu tập áo len mùa đông", không tả màu sắc banner.
  • Ảnh có chữ (banner, ảnh chụp bảng giá, poster): alt ghi lại phần chữ quan trọng trong ảnh, vì trình đọc màn hình không đọc được chữ nằm trong ảnh.

Hai điều cần nhớ với ảnh trang trí. Một, alt rỗng là hai dấu ngoặc kép viết liền alt="", không có dấu cách ở giữa. Hai, đừng xoá hẳn chữ alt: ảnh không có thuộc tính alt bị coi là thiếu alt, và trình đọc màn hình có thể đọc tên tệp ảnh. Trong WordPress, để trống ô "Văn bản thay thế" thì WordPress thường ghi alt="" vào mã, nên với ảnh trang trí bạn chỉ cần để trống ô đó.

Ảnh nội dung và ảnh trang trí khác nhau thế nào khi viết alt

Sơ đồ bên dưới đặt hai loại ảnh cạnh nhau để bạn đối chiếu nhanh khi rà một trang.

Bảng so sánh cách viết alt cho ảnh mang thông tin và ảnh chỉ để trang trí.
Ảnh mang thông tin cần câu mô tả, ảnh trang trí để alt rỗng để trình đọc màn hình bỏ qua.

Website đã có nhiều bài và bạn không muốn mở từng trang để tìm ảnh thiếu alt? Dán link website vào 1clickseo, bước Kỹ thuật sẽ chỉ ra ảnh chưa có chữ mô tả và ghi cách sửa bằng chữ đời thường.

Mẫu câu alt theo từng loại ảnh

Công thức chung: tả đúng thứ ảnh đang cho thấy, theo đúng ý của đoạn văn đặt ảnh, gọn trong một câu. Nếu từ khoá của bài tự nhiên khớp với ảnh thì dùng, không khớp thì thôi. Bạn không cần mở đầu bằng "Hình ảnh của…" hay "Ảnh chụp…", trình đọc màn hình đã tự báo đó là ảnh.

Loại ảnhMẫu câu altVí dụ nên viếtTránh
Ảnh sản phẩm[Tên sản phẩm] + [màu/phiên bản] + [góc chụp hoặc chi tiết đang thấy]Bình giữ nhiệt inox màu xanh rêu 500 ml, nắp bật mở, nhìn từ trên xuống"binh-giu-nhiet-gia-re-mua-ngay"
Ảnh minh hoạ một bước làm[Việc đang làm] + [vật/chỗ đang thao tác]Tay đang tháo khay chiên khỏi thân nồi chiên không dầu để rửa"Ảnh minh hoạ"
Ảnh chụp màn hình[Tên màn hình/phần mềm] + [điều cần chú ý trên màn hình]Màn hình Thư viện Media của WordPress, ô Văn bản thay thế ở cột bên phảiTên tệp kiểu "Screenshot-1.png"
Biểu đồ, bảng số[Loại biểu đồ] + [đo cái gì] + [điều chính rút ra]; số chi tiết ghi ở đoạn văn cạnh ảnhBiểu đồ cột doanh thu theo quý của cửa hàng, quý 4 cao nhất"Biểu đồ"
Logo[Tên thương hiệu]; nếu logo là link về trang chủ thì ghi nơi đếnTrang chủ Tiệm Bánh Mây"logo tiệm bánh mây đẹp uy tín giá rẻ"
Banner, ảnh có chữChép lại phần chữ quan trọng trong ảnhGiảm giá áo len đến hết tháng 12, xem bộ sưu tập"Banner nền đỏ"
Ảnh trang tríĐể trống: alt=""(để trống)Chèn từ khoá vào icon, đường kẻ

Độ dài: không có con số chuẩn bắt buộc. Thường một câu ngắn là đủ cho ảnh sản phẩm hay ảnh minh hoạ. Ảnh phức tạp như biểu đồ nhiều số thì alt chỉ nêu ý chính, phần số chi tiết đặt ở đoạn văn hoặc bảng ngay cạnh ảnh để ai cũng đọc được.

So sánh 3 cách viết alt trên cùng một ảnh sản phẩm

Cùng một ảnh bình giữ nhiệt, ba cách viết cho ba kết quả rất khác nhau:

MứcAltVì sao
Nhồi từ khoáalt="bình giữ nhiệt bình giữ nhiệt giá rẻ bình nước inox mua bình giữ nhiệt"Không tả ảnh, người nghe trình đọc màn hình thấy khó chịu; Google xem nhồi từ khoá là trải nghiệm xấu
Quá sơ sàialt="bình nước"Không sai, nhưng không nói được ảnh khác gì các ảnh bình nước khác
Nên viếtalt="Bình giữ nhiệt inox màu xanh rêu 500 ml, nắp bật mở, nhìn từ trên xuống"Nói đúng sản phẩm, màu, dung tích, góc chụp; từ khoá có mặt một cách tự nhiên

Một sản phẩm có nhiều ảnh thì viết sao cho không trùng

Giữ tên sản phẩm làm phần đầu, đổi phần sau theo đúng thứ từng ảnh cho thấy: "Bình giữ nhiệt inox xanh rêu, mặt trước", "Bình giữ nhiệt inox xanh rêu, cận nắp bật và gioăng cao su", "Bình giữ nhiệt inox xanh rêu đặt trong túi đeo chéo". Mỗi ảnh một câu riêng vì mỗi ảnh cho thấy một chi tiết riêng. Nếu bạn đang làm trang sản phẩm, bài seo sản phẩm có thêm cách đặt tên, mô tả và ảnh cho cả trang.

Cách thêm thẻ alt trong WordPress, không cần đụng tới code

WordPress là nơi nhiều chủ website Việt Nam tự đăng bài, và có hai chỗ để điền alt. Ảnh bên dưới, lấy từ tài liệu chính thức của WordPress (bản tiếng Anh), là khung Chi tiết đính kèm trong Thư viện Media: ô Alternative Text chính là ô Văn bản thay thế, và ngay dưới ô có dòng nhắc để trống nếu ảnh chỉ để trang trí.

Khung Attachment details trong Thư viện Media WordPress, ô Alternative Text ở cột phải, ghi chú để trống nếu ảnh chỉ trang trí
Khung Chi tiết đính kèm của Thư viện Media WordPress (ảnh từ tài liệu chính thức wordpress.org, bản tiếng Anh): ô Alternative Text là ô Văn bản thay thế, dòng dưới nhắc để trống nếu ảnh chỉ để trang trí.

Thêm alt trong Thư viện Media

  1. Đăng nhập trang quản trị WordPress, vào menu Media → Thư viện (bản tiếng Anh: Media → Library).
  2. Bấm vào ảnh cần sửa. Khung Chi tiết đính kèm (Attachment details) mở ra.
  3. Ở cột bên phải, điền câu mô tả vào ô Văn bản thay thế (Alternative Text). Đừng điền vào ô Tiêu đề, Chú thích hay Mô tả, đó là các ô khác.
  4. WordPress tự lưu khi bạn bấm ra ngoài ô. Đóng khung là xong.

Alt điền ở Thư viện Media sẽ được dùng cho những lần chèn ảnh mới sau đó. Ảnh đã nằm sẵn trong bài cũ có thể vẫn giữ alt cũ, bạn cần sửa trong bài như cách dưới.

Thêm hoặc sửa alt ngay trong bài viết

  1. Mở bài viết bằng trình soạn thảo khối (Gutenberg), bấm chọn khối ảnh.
  2. Nhìn sang thanh cài đặt bên phải, thẻ Khối (Block). Nếu không thấy thanh này, bấm biểu tượng bánh răng Cài đặt góc trên bên phải.
  3. Điền vào ô Văn bản thay thế (Alternative text). Ảnh trang trí thì để trống ô này.
  4. Bấm Cập nhật (Update) để lưu bài, rồi mở lại bài ngoài trang web và kiểm lại bằng chuột phải → Kiểm tra như Cách 1.

Ví dụ minh hoạ: một chủ shop đồ gốm dùng WordPress sửa alt trong Thư viện Media cho cả bộ ảnh sản phẩm, nhưng khi kiểm bằng chuột phải → Kiểm tra trên bài cũ vẫn thấy alt="". Lý do là ảnh trong bài được chèn từ trước khi sửa. Chủ shop mở từng bài, bấm vào khối ảnh, điền lại ô Văn bản thay thế rồi bấm Cập nhật, kiểm lại thì alt mới đã hiện.

Nếu bạn muốn thêm các bước tối ưu khác cho bài trên WordPress như tiêu đề, đường dẫn, thẻ mô tả, bài cách viết bài chuẩn seo trên wordpress đi qua từng ô cần điền.

Website không dùng WordPress

Đa số nền tảng tạo website và bán hàng đều có ô mô tả ảnh khi bạn bấm vào ảnh để sửa, tên ô thường là "Văn bản thay thế", "Alt text" hoặc "Mô tả hình ảnh". Không tìm thấy ô nào như vậy thì nhờ người làm web thêm thuộc tính alt vào thẻ ảnh theo đúng mẫu <img src="…" alt="câu mô tả"> đã nói ở đầu bài.

Sơ đồ bốn bước thêm alt cho một ảnh mới: xem vai trò, viết câu, điền ô Văn bản thay thế, kiểm lại.
Trình tự này dùng được cho WordPress và hầu hết nền tảng có ô mô tả ảnh.

Lỗi alt hay gặp và cách sửa nhanh

Phần lớn lỗi alt đến từ thói quen đăng bài vội, không phải do khó. Bảng dưới gom các lỗi thường thấy khi rà một website nhỏ:

LỗiThường do đâuSửa thế nào
Ảnh không có thuộc tính altTải ảnh lên rồi chèn luôn, bỏ qua ô Văn bản thay thếĐiền ô Văn bản thay thế trong khối ảnh, bấm Cập nhật
Alt là tên tệp ("IMG_4582", "anh-1")Nền tảng tự lấy tên tệp làm altViết lại câu mô tả đúng ảnh
Nhồi nhiều từ khoáMuốn lên top nhanhViết một câu tả ảnh, chỉ giữ từ khoá nếu nó khớp tự nhiên
Mọi ảnh trong bài cùng một câu altChép một câu cho tất cảMỗi ảnh tả đúng chi tiết riêng của nó
Icon, đường kẻ có alt dàiNghĩ ảnh nào cũng phải có mô tảĐể trống alt cho ảnh trang trí
Điền mô tả vào ô Tiêu đề thay vì ô Văn bản thay thếHai ô nằm gần nhauChuyển câu sang đúng ô Văn bản thay thế
Alt viết không dấuChép từ tên tệpViết tiếng Việt có dấu như câu bình thường

Checklist trước khi bấm đăng bài

Dùng danh sách này cho mỗi bài có ảnh:

  • [ ] Mỗi ảnh mang thông tin đều có câu alt tả đúng thứ ảnh cho thấy.
  • [ ] Ảnh trang trí để trống ô Văn bản thay thế (ra alt="").
  • [ ] Ảnh là link hoặc nút ghi nơi đến hay việc sẽ xảy ra khi bấm.
  • [ ] Ảnh có chữ quan trọng đã chép phần chữ đó vào alt hoặc vào đoạn văn cạnh ảnh.
  • [ ] Không câu alt nào lặp lại y hệt câu khác trong bài, không nhồi từ khoá, không mở đầu bằng "Hình ảnh của".
  • [ ] Đã mở bài ngoài trang web, chuột phải → Kiểm tra ít nhất một ảnh để chắc alt đã lưu.

Nếu bạn muốn rà cả những mục khác ngoài ảnh trước khi đăng, bài checklist seo có danh sách đầy đủ hơn.

Muốn biết website của bạn còn thiếu gì ngoài alt ảnh? Dán link website vào 1clickseo để xem điểm SEO thang 100, các việc kỹ thuật nên làm và từ khoá khách đang tìm, rồi tự quyết viết bài nào tiếp theo.

Tìm ảnh thiếu alt trên cả website bằng 1clickseo

Khi website đã có nhiều bài, kiểm từng trang bằng chuột phải hay Lighthouse mất nhiều thời gian. 1clickseo là công cụ dành cho chủ website và chủ doanh nghiệp nhỏ không biết SEO: bạn dán link website, 1clickseo đi lần lượt từng bước phân tích, ngay sau bước Website là bước Kỹ thuật.

Trang đầu 1clickseo với ô Dán link website và nút Xem ngay
Trang đầu 1clickseo.orova.vn: dán link website vào ô rồi bấm Xem ngay, chưa cần đăng nhập.
  1. Mở trang 1clickseo, dán link website của bạn vào ô trên trang đầu, bấm Xem ngay.
  2. Chưa cần đăng nhập, bạn đã thấy điểm SEO thang 100, danh sách bài đang có trên website và từ khoá gợi ý.
  3. Ở bước Kỹ thuật, phần Việc nên làm ghi từng lỗi bằng chữ đời thường: vì sao quan trọng và Cách làm. Ảnh thiếu alt hiện thành mục "Ảnh có chữ mô tả (alt)", kèm lời giải thích "Chữ mô tả ảnh giúp Google hiểu ảnh và ảnh có thể lên Google Hình ảnh" và cách làm "Thêm chữ mô tả (alt) ngắn cho từng ảnh trong thư viện ảnh".
  4. Bạn sửa theo hướng dẫn trong WordPress như mục trên, rồi bấm Phân tích lại để xem lỗi đã hết chưa.
Bước Kỹ thuật của 1clickseo: điểm SEO thang 100 và danh sách Việc nên làm kèm Cách làm
Bước Kỹ thuật của 1clickseo khi dán link orova.vn (chưa đăng nhập): điểm SEO thang 100, mục Việc nên làm, mỗi lỗi có lời giải thích và Cách làm.

1clickseo chỉ ra lỗi và cách sửa, nó không tự sửa ảnh trên website của bạn. Với bài mới, nếu bạn dùng 1clickseo viết bài thì ảnh trong bài đã có alt sẵn, ảnh minh hoạ có chèn logo của bạn, nên bạn bớt được một việc phải nhớ mỗi lần đăng.

Ảnh dưới là trang đầu của 1clickseo, nơi bạn dán link website để bắt đầu.

Xu hướng alt text trong vài năm tới: nhận định của tác giả

Dấu hiệu đang thấy: các công cụ AI mô tả ảnh ngày càng giỏi, nhiều nền tảng đã có nút gợi ý alt tự động khi tải ảnh lên. Trình đọc màn hình và trình duyệt cũng bắt đầu thử tự mô tả ảnh thiếu alt.

Tôi cho rằng alt do người viết vẫn giữ giá trị, vì máy có thể nói "một người cầm điện thoại" nhưng chỉ bạn biết ảnh đó đang minh hoạ bước "quét mã để thanh toán" trong bài của mình. Phần ngữ cảnh đó là thứ alt tự động dễ bỏ sót. Nhận định này có thể đổi nếu công cụ tự động đọc được cả nội dung bài quanh ảnh và hiểu đúng ý người viết trong đa số trường hợp.

Theo tôi, bạn nên chuẩn bị từ bây giờ bằng cách coi alt là một phần của việc viết bài, giống như viết tiêu đề: gợi ý tự động thì dùng làm bản nháp, còn câu cuối cùng bạn đọc lại và sửa cho khớp ý đoạn văn. Website nhỏ làm đều việc này ngay từ bài mới sẽ đỡ phải đi dọn hàng loạt ảnh cũ về sau.

Câu hỏi hay gặp về thẻ alt

Alt text là gì, có khác thẻ alt không?

Không khác. "Thẻ alt", "alt text", "thuộc tính alt" và "văn bản thay thế" đều chỉ cùng một thứ: dòng chữ trong alt="…" của thẻ ảnh. Gọi "thẻ" là cách nói quen trong giới làm web Việt Nam, đúng ra alt là một thuộc tính của thẻ <img>.

Thẻ alt có cần viết tiếng Việt có dấu không?

Có. Alt được trình đọc màn hình đọc cho người nghe, nên viết như một câu tiếng Việt bình thường, có dấu, có dấu cách. Alt có thể chứa số (dung tích, kích cỡ, mã mẫu) khi số đó giúp phân biệt ảnh. Tránh các ký tự vô nghĩa như dấu gạch nối nối liền các từ kiểu tên tệp.

Ảnh trang trí có cần điền alt để "đủ điểm" SEO không?

Không. Ảnh chỉ để trang trí nên để alt rỗng alt="". Điền từ khoá vào icon hay đường kẻ không giúp người đọc, còn làm người dùng trình đọc màn hình phải nghe những câu thừa. Công cụ kiểm tra như Lighthouse chỉ báo lỗi khi ảnh thiếu hẳn thuộc tính alt, alt rỗng có chủ đích không bị coi là thiếu.

Ảnh làm link thì viết alt thế nào?

Viết nơi link sẽ dẫn tới hoặc việc sẽ xảy ra khi bấm, vì với ảnh làm link, alt đóng vai trò giống chữ của đường link. Ví dụ logo dẫn về trang chủ: "Trang chủ Tiệm Bánh Mây". Bài anchor text là gì giải thích thêm vì sao chữ của link quan trọng.

Có nên dùng plugin tự điền alt hàng loạt không?

Dùng được để khỏi bỏ sót, nhưng nên đọc lại. Plugin thường lấy tên tệp hoặc tiêu đề bài làm alt, dẫn tới nhiều ảnh cùng một câu hoặc câu không tả đúng ảnh. Ảnh sản phẩm và ảnh minh hoạ quan trọng nên được viết tay.

Nên bắt đầu từ đâu

Nếu website của bạn mới, hãy áp dụng bảng mẫu câu alt ở trên ngay từ bài đầu tiên, mỗi lần chèn ảnh điền luôn ô Văn bản thay thế. Nếu website đã có nhiều bài, đừng sửa tất cả một lúc: mở Google Search Console, xem những trang đang có nhiều lượt nhấp nhất, kiểm alt của các trang đó bằng Lighthouse trước, rồi đi dần tới các trang khác. Trang sản phẩm bán chạy và bài hướng dẫn có nhiều ảnh chụp màn hình là nơi alt có ích nhất cho người đọc. Làm xong vòng đầu, bạn đã nắm được thẻ alt là gì trên chính website của mình, và mỗi bài mới chỉ còn là thói quen một câu cho mỗi ảnh.

Bảng tóm tắt bốn điều cần nhớ khi viết thẻ alt cho ảnh trên website.
Bốn điều này đủ để bạn viết alt đúng cho phần lớn ảnh trên website nhỏ.

Về tác giả

Nguyễn Đỗ Trọng Ân

Người xây dựng Orova

Nguyễn Đỗ Trọng Ân có 8 năm làm marketing, trong đó 6 năm quản lý khai thác thị trường châu Á. Anh là người xây dựng Orova, Biz AI Agent hoạt động không ngủ: tự lên kế hoạch, chạy và tối ưu công việc cho doanh nghiệp.

Vận hành doanh nghiệp với AI Agent

Orova là Biz AI Agent hoạt động không ngủ — tự lên kế hoạch, chạy và tối ưu công việc.
Tiết kiệm thời gian, bứt phá hiệu suất.

Dùng thử miễn phí