HTML documents came out of the desire to share information from one place to the next. But an early determination was that there was a need to interconnect related documents. That way, instead of having to incorporate all the information from multiple sources, the author could reference another document and it would be easy to find.
As HTML became more mainstream, the ability to link took on new opportunities to make it easier to work within a web page.
Most of these will use the anchor tag (<a>), however, we’ll see how to use some other options as well.
The General Form
A link within a web page has a basic general form. It uses the anchor tag, identified by <a>
, and at least one attribute.
Using the anchor tag as a link, the href, short for hyperlink reference, attribute needs to be used. This specifies what file or location you want to link to. The value for the href attribute will change based upon where you want the user to be taken.
Additionally, there is a closing tag for an anchor tag. Between the opening and closing tags is what is known as the link text. The link text is what is displayed on the screen to the user. It doesn’t have to be text, as an image can also be used, but many links are text based, and hence the term stuck.
There are no specific rules for what needs to be in the linked text, however, most people agree that it should provide some context for the user. “Click here” seems meaningful, but doesn’t tell the user what they get if they do. This is a constant argument among web developers, with little movement toward a final recommended suggestion.
The general form for a link would look like:
<a href="linked-file.htm">Click here to link</a>
A title attribute can be used on links. If a user hovers over the link, a small popup window tells the user what is in the title tag, and hopefully a little more about what the link will do for them.
<a href="linked-file.htm" title="More information web HTML5">Click here to go to a new page</a>
The rel attribute is used to define the links relationship to the current document. This is not seen by the user, and is more designed for web spiders who crawl the web. Their values are changing based upon the desires of companies like Google, however most commonly you’ll see author
, external
, license
, next
, nofollow
, and prev
.
Linking Pages Together was originally found on Access 2 Learn