How to use a href in HTML for adding links to your website

a href is used to include external and internal links on a website. The authorized values for the HTML attribute href are clearly defined. Examples of links include links to other websites and forwarding to email addresses or telephone numbers.

a href allows users to create external or internal links in an HTML document. When used correctly, the href attribute will integrate seamlessly into your website and appear in the form of a hyperlink. This allows visitors to click and visit another page within your site. href stands for “hyper reference” and specifies the desired link destination. href attributes offer your website numerous advantages. For example, they provide a better structure, facilitate navigation, and provide additional information. Links can also be beneficial for SEO.

Href’s syntax is always the same in HTML and looks like this:

Each sections fulfils an important function:

• The a introduces the link. The a indicates an anchor text. This HTML tag defines the start and end point of the hyperlink.
• The href attribute is used within the anchor text and sets the respective link’s jump target. In addition to an internal or external website, PDF documents or images can also be linked.
• The URL for the link is placed within the quotation marks. This is specified with the domain, e.g. “examplepage.com” for an external page or “examplepage.html” for an internal link.
• This is followed by the visible text, which is clickable.
• The anchor text is complete.

The values for href in HTML are clearly defined to ensure linking works properly. The authorized values for href are as follows:

• An absolute URL: The absolute URL is the classic example when using a href. It redirects directly to an external website. Example: href="https://www.ionos.com/digitalguidewww.examplesite.com"
• A relative URL: The relative URL redirects to a file within a website. Example: href="https://www.ionos.com/digitalguidedefault.htm"
• Link to an element: The direct link to an element is possible if it has a defined ID. This allows you to link selected sections of your internal website. Example: href="#section3"
• Other protocols: href is also suitable for other protocols, such as linking directly to an email address. This works via mailto:. Other protocols may include http://https://, ftp://, or file:.
• Scripts: Scripts, such as JavaScript, are also authorized values for a href. Example: href="javascript://www.ionos.com/digitalguidealert('Do you have any further questions"

There are several uses for a href which can be implemented on your website. We’ll show you some of the most common uses for href in HTML.

Use the following code to set an image as a link to a subpage with href:

Use mailto: to link an email address. It should look like this:

The visitor’s email program will open when they click the link and the address (smith@examplemail.com) will automatically be inserted as the recipient. Alternatively, they can also copy and paste the email address into the program or somewhere else.

You can also link a phone number with a href. This is useful if someone accesses your site using a smartphone and wants to contact you directly. The link looks like this:

It is important to add a plus sign and the international dialling code after the telephone reference tel:. The zero in the area code is not included.

You can also link to JavaScript using href. The corresponding code is:

While links are useful, be careful not to send your visitors directly to an external site from your website. With this in mind, it is useful for the link to open in a new tab or a new window. Users will then remain on your site and can look at any additional information at another time. The code looks like this: