How hyperlinks work in HTML

A link from one domain to another is said to be outbound from its source anchor and inbound to its target.

The most common destination anchor is a URL used in the World Wide Web. This can refer to a document, e.g. a webpage, or other resource, or to a position in a webpage. The latter is achieved by means of an HTML element with a "name" or "id" attribute at that position of the HTML document. The URL of the position is the URL of the webpage with a fragment identifier – "#id attribute" – appended.

When linking to PDF documents from an HTML page the "id attribute" can be replaced with syntax that references a page number or another element of the PDF, for example, "#page=386".

Link behavior in web browsersedit

A web browser usually displays a hyperlink in some distinguishing way, e.g. in a different color, font or style, or with certain symbols following to visualize link target or document types. This is also called link decoration. The behavior and style of links can be specified using the Cascading Style Sheets (CSS) language.

In a graphical user interface, the appearance of a mouse cursor may change into a hand motif to indicate a link. In most graphical web browsers, links are displayed in underlined blue text when they have not been visited, but underlined purple text when they have. When the user activates the link (e.g., by clicking on it with the mouse) the browser displays the link's target. If the target is not an HTML file, depending on the file type and on the browser and its plugins, another program may be activated to open the file.

The HTML code contains some or all of the five main characteristics of a link:

• link destination ("href" pointing to a URL)
• link label
• link title
• link target
• link class or link id

It uses the HTML element "a" with the attribute "href" (HREF is an abbreviation for "Hypertext REFerence") and optionally also the attributes "title", "target", and "class" or "id":

<a href="URL" title="link title" target="link target" class="link class">link label</a>

To embed a link into a web page, blogpost, or comment, it may take this form:

<a href="https://example.com/">Example</a>

In a typical web browser, this would display as the underlined word "Example" in blue, which when clicked would take the user to the example.com website. This contributes to a clean, easy to read text or document.

By default, browsers will usually display hyperlinks as such:

• An unvisited link is usually blue and underlined
• A visited link is usually purple and underlined
• An active link is usually red and underlined

When the cursor hovers over a link, depending on the browser and graphical user interface, some informative text about the link can be shown, popping up, not in a regular window, but in a special hover box, which disappears when the cursor is moved away (sometimes it disappears anyway after a few seconds, and reappears when the cursor is moved away and back). Mozilla Firefox, IE, Opera, and many other web browsers all show the URL. In addition, the URL is commonly shown in the status bar.

Normally, a link opens in the current frame or window, but sites that use frames and multiple windows for navigation can add a special "target" attribute to specify where the link loads. If no window exists with that name, a new window is created with the ID, which can be used to refer to the window later in the browsing session.

Creation of new windows is probably the most common use of the "target" attribute. To prevent accidental reuse of a window, the special window names "_blank" and "_new" are usually available, and always cause a new window to be created. It is especially common to see this type of link when one large website links to an external page. The intention in that case is to ensure that the person browsing is aware that there is no endorsement of the site being linked to by the site that was linked from. However, the attribute is sometimes overused and can sometimes cause many windows to be created even while browsing a single site.

Another special page name is "_top", which causes any frames in the current window to be cleared away so that browsing can continue in the full window.