🔥 $100K Hit! Where Will Bitcoin Go Next? Find Out Live!

Code has been added to clipboard!

HTML a Tag

Reading time 4 min
Published Jun 29, 2017
Updated Oct 2, 2019

HTML a href: Main Tips

  • The <a> HTML element links a page to a document, another page, or any other specified location.
  • href is the most frequently used attribute. The a href part 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:

Example
<a href="https://www.bitdegree.org/">Bitdegree</a>

Note: both opening and closing HTML <a> tags are necessary for hyperlinks to work.

DataCamp
Pros
  • Easy to use with a learn-by-doing approach
  • Offers quality content
  • Gamified in-browser coding experience
  • The price matches the quality
  • Suitable for learners ranging from beginner to advanced
Main Features
  • Free certificates of completion
  • Focused on data science skills
  • Flexible learning timetable
Udacity
Pros
  • Simplistic design (no unnecessary information)
  • High-quality courses (even the free ones)
  • Variety of features
Main Features
  • Nanodegree programs
  • Suitable for enterprises
  • Paid Certificates of completion
edX
Pros
  • A wide range of learning programs
  • University-level courses
  • Easy to navigate
  • Verified certificates
  • Free learning track available
Main Features
  • University-level courses
  • Suitable for enterprises
  • Verified certificates of completion

Attributes Available for a

download

download sets the target to be downloaded instead of opened in the browser.

Example
<a href="/images/bitdegree/spaceDoggo.png" download>Download image</a>

href

a href defines the URL of the page the link should lead to.

Example
<a href="https://www.bitdegree.org/">Bitdegree</a>

hreflang

a hreflang specifies the language of the linked page.

Example
<a hreflang="en" href="https://www.bitdegree.org/">Bitdegree</a>

rel

a rel indicates the relationship between the linked document and the current document.

Example
<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.

Example
<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.

Example
<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.

Example
<a charset="UTF-8" href="https://www.bitdegree.org/">Bitdegree</a>

coords

coords set coordinates for a link.

Example
<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. 

Example
<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.

Example
<a rev="nofollow" href="https://www.bitdegree.org/courses">External webpage</a>

shape

shape specified the shape of a link.

Example
<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>

Browser support

Browser image
Chrome
All
Browser image
Edge
All
Browser image
Firefox
All
Browser image
IE
All
Browser image
Opera
All
Browser image
Safari
All

Mobile browser support

Browser image
Chrome
All
Browser image
Firefox
All
Browser image
Opera
All
Browser image
Safari
All