ALT Text Là Gì? Cách Thêm Văn Bản Thay Thế Vào Hình Ảnh

ALT Text ảnh hưởng trực tiếp tới chiến lược SEO trên trang Web của bạn

ALT Text (văn bản thay thế) là gì? Đây là một thuật ngữ mô tả hình ảnh trên trang Web. Nó nằm trong mã HTML và thường không hiển thị trên chính trang đó.

Vậy những điều gì là quan trọng khi nhắc tới văn bản thay thế? Làm thế nào để bạn có thể sử dụng nó hiệu quả trong việc cải thiện SEO cũng như trải nghiệm của người dùng? Câu trả lời sẽ được mình bật mí trong bài viết dưới đây, cùng theo dõi nhé!

ALT Text là gì ?

ALT Text (văn bản thay thế) còn được biết đến với một số tên gọi khác như “mô tả ALT”, “thuộc tính ALT”. Đây thực chất là một thuộc tính HTML được sử dụng cho những thẻ hình ảnh để mô tả chức năng và hình ảnh của chúng trên trang.

[caption id="attachment_10678" align="aligncenter" width="700"]ALT Text ảnh hưởng trực tiếp tới chiến lược SEO trên trang Web của bạn ALT Text ảnh hưởng trực tiếp tới chiến lược SEO trên trang Web của bạn[/caption]

Có thể nói, ALT Text với viết tắt thông dụng được thay thế cho thẻ thay thế còn được gọi là thuộc tính ALT, đây chính là một khía cạnh cực kỳ quan trọng đối với công cuộc tối ưu hóa cho Website của bạn với mục đích SEO. Trong đó, Bing và Google là các công cụ tìm kiếm đang được dùng phổ biến nhất.

Tại sao ALT text quan trọng ?

Văn bản thay thế quan trọng bởi 4 lý do đặc biệt sau:

Văn bản thay thế cải thiện khả năng tiếp cận

Trên thế giới có hàng triệu người khiếm thị và rất nhiều người đang sử dụng trình đọc màn hình để xem những nội dung trực tuyến. Chúng hoạt động bằng cách chuyển đổi các nội dung trên màn hình, bao gồm cả hình ảnh thành âm thanh sống động.

Vì vậy, nếu hình ảnh không có những văn bản thay thế sẽ gây nên sự cố cho trình đọc màn hình. Bởi không có cách nào để truyền đạt được nội dung của hình ảnh cho người dùng khi họ tìm kiếm. 

Khi ấy, họ sẽ quyết định bỏ qua hình ảnh này, hoặc tệ hơn là công cụ tìm kiếm sẽ đọc ra các tệp hình ảnh dài và không ý nghĩa.

Google nhận xét rằng: ALT Text thực sự đã có một tầm quan trọng nhất định đối với người dùng khi sử dụng trình đọc màn hình. Điều này cũng đặc biệt ý nghĩa với những người mới bắt đầu thực hiện SEO Web của họ.

ALT text có thể cải thiện mức độ liên quan theo chủ đề

Để thấu hiểu một trang Web, Google sẽ xem xét những từ trên một trang Web. Chẳng hạn: Nếu như trang Web đề cập tới chó labrador, chó xù và chó tha mồi, thì Google sẽ biết Website đó là về những giống chó.

[caption id="attachment_10679" align="aligncenter" width="700"]ALT Text chính là “chỉ khóa vàng” để cải thiện mức độ liên quan theo chủ đề ALT Text chính là “chỉ khóa vàng” để cải thiện mức độ liên quan theo chủ đề[/caption]

Vậy làm thế nào mà những điều này lại liên quan đến hình ảnh? Đó là bởi vì đôi khi, ngữ cảnh bị “khóa” bên trong hình ảnh mà Google không thể đọc được. 

Mặc dù Google gần như chắc chắn có thể nói rằng đây là hình ảnh của các chú chó không có văn bản thay thế. Tuy nhiên, giống chó cụ thể thì sẽ ít rõ ràng hơn. Và đây chính là nơi văn bản thay thế được xuất hiện.

ALT Text có thể giúp bạn xếp hạng trong Google hình ảnh

