In this post we will teach you everything you need to know about links, absolute and relative HTML paths: definition, structure and practical examples. ENTERS!
WE START:
Welcome to another post.
Thanks to the links is that you can go from web page to web page investigating and indicating about any subject, and they exist practically from the beginnings of Internet.
Commonly also they are called hyperlinks, both have the same meaning and denote the same function. The structure of a link is the next:
- Text: it is also known as «anchor text» and is the text which will contain the link or hyperlink to another web page destination.
- Hyperlink: is destiny which is placed in the anchor text. Here you must specify the web page destination.
Next, we will show you how you can put into practice the insertion of links (with their respective relative and absolute paths) in HTML.
Article index
Links in HTML
The Default HTML links look blue, that if you hover the mouse over it, it will turn into a hand pointing to the anchor text. The length of the anchor text is delimited by the number of words that the link covers.
If you want to create a link, you must follow the following structure:
<a href="https://blog.mastercoria.com/en/">This is a link that leads to The Master Coria Blog</a>
The HTML tag «<a>»Is the one that governs the creation of links by default, and is the standard that Google officially uses when it comes to SEO issues for your website.
Attribute "Href" is the one that designates the link recipient where the user will be taken, and the anchor text is basically the text that is between the tags, that is, the value of the tag «<a>».
Mention that, in order to close this label, its counter label must be used, which is «</a>», Otherwise the anchor text will take the length of all characters written after the link is opened.
Absolute paths
They are all those links that point to a web address or URL, is also known daily as "link". This link is the most common on the internet, and the one that we recommend ALWAYS use, since among good SEO practices, it is recommended to use it.
These absolute path links in HTML can be both external (links from your own website), or external links (links to other websites).
Examples of absolute paths in HTML
Below we will give you some clear examples which will explain to 100% the use of the absolute paths within your HTML document. Pay attention to each type of example as it describes different types of absolute paths well.
<a href="https://blog.mastercoria.com/en/">Absolute path to the main page of El Blog de Master Coria.</a>
<a href="https://blog.mastercoria.com/en/html/">Absolute path to main site, including a request to a certain section.</a>
<a href="https://www.youtube.com/watch?v=pUGi1W4Pots">Absolute path to YouTube, including a request for a certain video.</a>
As you can see, all the links come within the "href" attribute of the HTML tag "<a>», And can be different types of web addresses. You just have to put that link directly between the quotes of that attribute.
Relative paths
They are local HTML links that search for some content within the computer or server. We recommend using relative paths as little as possible in your HTML document as they could cause future confusion due to their structure.
This structure works in the same way as an absolute path, but relative paths have a different way of working or employing in the HTML document.
First, let's look at a concrete example of a relative HTML path so that we can understand what this question is about:
<a href="C:\\Usuarios\MasterCoria\Escritorio\leon.png">Relative path (internal or local address of the PC or server) to a specific image.</a>
Generally, relative paths are used under programming languages that run behind the server, because exposing this type of internal addresses of a server can carry risks. However, there are other types of relative paths within HTML that can be used:
Examples of relative paths in HTML
<a href="https://blog.mastercoria.com/en/contacto/">Relative path that leads to the section / contact of the site in question.</a>
These relative path HTML links direct to the contact section of the website where this hyperlink is placed. If the site is Facebook, then it would go to "facebook.com/contact".
Another example is the use of these routes to go to certain other sections, using point navigation:
<a href="../index.html">Go to the main page.</a>
Point navigation indicates that it will go back a directory, and look for the index HTML file for that site. If, for example, the user is found in "sections / example.html", the navigation indicates that he should go to "/index.html", leaving the "sections" directory.
It can be worked in more directory levels, as explained below:
<a href="../../../index.html">Exit 3 directories, go to the HTML index file.</a>
We hope that in this informative article you have learned quite a bit about links (both relative as absolute paths) in HTML. These links may be of interest to you:
Did you understand the issues addressed? Comment your doubts in the comments!
See you in another post.