Một href html

Danh sách không có thứ tự thường được tạo với mục đích sử dụng chúng làm menu, nhưng mục danh sách li là văn bản. Vì danh sách li mục là văn bản nên con trỏ chuột sẽ không phải là mũi tên mà là "con trỏ chuột". Người dùng đã quen với việc nhìn thấy ngón tay trỏ cho con trỏ chuột khi có thể nhấp vào thứ gì đó. Sử dụng thẻ neo a bên trong thẻ li khiến con trỏ chuột thay đổi thành ngón tay trỏ. Ngón tay trỏ tốt hơn rất nhiều khi sử dụng danh sách làm menu

   
Menu Item 1
   
Menu Item 2
   
Menu Item 3
   
Menu Item 4

Nếu danh sách đang được sử dụng cho một menu và không cần liên kết thì không cần chỉ định URL. Nhưng vấn đề là nếu bạn bỏ qua thuộc tính href, văn bản trong thẻ được xem là văn bản và do đó, con trỏ chuột quay trở lại con trỏ chữ I. Con trỏ I có thể khiến người dùng nghĩ rằng mục menu không thể nhấp được. Do đó, bạn vẫn cần một href, nhưng bạn không cần liên kết đến bất kỳ đâu

Bạn có thể sử dụng nhiều thẻ div hoặc p cho danh sách menu, nhưng con trỏ chuột cũng sẽ là con trỏ chữ I cho chúng

Bạn có thể sử dụng nhiều nút xếp chồng lên nhau cho một danh sách menu, nhưng danh sách này có vẻ thích hợp hơn. Và đó có lẽ là lý do tại sao li0 trỏ đến hư không được sử dụng trong thẻ neo bên trong thẻ danh sách

Bạn có thể đặt kiểu con trỏ trong CSS, vì vậy đó là một tùy chọn khác. li0 đến hư không có thể chỉ là cách lười biếng để thiết lập một số kiểu dáng

Trải nghiệm người dùng (UX) đã trở thành một tín hiệu xếp hạng quan trọng của Google, vì vậy điều quan trọng hơn bao giờ hết là đảm bảo trang web của bạn đạt tiêu chuẩn. Điều hướng tốt góp phần vào trải nghiệm của người dùng, vì vậy, tốt nhất bạn nên cập nhật các siêu liên kết nổi bật trên trang web của mình.  

Siêu liên kết cho phép người dùng "di chuyển" từ trang này sang trang khác. Bạn sẽ biết các liên kết này đang hoạt động khi con trỏ chuột của bạn thay đổi từ mũi tên thành bàn tay khi di chuột qua liên kết. Bạn có thể đính kèm liên kết HTML vào các thành phần trang khác nhau, bao gồm văn bản, hình ảnh, v.v.

Trong hướng dẫn này, chúng ta sẽ khám phá cách thức hoạt động của các siêu liên kết (được gọi là “liên kết HTML” hoặc “liên kết a href”), tại sao điều quan trọng là phải luôn cập nhật các siêu liên kết của bạn cũng như cách tìm và sửa các siêu liên kết xấu bằng công cụ Kiểm tra trang web

Tại sao các liên kết HTML lại quan trọng?

Người dùng tìm kiếm trên internet có mục đích; . Nhờ nỗ lực SEO của bạn, Google đã đưa bạn vào tầm ngắm của họ.  

Khi bạn đã nắm bắt được một khách truy cập, bạn cần hướng dẫn họ qua trang web của bạn một cách dễ dàng để trải nghiệm người dùng của họ trở nên thú vị. Các liên kết HTML của bạn rất quan trọng để hướng dẫn người dùng của bạn từ trang này sang trang khác trên trang web của bạn

Liên kết HTML tốt tăng thời gian phiên của người dùng và có thể dẫn đến nhiều trang được truy cập hơn mỗi phiên — hai chỉ số quan trọng đối với phân tích trang web.  

What does an HTML tag look like?

Thẻ liên kết (hoặc thẻ “a href” hoặc “liên kết”) bao gồm thẻ mở, bất kỳ thuộc tính thẻ nào, văn bản liên kết hoặc đối tượng và thẻ đóng. Ví dụ

li2

The “href” is an essential attribute of the element; it determines the link's destination. 

