---
title: "HTML a Tag Tutorial"
url: https://weworkworldwide.com/tutorials/html-a-tag-tutorial/
description: "In this section we will see what HTML &lt;a&gt; tag is and how it works. HTML &lt;a&gt; Tag: How to HTML a Link? In a typical design of a website usually,"
date: 2026-05-24T09:00:03+00:00
source: https://weworkworldwide.com/llms.txt
---

# HTML a Tag Tutorial

In this section we will see what HTML <a> tag is and how it works.

## HTML <a> Tag: How to HTML a Link?

In a typical design of a website usually, there’re a couple of links that connects you to different sections of that website. For example, there might be a site that has a “Home” button where if you click, you’ll be headed towards the homepage of that website. Or there might be a “Contact Us” link and if you clicked it, the Contact Us page appears on your screen.

These connections and links are created via HTML <a> element.

HTML <a> Element stands for `anchor` and is a way of linking (AKA anchoring) different pages of a website or other websites together.

## HTML <a> Tag Syntax:

``` line-numbers
<a href="url"> Value </a>
```

## HTML <a> Tag Values

The value that we set in the body of the <a> element will be turned into a link where users can click and be forwarded to the destination (another page or website) that is specified for the link in the “href” attribute.

## What is href in HTML?

The href attribute is the one we use to set the URL as its value where we want the user to be headed when she clicks on the link.

The value of the href attribute can be either a *relative or absolute URL*.

## Example: anchor in HTML

``` line-numbers
<!DOCTYPE html>
<html>
<head>
<title> HTML is fun 🙂 </title>
</head>
<body >
<hr>
Five Tech Companies:
<a href="https://en.wikipedia.org/wiki/Facebook,_Inc."> Facebook</a>
<a href="https://en.wikipedia.org/wiki/Samsung_Electronics"> Samsung</a>
<a href="https://en.wikipedia.org/wiki/Apple_Inc."> Apple</a>
<a href="https://en.wikipedia.org/wiki/Alphabet_Inc."> Alphabet</a>
<a href="https://en.wikipedia.org/wiki/Microsoft"> Microsoft</a>
<hr>
</body>
</html>
```

## Example: HTML tag a href

``` line-numbers
<!DOCTYPE html>
<html>
<head>
<title> HTML is fun 🙂 </title>
</head>
<body >
<hr>
<h1>Five Tech Companies:</h1>
<ul>
<li><a href="https://en.wikipedia.org/wiki/Facebook,_Inc."> Facebook</a></li>
<li><a href="https://en.wikipedia.org/wiki/Samsung_Electronics"> Samsung</a></li>
<li><a href="https://en.wikipedia.org/wiki/Apple_Inc."> Apple</a></li>
<li><a href="https://en.wikipedia.org/wiki/Alphabet_Inc."> Alphabet</a></li>
<li><a href="https://en.wikipedia.org/wiki/Microsoft"> Microsoft</a></li>
</ul>
<hr>
</body>
</html>
HTML <a> Tag Notes:
```

-   When using HTML <a> element to link to another website, you  
    need to set the absolute URL as the value of the href attribute. But  
    when it comes to linking to a page of the same website, although you can  
    use the absolute URL of that page, it is preferable to use relative  
    URLs.

-   The href attribute is also capable of linking to Ids of the same  
    or another page as well. This is explained in *the href attribute  
    section.*

## Example: href HTML link and target attribute

``` line-numbers
<!DOCTYPE html>
<html>
<head>
<title> Learning HTML is fun 🙂 </title>
</head>
<body >
<a href="http://www.bing.com" target="_blank">Bing Search Engine</a>
</body>
</html>
```

In this particular example, we’ve used another attribute of the <a> element named `target`. This attribute is explained in *the <a> element target attribute section* but just to give you a hint of what it does:

It defines where the target page or website should be opened. For example one of the values of this attribute is “_blank” which means the document of the target URL needs to be open in a new tab or window of your browser. This means you’ll be directed to a new window without losing your previous page where the link is located.

## Linking to Email in HTML

Other than using HTML <a> element to link to other pages and websites, we can use this element to send emails!

For this to happen, we set the target email address (the one we want to send emails to) prefix it with the value “mailto:” as the value of the href attribute.

``` line-numbers
For example: <a href="mailto:email@example.com">
```

## Example: a href mailto

``` line-numbers
<!DOCTYPE html>
<html>
<head>
<title> Learning HTML is fun 🙂 </title>
</head>
<body >
<p style="width: 500px;">We're here to help and answer any question you might have. We look forward to hearing from you. Please contact us at <a href="mailto:email@example.com"> email@example.com</a> </p>
</body>
</html>
```

## HTML <a> Tag Attributes

Other than `href` and `target` attributes you saw in the previous examples, the HTML <a> element has other useful attributes that could be used with this element.

In the list below you can see the name of these attributes and a short description about each one of them.

[TABLE]
