Bài 06: Dùng thẻ a trong HTML để tạo links

Trong một website luôn tồn tại các link liên kết với nhau. Ví dụ như bài HTML là gì mình đã gán một link tới trang trình bày khái niệm đó. Vậy thì ...

Trong một website luôn tồn tại các link liên kết với nhau. Ví dụ như bài HTML là gì mình đã gán một link tới trang trình bày khái niệm đó. Vậy thì trong bài này chúng ta tìm hiểu cách sử dụng thẻ a để tạo nên những link liên kết như vậy.

1. Thẻ a trong HTML

Nếu bạn tìm hiểu SEO thì sẽ thấy thẻ a đóng vai trò khá quan trọng khi bạn đi backlink. Chúng ta có hai loại link đó là link nội bộ và link out ra ngoài website khác. Link nội bộ là link chỉ liên kết tới những trang nằm trong nội bộ của domain, còn link out ra ngoài là link trỏ tới những website không phải là domain hiện tại. Ví dụ link học lập trình online là link nội bộ và link w3c tutorials là link out.

Cú pháp tạo một link như sau: XEM DEMO

<a href="https://code24h.com" target="_blank" title="học lập trình online" rel="follow, index">Freetuts.net</a>

Trong đó thuộc tính:

  • href là đường link đến địa chi website đích
  • title là tiêu đề cho đường link
  • rel là các giá trị dành cho SEO
  • target là các tùy chọn, nếu nó có giá trị (giá trị mặc định là _self):
    • _blank thì nó sẽ chuyên link trên tab mới
    • _self thì nó sẽ chuyển link trên tab hiện tại
    • _parent thì nó sẽ chuyển link tới tab mở tab hiện tại. Ta còn hay gọi là tab cha của tab hiện tại
    • _top thì nó sẽ nhảy tới tab hiện tại và thường dùng trong iframe khi muốn thoát khỏi iframe và chạy tới trang gốc luôn.

Thẻ a chạy tới vị trí trong bổ cục trang web: Ngoài cách đặt link vào thuộc tính href thì bạn có thể đặt một giá trị với cú pháp href="#id_name" để khi người dùng click vào thì nó 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 thì sẽ nhảy tới thẻ div#footer trong trang hiện tại.

<a href="#footer" title="học lập trình online" rel="follow, index">Đi tới div#footer</a>

Thẻ a gồm có 4 trạng thái chính đó là:

  • link
  • visited
  • hover
  • active

4 trạng thái này thông thường chúng ta kết hợp với CSS để tạo hiệu ứng, vấn đề này mình sẽ trình bày trong bài CSS định dạng thẻ a.

2. Lời kết

Thẻ a được dùng để đi backlink khi các bạn làm việc với SEO để kéo traffic về website. Tuy nhiên nếu áp dụng giá trị thuộc tính của title mà không đúng cách thì sẽ gây bất lợi cho SEO.

Bài này mình dừng ở đây vì nó khá ngắn gọn, chúc các bạn học tốt.

BÀI KẾ SAU
BÀI KẾ TIẾP

Nguồn: code24h.com

0