Liên kết thuộc tính HREF là gì?

Liên kết thuộc tính href (viết tắt của “Tham khảo siêu văn bản”) cho biết mối quan hệ giữa các trang với công cụ tìm kiếm

href là một thuộc tính của thẻ neo và chứa hai thành phần

1. URL (liên kết thực tế) và
2. Văn bản hoặc đối tượng có thể nhấp mà người dùng sẽ thấy trên trang (được gọi là "văn bản neo")

Ví dụ

li3

Where does the HTML link open once clicked? 

Khi người dùng nhấp vào liên kết HTML của bạn, trang liên kết có thể sẽ mở trong cùng một cửa sổ hoặc tab trình duyệt. Trừ khi bạn chỉ định bằng mã cách liên kết sẽ được hiển thị, đây là mặc định.  

Tuy nhiên, nếu bạn đã tải xuống hoặc muốn trang mở trong một cửa sổ hoặc tab khác, bạn có thể sử dụng các thuộc tính đích như “_blank. ”

Các giá trị thuộc tính mục tiêu phổ biến nhất là

1. _bản thân. trang/tài liệu mở trong cùng một cửa sổ

   li4

2. _blank = mở tài liệu/trang trong một cửa sổ mới

   li5

Tương đối so với. URL tuyệt đối

Cấu trúc URL của bạn có thể góp phần vào cách Google có thể thu thập dữ liệu trang web của bạn một cách hiệu quả. Bạn có thể sẽ sử dụng một trong hai loại cấu trúc URL phổ biến. tương đối và tuyệt đối

Liên kết tương đối sử dụng một phần của URL và chủ yếu dành riêng cho liên kết nội bộ khi liên kết nằm trên cùng một trang và do đó thuộc cùng một miền gốc. Họ trông giống như thế này

li6

Tuy nhiên, một liên kết tuyệt đối sử dụng liên kết trang web đầy đủ, bao gồm cả tên miền của trang web

li7

Khi nào nên sử dụng URL tương đối

Bạn sử dụng các URL tương đối khi bạn muốn liên kết đến một trang trên trang web của mình. Bạn sẽ sử dụng "slug" của URL trong liên kết.  

Một số ưu điểm của việc sử dụng URL tương đối bao gồm

