Contents
HTML a href: Main Tips
- The
<a>HTML element links a page to a document, another page, or any other specified location. hrefis the most frequently used attribute. Thea hrefpart of the HTML code for link specifies where the hyperlink leads to.- The generated hyperlink can be used on images, text, or content inside HTML tags.
Use of a
<a> in HTML defines a hyperlink to an external page, a different part of the same page or other location. Some browsers also support hyperlinks to non-HTTP-based documents (like mailto:).
The following example shows the basic HTML code for link:
Note: both opening and closing HTML <a> tags are necessary for hyperlinks to work.
Attributes Available for a
download
download sets the target to be downloaded instead of opened in the browser.
<a href="/images/bitdegree/spaceDoggo.png" download>Download image</a>href
a href defines the URL of the page the link should lead to.
hreflang
a hreflang specifies the language of the linked page.
<a hreflang="en" href="https://www.bitdegree.org/">Bitdegree</a>rel
a rel indicates the relationship between the linked document and the current document.
<a rel="nofollow" href="https://www.bbc.com/">External webpage</a>These are the most common values for the rel attribute:
| Value | Meaning |
|---|---|
| external | The referenced document belongs to a different site. |
| next | The referenced document belongs to the same series as the current one and comes after it. |
| nofollow | The link cannot affect the SEO ranking of the referenced document. |
| noopener | The referenced document cannot access the window object. |
| noreferrer | All data of the referrer is hidden. |
| prev | The referenced document belongs to the same series as the current one and comes before it. |
Note: you can see all the possible values for rel listed and explained in the HTML Living Standard.
target
a target indicates where the linked URL should be opened.
<a href="https://www.bitdegree.org/learn/anchor-tag/#ltagt" target="_blank">HTML a element</a>There are four values you can use with target:
| Value | Loads the linked URL in |
|---|---|
| _self | The current browsing context (the default value) |
| _blank | New browsing context (a tab by default) |
| _parent | Parent of the current browsing context |
| _top | Top-level browsing context |
Note: if a parent cannot be found, both _parent and _top adopt the behavior of _self.
type
type sets media type in MIME format for the linked document.
<a href="https://www.bitdegree.org/courses" type="text/html">Learn while gaming</a>Each MIME type is defined in a type, a subtype and the details parameter (optional):
| Type | Definition | Examples |
|---|---|---|
| application | Data to execute, or data that can only be used with a specific application | application/pdf, application/zip |
| audio | Audio data | audio/mp4, audio/aac |
| example | A placeholder representing MIME types in usage examples | Only used in code examples |
| font | Text font data | font/otf, font/ttf |
| image | Still or animated graphic data | image/jpeg, image/png |
| message | Multiple message data | message/news, message/delivery-status |
| multipart | Multiple component (not necessarily the same MIME type) data | multipart/encrypted, multipart/signed |
| model | 3D object model data | model/3mf, model/vnd.gdl |
| text | Readable textual data | text/plain, text/html |
| video | Video data | video/mp4, video/quicktime |
Note: the complete list of MIME types is enormous - you can view it here.
Deprecated Attributes
Warning: do not use these attributes: HTML5 does not support them.
charset
charset defined a character set of the linked page.
<a charset="UTF-8" href="https://www.bitdegree.org/">Bitdegree</a>coords
coords set coordinates for a link.
<img src="creatures.gif" width="220" height="220" alt="Creatures" usemap="#creaturemap">
<map name="creaturemap">
<area shape="rect" coords="34, 44, 270, 350" alt="Doggo" href="http://www.bitdegree.org/">
<area shape="rect" coords="290, 172, 333, 250" alt="Gaming" href="http://www.bitdegree.org/">
<area shape="circle" coords="337, 300, 44" alt="Level up" href="http://www.bitdegree.org/">
</map>
name
name specified the name of the anchor.
<a href="#target">Go to target</a>
<h1><a name="target">Name attribute</a></h1>
<p>This section explains the usage of name attribute.</p>rev
rev indicated the relationship between the linked document and the current document.
<a rev="nofollow" href="https://www.bitdegree.org/courses">External webpage</a>shape
shape specified the shape of a link.
<img src="creatures.gif" width="220" height="220" alt="Creatures" usemap="#creaturemap">
<map name="creaturemap">
<area shape="rect" coords="34, 44, 270, 350" alt="Doggo" href="http://www.bitdegree.org/">
<area shape="rect" coords="290, 172, 333, 250" alt="Gaming" href="http://www.bitdegree.org/">
<area shape="circle" coords="337, 300, 44" alt="Level up" href="http://www.bitdegree.org/">
</map>