Absolute links are links to a full URL, which can be anywhere on the internet. They require the
https://) at the beginning. Clicking on one of these links queries the DNS system to find the server where the content lives.
Relative links point to local content in your project directory. You only need to specify the file name and, if present, the folder structure.
Anchor links scroll the current page to the location of specific content. The
href attribute points to an
id present somewhere on the page (indicated with a hashtag). No scrolling will happen if the browser window is too tall to allow it.
Email links, also known as mailto links open a new email draft, addressed to the specified recipient, in the default email app. The user must have a properly configured email app for the link to work. The syntax of the
href attribute value is
mailto: followed by the recipient email address with no spaces anywhere in the href.
The Title Attribute
title attribute contains alternate text describing the link. This will be read by screen-readers, and as such should be employed when a link lacks descriptive text inside it. It also displays a tooltip popup on mouse hover, so, again, it is useful when the link contains no text, such as a linked image.
The Target Attribute
target forces a link to open in a new tab. Really the only useful value for
_blank (including the underscore), which specified that the link should open in a new tab.
The following video demo is fully interactive. You can pause it at any time to directly edit the code, and resume playback to pickup where you left off.