• Chuyển nhanh sang một miền mới (bạn sẽ không cần cập nhật từng URL)
• Thời gian tải trang nhanh hơn (một yếu tố xếp hạng của Google

Khi nào nên sử dụng URL tuyệt đối

Nếu bạn đang gửi người dùng của mình đến một trang bên ngoài (tôi. e. cách xa trang web của bạn), bạn sẽ sử dụng một URL tuyệt đối.  

Một số lợi ích khi sử dụng URL tuyệt đối bao gồm

• Liên kết trỏ đến đúng URL mọi lúc (Google sẽ luôn biết phải đi đâu)
• Trình thu thập dữ liệu trang web của Google có thể quét các URL này dễ dàng hơn (quan trọng đối với việc lập chỉ mục)

How do HTML links appear live?

Bạn sẽ tìm thấy các liên kết HTML trên trang web khi di chuột qua văn bản neo, hình ảnh, nút, v.v. , và con trỏ biến thành bàn tay.  

Theo mặc định, các liên kết xuất hiện dưới dạng

• Gạch dưới và màu xanh lam (nếu bạn chưa truy cập liên kết)
• Gạch chân và màu tím (bạn đã truy cập liên kết)
• Gạch dưới và màu đỏ (một liên kết hoạt động)

Đây là một ví dụ về sao chép trang web với siêu liên kết. Các từ được đánh dấu màu xanh chứa các siêu liên kết

Lưu ý rằng nếu màu liên kết của trang web của bạn quá giống với màu nền của trang web, bạn có thể thay đổi màu của liên kết để làm cho chúng nổi bật.  

Businesses with brand colors will likely know the color's hex code. Modify your HTML tag (the anchor tag) with the hex code as follows: 

li8

Nếu bạn không có mã màu hex, có khoảng 140 màu được đặt tên mà bạn có thể chọn. Thay vì mã hex, bạn nên thêm màu của chính nó, chẳng hạn như “xanh dương” hoặc “đỏ. ”

li9

Các loại Siêu liên kết

Có một số cách bạn có thể sử dụng siêu liên kết để tạo trải nghiệm điều hướng dễ dàng trên trang web của mình. Hãy coi liên kết là kết nối giữa tài nguyên này với tài nguyên khác, cho dù là trang web, tài liệu, biểu mẫu, v.v.  

Hãy xem xét các loại siêu liên kết phổ biến nhất mà bạn sẽ tìm thấy trên một trang web

1. Liên kết hình ảnh. Bạn có thể siêu liên kết một hình ảnh đến một tài nguyên khác. Ví dụ: bạn muốn siêu liên kết hình ảnh của sản phẩm tới trang sản phẩm của nó

Bạn có thể sẽ sử dụng một cấu trúc liên kết tương tự như thế này

li0

1. Liên kết email và điện thoại. Bạn sẽ sử dụng các liên kết này khi bạn muốn người dùng liên hệ trực tiếp với mình. Trên thiết bị di động, các loại liên kết này hướng người dùng đến một hành động trực tiếp. gọi số điện thoại của bạn hoặc soạn thảo một email cho bạn.
   Đối với địa chỉ email, bạn thêm mailto. bên trong thuộc tính href của bạn như sau.

li1

Đối với một số điện thoại, bạn thêm tel. bên trong thuộc tính href của bạn

li30

1. Liên kết nút. Các nút siêu liên kết là một tính năng thiết kế web phổ biến và rất hữu ích để thêm lời kêu gọi hành động (CTA) vào trang web của bạn. CTA cho người dùng của bạn biết phải làm gì. liên hệ với chúng tôi, tải xuống tài liệu quảng cáo, đọc thêm, v.v.
   Một cách để thêm liên kết vào nút là bọc phần tử nút trong liên kết.

li31

Thuộc tính Hreflang

Thuộc tính Hreflang cho biết mối quan hệ giữa các trang ở các ngôn ngữ khác nhau trên trang web của bạn với các công cụ tìm kiếm. Nếu trang web của bạn nhắm mục tiêu đối tượng đa quốc gia, bạn sẽ cần thêm thuộc tính hreflang.  

Đây là vài ví dụ

li32

Cách xác định các vấn đề liên kết với Semrush

Khi các bot của Google cố gắng quét trang web của bạn, chúng có thể sẽ dừng tiếp tục nếu tìm thấy nhiều liên kết bị hỏng. Do đó, việc lập chỉ mục trang web của bạn sẽ khó hơn và mất nhiều thời gian hơn nếu Google chọn.  

Công cụ Kiểm tra trang web có thể giúp bạn xác định bất kỳ lỗi nào liên kết trên trang web của bạn. Nó bao gồm hơn 120 kiểm tra kỹ thuật và trên trang để phát hiện các lỗi phổ biến

Bạn sẽ cần tạo dự án cho miền của mình trước khi sử dụng công cụ Kiểm tra trang web.  

Bước 1. Khi dự án của bạn đã được tạo, hãy khởi chạy công cụ Kiểm tra Trang web từ bảng điều khiển dự án của bạn.  

Sử dụng bảng điều khiển để định cấu hình phạm vi thu thập thông tin của công cụ và quyền truy cập trang web.  

Khi quá trình kiểm tra hoàn tất, hãy nhấp vào tab sự cố

Lọc qua các vấn đề cho bất kỳ lỗi liên kết nào. Nếu bạn không chắc ý nghĩa của lỗi, thì công cụ này sẽ bao gồm phần giải thích và đề xuất về cách giải quyết vấn đề (“Tại sao và cách khắc phục sự cố”).  

Suy nghĩ cuối cùng

Siêu liên kết tốt giúp điều hướng và thu thập dữ liệu trang web của bạn dễ dàng hơn. Bất kể cấu trúc liên kết của bạn là gì, điều quan trọng là phải phát hiện và cập nhật các liên kết bị hỏng càng sớm càng tốt.  

Sử dụng công cụ Kiểm tra trang web để phát hiện bất kỳ liên kết bị hỏng hoặc xấu nào và luôn cập nhật mọi lỗi kỹ thuật tiềm ẩn

Là href một thuộc tính HTML?