Foundation HTML5 with CSS3

Linking the Web

all surfing the Web (and we imagine that you have if you’re reading this book), you’ve no doubt seen this in

action.

Figure 6-2. A hyperlink as rendered by a browser

Required Attributes

There are no required attributes for the anchor element.

Optional Attributes

In addition to the global attributes, the anchor element supports the following attributes.

 href: a URL that defines the destination of the hyperlink. This can be a relative URL, an absolute

URL, or a fragment identifier.

 rel: a space-separated list of tokens that describe the destination document's relationship to the

current document.

 type: the MIME type of the hyperlink's destination.

 target: a name or keyword that is the browsing context that a browser should use when

following the hyperlink. Typical values are "_blank", "_self", "_parent", or "_top".

 media: defines the media for which the linked document was designed.

 hreflang: the language of the linked document.

URLs

If you recall the “Introducing the URL” section in Chapter 1, you’ll remember that properly formed URLs

generally fall into two categories: absolute URLs and relative URLs.

Absolute URLs contain the complete path (including the protocol; http://, https://, etc.) to a web

page. You’ll want to use absolute URLs when linking to a resource that exists on a domain other than your

own. For instance, Listing 6-3 demonstrates how you would link to a page on the Power Outfitters website

from your own.

Listing 6-3. An anchor element with an absolute URL

<a href="http://example.com/about.html">About Power Outfitters</a>

Relative URLs, as the name implies, are URLs that reference resources by their location relative to the

location of the current document. Assume for a moment that all of the pages of your site are located in the

root of your site, as outlined in Listing 6-4.