Cacher is the code snippet organizer for pro developers

you can actually link almost anything with the "a" element.
ex: make a link with a piece of document that includes an image ("img" element) and text:

<a href="http://www.w3.org/">

  <img src="../images/w3c-icon.gif">

  The World Wide Web Consortium

</a>

A link can also be more specific and link to a particular fragment of another document. To create this type of links, you should carry out two tasks:

1.Prepare the destination document, adding an id attribute to the element you need to link to. It's a good practice to create links that point to the sections of a document, defined through sectioning elements likesection, article, h1, etc. Whatever identifier you use in this attribute, you'll need it in the second part of this process.
2.Create the link in the originating document (with a) appending to the URI of the destination document, a hash sign ("#") and the identifier used in the previous step.

ex: we set the id attribute there, so links would make reference to "this section of the document".
<section id="concept">

  <h2>Concept</h2>

  ... content, examples, etc. ...

</section>

Now comes the second part where we'll set up a link that points to that section. This is rather easy, and consists basically of creating a link to this same page, adding the hash sign ("#") and the value of the id attribute of the linked section, to the URI in the href attribute. Because we're linking from and to the same document, the URI is the empty string (""). Adding to this the hash sign ("#") and the id we get just "#concept".

Let's create that link in an example and see what the browser does for us when we click the link:

<a href="#concept">Back to section "Concept"</a>

there is a particular type of URI that's been specially designed to reach resources through Internet mail
The most basic format of an e-mail URI consists of the string "mailto:" followed by a comma-separated list of one or more e-mail addresses. The following example uses this strcture in a real link.

<a href="mailto:webmaster@htmlquick.com">e-mail me!</a>

The usual action that browsers carry out when you click this link is to open the default e-mail client and compose a new message with the data provided by the link. But when the system doesn't have a default e-mail client, activating this link has no consequences at all.

There's also the possibility of providing additional information to complete other fields in the e-mail composed, like Cc, Bcc, subject and body. To include one or more of these fields in the link you need to add, after the list of e-mail addresses, a question mark ("?") and a list of parameters separated by an ampersand ("&"). Now, each one of these parameters has a specific structure too, which consists of the name of the parameter (Cc, Bcc, subject, body) followed by an equal sign ("=") and its value.

ex: we're adding to the example above, a second address to the Cc field, a subject and a body:

<a href="mailto:webmaster@htmlquick.com?cc=archive@htmlquick.com&subject=From_the_web...&body=Fill_your_message_here...">e-mail me!</a>

we used underscores ("_") instead of spaces in the previous example. This is because it's a URI we're writing in, and URIs need some characters to be encoded (spaces, slashes, question marks, ampersands, etc). So, in an effort to keep things simple, we replaced spaces by underscores.

let's see how the previous example looks like with encoded spaces ("%20"):

<a href="mailto:webmaster@htmlquick.com?cc=archive@htmlquick.com&subject=From%20the%20web...&body=Fill%20your%20message%20here...">e-mail me!</a>

to provide relational information about the entire document, reason why it's only declared in the head.
The <link> element can be used in two different ways. This section will only cover one of these uses (with the "rel" attribute)
Links declared with the link element are usually hidden from the user. Yet, their information could be shown, for example, in a toolbar or a summary applet.

The many relationships this element can establish, depend mainly on the value of the "rel" attribute. In most usual cases it defines the structure of the website (next or previous document), provides alternative versions of the document (for printer, in another language, etc.) and points to external resources with style information for the document.

The follwoing example shows the header section of a document with the following relational information (in that order): 
an index; 
the previous and following documents in the sequence; 
copyright information about the document; 
an alternative version for printing purposes;
an alternative version in spanish; 
and a resource with style information to be applied in the document.

<head>

<link rel="index" href="index.html" />

<link rel="prev" href="doc1.html" />

<link rel="next" href="doc3.html" />

<link rel="license" href="copyright.html" />

<link rel="alternate" media="print" href="doc2-printer.html" />

<link rel="alternate" lang="es" href="es/doc2.html" />

<link type="text/css" href="basic.css" media="screen" />

</head>

https://www.htmlquick.com/tutorials/links-in-html/3.html