HTML Link Attributes Explained

Link Attributes

href

Description: Specifies the URL of the page the link goes to.

Example:

<a href="https://www.example.com">Visit Example</a>

Explanation: When clicked, this link directs the user to https://www.example.com.

Visit Example

target

Description: Specifies where to open the linked document.

  • _self: Opens in the same frame (default).
  • _blank: Opens in a new tab or window.
  • _parent: Opens in the parent frame.
  • _top: Opens in the full window.

Example:

<a href="https://www.example.com" target="_blank">Open in New Tab</a>

Explanation: This link will open https://www.example.com in a new tab.

Open in New Tab

rel

Description: Specifies the relationship between the current document and the linked document.

  • nofollow: Tells search engines not to follow the link.
  • noopener: Prevents the new page from accessing the window.opener property.
  • noreferrer: Prevents the browser from sending the Referer header to the linked page.

Example:

<a href="https://www.example.com" rel="noopener noreferrer">Secure Link</a>

Explanation: This link will open in a new tab with noopener and noreferrer attributes to enhance security.

Secure Link

download

Description: Prompts the user to download the linked file instead of navigating to it.

Example:

<a href="/path/to/file.zip" download="filename.zip">Download File</a>

Explanation: Clicking this link will prompt the user to download file.zip.

Download File

hreflang

Description: Specifies the language of the linked document.

Example:

<a href="https://www.example.com" hreflang="en">English Version</a>

Explanation: This link indicates that the linked document is in English.

English Version

More Examples