Có thể bạn chưa biết, Google hình ảnh chính là công cụ tìm kiếm lớn thứ hai trên thế giới. Thống kê cho thấy, nó chịu trách nhiệm cho 20,45% của tất cả những tìm kiếm trực tuyến, vượt qua cả Bing, Youtube và những công cụ tìm kiếm khác cộng lại. Con số này quả thực rất ấn tượng đúng không nào!

Điều này có nghĩa là cơ hội tăng lưu lượng truy cập từ Google hình ảnh cực kỳ tiềm năng. Tuy nhiên, đây không chỉ là cơ hội mà còn là thách thức lớn đối với các nhà làm SEO. 

Chính vì vậy, bạn cần phải thiết lập một chiến lược Marketing thật chỉn chu liên quan tới ALT Text nếu muốn tăng lưu lượng truy cập cho Website của bạn.

Văn bản thay thế đóng vai trò là văn bản liên kết cho những liên kết hình ảnh

Văn bản Neo đề cập tới những từ có thể nhấp được liên kết một Website bất kỳ với một trang Web khác. Google cũng sử dụng yếu tố này để thấu hiểu thêm về trang Web và nội dung trên Website của bạn.

Tuy nhiên, không phải tất cả những liên kết đều là văn bản, một số là hình ảnh. Google đã từng chia sẻ rằng: 

Nếu bạn quyết định sử dụng một hình ảnh để làm liên kết, việc điền vào văn bản thay thế của nó sẽ giúp cho Google hiểu thêm về trang Web mà bạn đang muốn liên kết đến. Hãy tưởng tượng rằng bạn đang viết Anchor Text cho một liên kết văn bản.

Cách thêm ALT Text vào hình ảnh

Để thêm ALT Text vào hình ảnh, bạn chỉ cần thêm thuộc tính ALT vào <image> thẻ trong mã HTML.

[caption id="attachment_10680" align="aligncenter" width="700"]Việc thêm thẻ ALT Text vào hình ảnh không quá phức tạp Việc thêm thẻ ALT Text vào hình ảnh không quá phức tạp[/caption]

Trong đó, hình ảnh có thẻ ALT: <img src = “pie.jpg” alt= “steak and ale pie”>. Nếu như bạn đang sử dụng CMS hiện đại, bạn có thể thêm văn bản thay thế mà không cần phải đào sâu vào mã HTML.

Chẳng hạn như: Trong WordPress, có một trường cho văn bản thay thế khi bạn muốn thêm hình ảnh vào bài đăng hoặc một trang bất kỳ. Và mọi thứ cũng được làm tương tự đối với những CMS khác.

Bạn có nên thêm ALT text vào tất cả những hình ảnh không?

Đương nhiên là không, đây là một tư tưởng sai lầm cực kỳ phổ biến. Nếu như hình ảnh tồn tại với mục đích chỉ để trang trí mà không mang lại những thông tin quan trọng, giá trị cho người dùng. Vậy thì bạn không cần phải thêm những văn bản thay thế cho các hình ảnh này.

Ví dụ: Nhiều trang Web thường để những biểu tượng khác nhau để phân tách nội dung. Những thứ này được đặt ở đó chỉ để trông đẹp mắt. 

Chính vì vậy, bạn không nên đầu tư công sức vô ích để thêm văn bản thay thế cho chúng. Hành động này chỉ làm phiền khách truy cập dùng trình đọc màn hình chứ không hề cải thiện bất kỳ “giá trị SEO” nào cho Website của bạn. 

Điều này cũng tương tự đối với những hình ảnh chung chung hoặc có sẵn như thế này:

[caption id="attachment_10681" align="aligncenter" width="700"]Những hình ảnh chung chung không có ý nghĩa nhất định Những hình ảnh chung chung không có ý nghĩa nhất định[/caption]

Có văn bản thay thế chứa nội dung “bồn tắm và ngọn nến” sẽ không mang lại những giá trị hữu ích cho người khiếm thị. Bởi vì đó là những thông tin họ không cần biết. Chính vì vậy sẽ tốt hơn nếu như trình đọc màn hình bỏ qua nó hoàn toàn.

Thế nhưng, điều quan trọng hơn lại nằm ở yếu tố này:

Nếu như hình ảnh không yêu cầu văn bản thay thế, vậy biện pháp tối ưu nhất chính là bổ sung tính ALT trống. Điều này là do một số trình đọc màn hình đọc ra tệp mà không có thuộc tính ALT. Trong khi hầu hết các trường hợp sẽ bỏ qua những tên có thuộc tính trống.

Cách viết văn bản thay thế hấp dẫn

Cách thiết lập văn bản thay thế không khó khăn như nhiều người lầm tưởng. Bạn chỉ cần rèn luyện 5 kỹ năng mà mình chia sẻ dưới đây, việc tạo dựng ALT Text sẽ được đơn giản hóa:

  • Hãy ngắn gọn: Những văn bản thay thế quá dài dòng, lan man sẽ gây khó chịu cho những người xem sử dụng trình đọc màn hình. Chính vì vậy, bạn nên dùng càng ít từ càng tốt. Ngoài ra, bạn cũng có thể dùng thuộc tính Longdesc nếu cần phải mô tả dài).
  • Chính xác: Tập trung chủ yếu vào công việc mô tả hình ảnh.
  • Tránh tình trạng nhồi nhét từ khóa: Đây không phải là nơi để bạng tổng hợp quá nhiều từ khóa.
  • Tránh nói rằng đó là một hình ảnh: Bạn không cần phải nhắc đến những thông điệp như “Hình ảnh của…” trong mô tả. Bởi cả Google và trình đọc màn hình đều có thể tự giải quyết được những vấn đề đó.
  • Tránh dư thừa: Không lặp lại  thông tin đã tồn tại trong phần ngữ cảnh của hình ảnh. Chẳng hạn: Bạn có bức ảnh của Steve Jobs và dòng chữ ở ngay bên dưới có nội dung là “Steve Jobs”. Vậy khi đó bạn không cần phải thêm mô tả vào thẻ ALT, Google tự hiểu chú thích là ALT Text.
[caption id="attachment_10683" align="aligncenter" width="700"]ALT Text của bạn nên ngắn gọn, xúc tích và tránh dư thừa ALT Text của bạn nên ngắn gọn, xúc tích và tránh dư thừa[/caption]

Ngoài ra, bạn cũng nên thêm ALT Text vào những nút biểu mẫu. Nếu không thì trình đọc màn hình có thể bỏ qua chúng. Điều này khiến cho một số khách truy cập gặp khó khăn trong việc tương tác với trang Web của bạn.

Ví dụ về văn bản thay thế tốt và xấu

Hãy đảm bảo rằng bạn biết cách khai thác giá trị của ALT Text đúng cách cũng như biết điều gì mang lại hiệu quả và những gì không có hiệu quả. Thông qua những ví dụ điển hình sau:



Ví dụ 1
Văn bản thay thế xấu: <img src= “cheesecake.png” alt = “picture of cheesecake”>.Văn bản thay thế ổn: <img src = “cheesecake.png” alt = “cheesecake”>.Văn bản thay thế tốt: Tốt <img src = “cheesecake.png” alt = “strawberry cheesecake”>.Văn bản thay thế tốt nhất :<img src = “cheesecake.png” alt = “strawberry cheesecake with cream”>.


Ví dụ 2
Văn bản thay thế xấu: <img src= “cheesecake.png” alt = “picture of cheesecake”>.Văn bản thay thế ổn: <img src = “cheesecake.png” alt = “cheesecake”>.Văn bản thay thế tốt: Tốt <img src = “cheesecake.png” alt = “strawberry cheesecake”>.Văn bản thay thế tốt nhất :<img src = “cheesecake.png” alt = “strawberry cheesecake with cream”>.


Ví dụ 3
Văn bản thay thế xấu: <img src = “amp.png” alt = “image4">.Văn bản thay thế ổn: <img src = “amp.png” alt = “orange amplifier”>.Văn bản thay thế tốt: Tốt <img src = “amp.png” alt = “orange amplifier - 30 watts”>.Văn bản thay thế tốt nhất :<img src = “amp.png” alt = “orange AD30HTC - 30 watt amplifier”>.

Bạn nên lưu ý đến những thông số trong ví dụ cuối cùng. Bởi đây chính là một ví dụ khá thực tế. Đặc biệt là đối với những ai cần tạo dựng hình ảnh trên những trang sản phẩm thương mại điện tử.

Cách tìm và khắc phục sự cố với thuộc tính ALT

