Hipervínculos (Hyperlinks)
The hyperlink is one of the fundamental HTML elements. A hyperlink (or “link” for short) contains an URL attribute so that links can help users navigate through a website. Without links, visitors do not know how to go to other web pages since they do not know their addresses.
To create a link, we use the <a> element which stands for “anchor.” The content between the opening and closing tags is the text displayed on the webpage.
2.3.1 External Anchors
The external anchors will navigate users to another webpage. This page can belong to the same website, or it can be to another website. The URL that this link points to is set using the “href” attribute as below.
Without the href attribute, an anchor element is not a link.
/index.html
<!DOCTYPE html>
<html>
<head>
<title>My Website</title>
</head>
<body>
<h1>Home Page</h1>
<a href="/contact.html">Contact Page</a>
<a href="/user/login.html">Login Page</a>
</body>
</html>/contact.html
<!DOCTYPE html>
<html>
<head>
<title>Contact Page</title>
</head>
<body>
<h1>This is Contact Page</h1>
<a href="/">Home Page</a>
</body>
</html>/user/login.html
<!DOCTYPE html>
<html>
<head>
<title>Login Page</title>
</head>
<body>
<h1>This is Login Page</h1>
<a href="/">Home Page</a>
</body>
</html>Now, users can navigate between the “Home” page, the “Contact” page, and the “Login” page using those links. Since index.html is the main page, we can write “/” instead of “/index.html.”
To open an URL in a new tab, we can specify the “target” attribute as “_blank.”
/index.html
<!DOCTYPE html>
<html>
<head>
<title>My Website</title>
</head>
<body>
<h1>Home Page</h1>
<a href="/contact.html" target="_blank">Contact Page</a>
<a href="/user/login.html">Login Page</a>
</body>
</html>Moreover, we can set the “href” attribute