The importance of links

Hyperlinks or simply links are one of the main motivations of much of what today we know as web. The web itself is actually formed by endless links between documents on different computers and computer resources. The use of HTML links is quite simple and uses a single tag, which has a very simple name: <a> (anchor).

Links can be internal – when they reference the document content itself – or external – when referencing resources from the same site or resources of other sites. An internal link presupposes the existence of a mark (anchor) to the location where the user should be submitted at the time they click it.

Let’s imagine a page where we provide a recipe. Before detailing it, we wish to include an index, indicating, for example, sections of the page as ingredients, method of preparation, yield and preparation time. Thus, the user can access, directly, the preparation time without necessarily having to scroll the whole page.

From this scenario, we need to understand two attributes of the <a> tag. The first one (the name attribute) is used to name an anchor, or mark the location to which the link will refer the user. A <a> tag with the name attribute has no visual effect. In the place where we want to include the link, ie, at the index of the recipe, we will use the same <a> tag, but with the href attribute, indicating the anchor name to which we must submit, preceded by the # (pound or pound) sign, which indicates that the link is internal.

Still using the example given earlier, at the beginning of the document, the <a> tag is used with the href attribute followed by the # sign and a name (ex .: ing, time, rend, preparation). These names are present following the document when the <a> tag is used with the name attribute. Note also that the <a> tag marks every word that will be transformed into a link when the HTML document is interpreted by the browser. A link is normally displayed in another color (usually blue) and underlined. When the mouse cursor passes over it, the figure is replaced by a “helping hand” with the index finger raised. Suppose the user clicks on the link made with the word ingredients (<a href=”#ing”> ingredients </a>). In this case, the page will be placed in the exact location where the tag <a name=ing> is declared.

There are two other properties that deserve to be presented. The first one is the property title: used to assign a kind of description of the link. The description of a link is presented in the form of a tip (hint) when we move the mouse over it.

The other property worth mentioning is the target property: it determines the specific window – or frame – where the link will open. Through the target property, it is possible that the current page to interact with other windows. There are some reserved values for this property, as “_blank”, indicating that the link should be displayed in a new window, and “_self” for the link to be displayed in the same window.