Need to redirect a user to another page, an external website, or a PDF file? Or perhaps you're just starting to learn coding and wondering how to add a link in HTML?
Creating links in code is one of the absolute foundations of building websites.
In this step-by-step guide, we explain what a tag is in HTML, how the href attribute works, and how to correctly create a hyperlink in HTML, avoiding mistakes that can harm your SEO and usability.
How to Add a Link in HTML? HTML Link Syntax in Practice
The basis of every link in HTML is the <a> tag (from the English "anchor"). It is responsible for creating hyperlinks in a document.
(The rest of the article can be found below the form)
The syntax of an HTML link is simple and is based on the following structure:
<a href="adres-strony">Tekst linku</a>
The most important element here is the href attribute, which specifies the address to which the link should lead. This can be a full URL (e.g., https://adresstrony.pl/) or a relative path within the website (e.g., /blog).
The text between the opening and closing tags is a text link (anchor) – visible and clickable to the user.
Creating links in code – internal links and external links
Creating links in code can involve various types of links. The most common are internal links and external links.
Internal links lead to other pages within the same domain and aid in navigation and SEO. For example:
<a href="/kontakt">Skontaktuj się z nami</a>
External links, on the other hand, direct the user to another website:
<a href="https://przykładowyadres.pl">Sprawdź źródło</a>
External links often use additional attributes, such as target=”_blank” to open the page in a new tab. However, for security reasons, it's worth also adding rel=”noopener noreferrer”.
<a href="https://przykładowyadres.pl" target="_blank" rel="noopener noreferrer">Sprawdź źródło</a>
Hyperlink in HTML as text link and graphic link (link in image)
A hyperlink in HTML doesn't have to be text only. A text link (anchor) is the most common, but you can also create a graphic link , meaning a link within an image. Simply place the <img> tag inside an <a> tag :
<a href="https://adresstrony.pl"><img src="baner.jpg" alt="Nasza oferta"></a>
In this case, clicking the image will take the user to the specified address. Using the alt attribute , which describes the image's content, is crucial – this is important for both accessibility and SEO.
Regardless of the link's form, it's important to ensure a clear and natural anchor text. Instead of a generic "click here," it's better to use descriptive phrases that inform users and Google's crawlers where the link leads.
Dofollow and nofollow links – how do they affect SEO?
Dofollow and nofollow links also play a role in SEO . By default, these links don't have the nofollow attribute, so they can transmit ranking signals (commonly referred to in the industry as dofollow).
A dofollow link can transmit ranking signals to the target page. If you want to limit this effect, you can add the rel=”nofollow” attribute . In practice, it looks like this:
<a href="https://przykładowyadres.pl" rel="nofollow">Link sponsorowany</a>
The nofollow attribute tells search engines not to treat the link as a recommendation. Google currently treats it as a guideline, not a strict directive.
For advertising and affiliate links the attribute rel=”sponsored” is also used , and for user-generated content (e.g. comments) – rel=”ugc”.
The most common mistakes when creating links in HTML
Although the syntax for an HTML link is simple, beginners often make mistakes. Common ones include missing the "https://" protocol in external links, typos in the href attribute, or linking to a nonexistent page (a 404 error).
Another problem is the overuse of general anchors and the mass opening of all links in new tabs without justification.
If you already know how to add a link in HTML, remember that good linking isn't just a technical matter. It's also a key element of UX and SEO strategy . A properly constructed hyperlink in HTML facilitates navigation, supports indexing, and helps users find the information they need faster.
FAQs about HTML links
If you don't want the user to leave your site after clicking on the link (which is recommended when linking to external websites), you should add the target=”_blank” attribute to the tag.
Anchor text is the visible, clickable content of a link on a page (usually highlighted in blue or underlined). Both users and Google crawlers should clearly understand what's on the other side of the click. Instead of writing unnatural phrases like "click here" or "see," it's much better (and SEO-safe) to use a description like "see full price list" or "read HTML tutorial."
Yes, almost any element on a page can be a link, including an image. To create a clickable graphic, simply place an image tag (![]()
) between the opening and closing link tags (...).
- Absolute URLs: These contain the full path to the page, including the protocol (e.g. [https://verseo.pl/kontakt/](https://verseo.pl/kontakt/)). They are required when linking to a completely different (external) domain.
- Relative URLs: These contain only a portion of the path and refer to the current location on the server (e.g., /contact/). They are typically used for internal linking (between pages on the same site), making code management easier and improving page performance.
The rel="nofollow" attribute is a special directive for search engine robots (e.g., Google). It tells the algorithms: "My site links to this address, but I don't want to transfer my SEO trust and authority (link juice) to it." This attribute is used, among other things, to mark sponsored posts, affiliate articles, and in comment sections to prevent spam.
Summary
The above article covers the following topics:
- The guide explains how to correctly create links in HTML using the href tag and attribute.
- Internal links lead to subpages on the same domain, while external links lead to other websites and require additional attributes for security and user convenience.
- A hyperlink in HTML can be text or an image, and it is crucial to use descriptive content and alt attributes to improve SEO and accessibility.
- Attributes like nofollow, sponsored, and ugc allow you to control how ranking signals are passed on to target pages, which is crucial for your SEO strategy and the proper marking of external links.
- Avoiding technical errors, such as typos in addresses or the lack of HTTPS protocol, combined with a well-thought-out UX and SEO strategy, is essential to creating properly functioning and effective linking.
