Thẻ a trong HTML
Trần Thị Vân
- 1485
- 21/02/2025
Chức năng của Thẻ a trong HTML
Thẻ a trong HTML dùng để gắn liên kết đến một website nào đó hoặc các trang web trên chính website đó, có thể liên kết đến một file nào đó để download, liên kết đến số điện thoại hoặc trang chat nào khác,... thẻ này rất quan trọng đối với website vì giúp các trang web trên website liên kết được với nhau và hơn thế nữa.
Cú pháp của Thẻ a trong HTML
<a href="lienket" target="dich" rel="giatrirel" >vanbanhtml</a>
vanbanhtml: Văn bản hoặc thẻ HTML.
href: Chứa lienket (Các liên kết là url cụ thể hoặc nút gọi hoặc nhắn tin của một trang nào đó)
target: Quy định điểm dich (Liên kết ở trên trang hoặc sang trang khác)
rel: Quy định giatrirel (dofollow: Cho phép công cụ tìm kiếm kiểm tra, nofollow: Báo côn cụ tìm kiếm bỏ qua).
Các thuộc tính có trên Thẻ a trong HTML
Thuộc tính target trên thẻ a
Nếu không có thẻ target thì mặc định trình duyệt sẽ mở trực tiếp liên kết được gắn ở ngay tab hiện tại.
_blank: Khi nhấp vào liên kết thì trình duyệt web sẽ mở ra một tab mới và tab mới sẽ hiện trang web của URL đã nhấp vào.
<a href="https://webmoi.vn/" target="_blank" >Web Mới</a>
_self: Liên kết sẽ được mở trực tiếp ở tab hiện tại của trình duyệt, nó giống như việc không đặt thẻ target.
<a href="https://webmoi.vn/" target="_self" >Web Mới</a>
_parent: Sử dụng trong trường hợp liên kết được gắn nằm trong một iframe, lúc này bạn muốn liên kết đó khi nhấn vào thì chuyển về đúng liên kết mà tab hiện tại thay bằng toàn bộ nội dung trang của liên kết được nhấp, nếu dùng _self thì sẽ chuyển hướng về liên kết nhưng vẫn ở trong iframe chứ không thay đổi toàn trang.
_top: Nó giống như _parent, cũng dùng cho liên kết nằm trong iframe và để nhấp vào liên kết mà tab hiện tại thay đổi qua trang mới được thì dùng _top.
framename: Khi bạn nhấp vào liên kết thì nội dung trang của liên kết được nhấp sẽ được hiện trong iframe có tên được chỉ định.
Thuộc tính rel trong thẻ a
rel nofollow: Báo cho công cụ tìm kiếm bỏ qua liên kết được gắn này.
<a href="https://www.facebook.com/webmoi.vn" rel="nofollow" target="_blank" title="Kênh Facebook">Kênh Facebook</a>
rel dofollow: Báo cho công cụ tìm kiếm theo dõi liên kết này.
<a href="https://webmoi.vn/the-table-trong-html/" rel="dofollow" title="Thẻ table trong HTML">Thẻ table trong HTML</a>
Các liên kết của Thẻ a trong HTML
Liên kết Thẻ a đến một URL cụ thể:
Theo dõi website <a href="https://webmoi.vn/">Web Mới</a>
Liên kết Thẻ a đến số điện thoại:
<a href="tel:0398259259">Gọi Ngay</a>
Liên kết Thẻ a đến tin nhắn messenger của fanpage:
<a href="https://m.me/webmoi.vn">Chat Messenger</a>
Liên kết thẻ a đến WhatsApp:
<a href="https://wa.me/+84977376367">WhatsApp</a>
Các lưu ý quan trọng khi sử dụng thẻ a trong HTML
Thẻ a trong HTML tuy có cú pháp đơn giản nhưng cần được sử dụng đúng cách để liên kết hoạt động hiệu quả, dễ hiểu với người dùng và thân thiện hơn với công cụ tìm kiếm. Việc tối ưu nội dung liên kết, thuộc tính đi kèm và cách mở trang đích sẽ giúp website có trải nghiệm tốt hơn.
Đặt anchor text phù hợp để tăng khả năng điều hướng
Anchor text là phần nội dung hiển thị mà người dùng nhấp vào để truy cập liên kết. Một anchor text tốt cần mô tả rõ ràng nội dung của trang đích thay vì sử dụng các cụm từ chung chung như “xem thêm” hoặc “nhấn vào đây”.
Nội dung mô tả chính xác giúp người dùng dễ quyết định có nên truy cập liên kết hay không, đồng thời hỗ trợ công cụ tìm kiếm hiểu được mối liên quan giữa các trang trên website.
Ví dụ, thay vì sử dụng liên kết có nội dung:
<a href="/html">Xem thêm</a>
Có thể sử dụng anchor text cụ thể hơn:
<a href="/html">Hướng dẫn học HTML cơ bản</a>
Cách đặt tên liên kết rõ nghĩa sẽ giúp hệ thống điều hướng tự nhiên hơn và cải thiện khả năng tiếp cận thông tin của người dùng.
Sử dụng thuộc tính rel và target đúng cách khi tạo liên kết
Khi tạo liên kết, các thuộc tính như target và rel cần được sử dụng phù hợp với mục đích thực tế. Thuộc tính target giúp kiểm soát cách mở trang liên kết, trong khi rel cung cấp thêm thông tin về mối quan hệ giữa trang hiện tại và trang được liên kết.
Đối với các liên kết mở trang mới bằng target với giá trị _blank, nên kết hợp thêm thuộc tính rel phù hợp để tăng tính an toàn cho website.
<a href="https://example.com" target="_blank" rel="noopener">Truy cập website</a>
Việc khai báo đúng các thuộc tính không chỉ giúp liên kết hoạt động ổn định mà còn hạn chế những rủi ro không mong muốn trong quá trình người dùng truy cập.
Tối ưu thẻ a giúp cải thiện trải nghiệm người dùng và SEO
Một thẻ a được tối ưu cần đảm bảo liên kết dễ nhận biết, dẫn đến nội dung liên quan và không gây khó khăn khi sử dụng. Người viết nên ưu tiên xây dựng hệ thống liên kết có giá trị thay vì tạo quá nhiều liên kết không cần thiết.
Một số yếu tố cần chú ý khi tối ưu thẻ a:
- Sử dụng nội dung liên kết ngắn gọn, dễ hiểu và đúng với trang đích.
- Kiểm tra thường xuyên để tránh các liên kết bị lỗi hoặc không còn tồn tại.
- Ưu tiên liên kết nội bộ đến những nội dung liên quan để hỗ trợ người dùng khám phá website.
- Không lạm dụng quá nhiều liên kết trong một khu vực nội dung vì có thể làm giảm trải nghiệm đọc.
Khi được sử dụng hợp lý, thẻ a không chỉ là công cụ tạo liên kết mà còn đóng vai trò quan trọng trong việc xây dựng cấu trúc website, hỗ trợ điều hướng và nâng cao chất lượng nội dung.
Lời kết
Cảm ơn các bạn đã tham khảo bài viết Thẻ a trong HTML.
- 0 Bình luận
Email, Điện thoại của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *