Trong một bố cục website, việc tạo liên kết giữa các trang với nhau là rất quan trọng, giúp các công cụ tìm kiếm hiểu được sơ đồ trang web bạn có cấu trúc, có mối liên hệ chặt chẽ với nhau qua đó hỗ trợ cho SEO tốt hơn. Bài hôm nay chúng ta sẽ cùng tìm hiểu cách dùng thẻ a để tạo liên kết trong HTML. Bài học nằm trong Serie HTML căn bản.
Cách dùng thẻ a để tạo liên kết như sau
Mỗi một liên kết sẽ nằm trong cặp thẻ <a> </a>
Cú pháp tạo một liên kết (link):
<a href="http://BlogLoi.com" target="_blank" title="Học lập trình web" rel="follow, index" >BlogLoi.com</a>
Trong đó :
- href : là đường link đến website đích
- title : là tiêu đề cho đường link
- rel : là các thuộc tính dành cho SEO. follow, index là cho phép các công cụ tìm kiếm như google, yahoo vào website của bạn để cập nhật bài viết mới
- target : gồm các thuộc tính sau (giá trị mặc định là _self)
- _blank : chuyển link qua tab mới
- _self : chuyển link trên tab hiện tại
- _parent : chuyển link đến tab cha của tab hiện tại
- _top : nhảy tới tab hiện tại và thường dùng trong iframe chạy tới trang gốc luôn
Ở đây bạn chú ý chữ BlogLoi.com nằm trước thẻ đóng </a>. Đây sẽ là văn bản hiển thị ra ngoài trang web cho người dùng xem và nhấp vào.
Liên kết neo – Anchor link
Liên kết neo nói một cách dễ hiểu đó là dẫn người dùng đến một vị trí cụ thể nào đó trong trang web hiện tại.
Cú pháp : href=“#id_name”, khi người dùng nhấp vào thì sẽ nhảy tới vị trí của thẻ HTML có id=”id_name” trong trang hiện tại.
Ví dụ : Khi click vào thẻ a sau thì sẽ nhảy tới thẻ #noidung
<a href="#noidung" title="Lập trình web HTML" rel="follow, index">Đi tới #noidung</a>
Thẻ #noidung:
<p id="noidung">Hướng dẫn học lập trình web HTML</p>
Ngoài ra, nếu bạn vào một website bán hàng thường sẽ thấy dưới chân trang có chữ Back To Top và khi bạn nhấp vào thì sẽ đưa bạn lên đầu trang, đó chính là một ví dụ điển hình về liên kết neo này, hay ngay website của mình BlogLoi.com cũng đang sử dụng định dạng này, bạn nhìn dưới chân trang góc bên phải sẽ thấy.
Lời kết : Kết thúc bài hôm nay bạn đã có thể nắm được cách dùng thẻ a để tạo liên kết HTML trong trang web căn bản, dù website nhỏ hay website lớn thì định dạng này luôn được sử dụng thường xuyên và rất phổ biến hiện nay nó vừa giúp người dùng dễ dàng đi lại giữa các trang web trong một website hay từ website này đến một website khác, vừa giúp các công cụ tìm kiếm thấy được cấu trúc và bố cục chặt chẽ của website mình qua đó đánh giá thứ hạng website cao hơn.
Chúc bạn thành công!
Những bài bạn nên xem:
- Các thẻ HTML định dạng danh sách (list)
- Các thẻ HTML định dạng văn bản
- Các thẻ HTML khai báo thông tin trang web
- Bố cục HTML của một trang web hiện nay
