Một thuộc tính mà các nhà thiết kế web thường quên khi sử dụng hình ảnh ( thẻ img) trong trang web là thuộc tính alt (alternative text). Vậy thuộc tính này có ý nghĩa gì và tầm quan trọng của nó ra sao?
2 chức năng quan trọng nhất của thuộc tính alt:
- Khả năng truy cập
- Tối ưu máy tìm kiếm SEO
- Tính tương thích với chuẩn HTML, XHTML của W3C
Thuộc tính alt giúp người xem nhìn thấy các ký tự thay thế khi trình duyệt không tìm thấy đường dẫn của ảnh, trình duyệt không hiển thị ảnh hoặc ảnh đó không thể hiển thị.
Các robots không thể nhìn thấy hình ảnh trên các trang web của bạn mà chúng sẽ crawl các ký tự thay thế alternative text. Do đó khi người dùng tìm kiếm hình ảnh với các từ khóa xuất hiện trong thuộc tính alt, máy tìm kiếm sẽ trả về các kết quả liên kết tới trang web của bạn. Từ đó giúp bạn thu được một lượng traffic và khả năng SEO tốt hơn.
Ngôn ngữ HTML (4.0) và XHTML yêu cầu thuộc tính alt để mô tả hình ảnh trong thẻ img. Vậy bạn hãy thêm thuộc tính này vào tất cả các thẻ img trên trang web của bạn.
<img src="/cntt/URI" alt="alternative text" />
Alt Text không phải Alt Tag
Nhiều người nhầm lẫn khi gọi thuộc tính này là thẻ alt. Các ký tự nằm trong thuộc tính này gọi là alt text. Vậy chúng ta cần phân biệt thẻ HTML - HTML tag với các thuộc tính của các thẻ này.
Thế nào là thẻ HTML?
Thẻ là những ký tự đánh dấu cho biết bắt đầu hoặc kết thúc của một phần tử HTML element. Nó là ký tự xuất hiện trong cặp mở đóng ngoặc nhọn.
Ví dụ:
<p> - Đây là một thẻ mở
</strong> - thẻ đóng
<img /> - thẻ đơn
Thế nào là một thuộc tính?
Thuộc tính là một phần của phần tử HTML element có tác dụng cung cấp thông tin hỗ trợ cho phần tử đó. Ví dụ:
<p style="color:red;">
<a href="/cntt/index.htm">
<img src="/cntt/image.gif" />
Alt Text không phải là Tool Tip
Chỉ trình duyệt Internet Explorer hỗ trợ hiển thị alt text như tool tip. Nhưng tốt nhất bạn nên sử dụng thuộc tính title làm tiêu đề ảnh của ảnh như một tool tip.
anh3ngơ Theo kenh 360
About Chinhnd
This comment has been removed by the author.
ReplyDelete