HTML Basics: Hyperlink Explained – Your Complete Guide to What They Are and How They Work

Creating Links with the A Tag

A hyperlink is a link to another web page. This can be a subpage of your own website or a page on another website. Basically, any navigation is made up of hyperlinks. Link is short for hyperlink, and it means the same thing.

Links are usually highlighted in color and underlined by default.

A link is always made up of two parts, a URL and a link text, e.g. HTML Basics.
(<a href="https://www.website-advisor.de/en/html-basics.php">HTML Basics</a>)

Creating a link using <a href="…">

<a href="URL">link text</a>   [1]

URL – What Does it Mean?

In common language, we often talk about a link when we really mean a URL. URL stands for Uniform Resource Locator. It refers to the address that identifies a file on a server. The colloquial terms Internet address or Web address are more commonly used than URL.

How is a URL Built?

A URL consists of the following components:

1. Protocol, e.g. http://, https:// oder ftp://

2. Sub-Domain, e.g. www, www2 or blog

3. Domain name, e.g. www.website-advisor.de

4. Directory path, e.g. en

5. File name, e.g. html-basics.php

Subdomain and domain are separated by a dot '.'.

Summarized the URL is e.g.
https://www.www.website-advisor.de/en/html-basics.php

It is recommended to use speaking URLs because they help people understand what your site is about.

Inserting the URL into the HTML A tag^[1] results in something like this

<a href="https://www.website-advisor.de/en/html-basics.php">link text</a>   [2]

HTML tags can be nested. If you want to use an image for a link instead of anchor text, just replace the Anchor Text by an IMG Tag inside the HTML A tag^[2].

So the HTML tag for an image link is, for example:

<a href="https://www.website-advisor.de/en/html-basics.php"><img src="/en/images/image.png" alt="Description of the Image"></a>