Hiện nay, có rất nhiều công cụ có khả năng thu thập được những dữ liệu trên Website của bạn. Chúng có thể giúp bạn tìm kiếm những thuộc tính thay thế bị thiếu, bao gồm kiểm tra trang Web của Ahrefs.

Tuy nhiên, việc thiếu ALT Text không phải lúc nào cũng là một vấn đề nghiêm trọng. Bởi vì không phải mọi hình ảnh trên Website của bạn đều yêu cầu những văn bản thay thế.

Ví dụ: Hãy xem những thuộc tính ALT bị thiếu sau:

[caption id="attachment_10682" align="aligncenter" width="700"]Những thông số cho biết về thuộc tính ALT bị thiếu Những thông số cho biết về thuộc tính ALT bị thiếu[/caption]

Rõ ràng những tên tệp cho thấy chúng không cần đến văn bản thay thế. Bởi mục đích của chúng chỉ là để trang trí. Tức là người sở hữu Website muốn trình đọc màn hình lướt qua chúng.

Chính lẽ đó, thay vì thu thập những dữ liệu trang Web của bạn và lúc nào cũng “ám ảnh” về mọi thuộc tính ALT bị thiếu (hầu hết mọi trang Web đều có khá nhiều thuộc tính bị thiếu). Mình nghĩ ý tưởng tốt hơn là kiểm tra và cải thiện những thẻ ALT cho các trang đã nhận được lưu lượng truy cập ấn tượng.

Lý do nên cải thiện thẻ ALT

  • Bạn có những độc giả khiếm thị: 1,2% công dân Việt Nam bị khiếm thị về thị lực. Tức là, nếu trang của bạn có 10.000 khách truy cập mỗi tháng thì 120 người trong số họ không thể thấu hiểu nội dung của bạn một cách chính xác.
  • Bạn có thể nhận được nhiều lưu lượng truy cập hơn: ALT Text có thể giúp cho hình ảnh được xếp hạng cao hơn trên Google hình ảnh, điều này sẽ cải thiện lưu lượng truy cập cho bạn. Chỉ cần tăng 1% với 1 trang có 10.000 lượt truy cập hàng tháng là bạn đã có thêm 100 khách truy cập.

Quy trình cải thiện thẻ ALT

  • Tìm các trang được truy cập nhiều nhất của bạn từ tìm kiếm không phải trả tiền. Bằng cách kiểm tra Google Analytics, Google Search Console hoặc báo cáo “Các trang hàng đầu” có trong trình khám phá trang Web của Ahrefs.
  • Kiểm tra các thuộc tính ALT của bạn: 
    • Bạn hãy cài đặt tiện ích mở rộng trình tìm kiếm văn bản thay thế miễn phí do Chome cung cấp. Sau đó tải lên trang có nhiều lưu lượng truy cập nhất và thao tác kích hoạt tiện ích mở rộng. Nếu như thuộc tính ALT bị thiếu, bạn sẽ thấy một cảnh báo.
    • Kiểm tra ALT Text để tìm kiếm một vài hình ảnh trên trang của bạn. Bạn sẽ sớm cảm nhận được liệu chúng có đang được tối ưu hóa tốt hay không tốt. 
  • Lặp lại với những trang khác. Hãy thực hiện lại những thao tác trên với các trang nhận được nhiều lượt truy cập nhất trên Website của bạn. 
    • Điều này giúp bạn đánh giá được liệu quá trình tối ưu hóa văn bản thay thế của bạn có phù hợp hay cần hoạt động hay không. Bởi vì hầu hết những trang Web nhận được phần lớn lượt truy cập của bạn đều chỉ đến một số trang mà không mất quá nhiều thời gian.
    • Ví dụ: Chỉ mười bài đăng trên Blog Ahrefs đã chiếm đến 51% lưu lượng truy cập không phải trả tiền hàng tháng,… Thông số này giúp nhà quản trị Web dễ dàng kiểm tra, tối ưu ALT Text cho hầu hết những trang có lưu lượng truy cập cao chỉ trong vài phút.

Kết luận

Tối ưu hóa ALT Text thực sự quan trọng, nhưng nó không phải yếu tố trọng tâm trong quá trình thiết lập SEO hình ảnh. Bạn nên kết hợp tối ưu hóa tệp, cung cấp những hình ảnh đáp ứng nhu cầu khách hàng,… Chúc các bạn thành công!