Foundation HTML5 with CSS3

Linking the Web

The current recommendation is to use the rel attribute with a value opposite of what would otherwise

have been used with the rev attribute. If that sounds confusing, don't worry; it is. That confusion is the

primary reason the rev attribute was removed from the HTML specification.

The type attribute

Often used in concert with the rel attribute, the type attribute describes the MIME type of the destination

of an anchor's hyperlink. The value of the type attribute must match a valid MIME type. Listing 6-12

illustrates how to use the type attribute, along with the rel attribute, to include a link to an RSS feed.

Listing 6-12. A sample anchor element with a type attribute

<a href="latest-products.rss" rel="alternate" type="application/rss+xml">

Latest Products RSS Feed</a>

As you can imagine, including the type attribute on all of your anchors would be a tedious task.

Thankfully, such a task is entirely unnecessary. Browsers are smart enough to appropriately handle MIME

types.

Including the type attribute in your markup is entirely optional; no current browsers require you to specify

the MIME type of a linked resource. It is, however, a potentially useful inclusion and is one way to future-

proof your markup.

Inline vs. Block-level Links

Links are one of a handful of HTML elements that have what's known as a "transparent content model."

This means that, depending on context, the element can contain phrasing content or flow content. If the

anchor is a child of any element that can only contain phrasing content (such as a span), then the anchor

too can only contain phrasing content. This is the traditional, pre-HTML5 interpretation of the anchor

element (described in previous versions of HTML as being "inline").

Listing 6-13. An anchor with phrasing content

<a href="index.html">

<em>Go</em> back to our <strong>homepage</strong>!

</a>

On the other hand, if the anchor is a child of any element that can contain flow content (such as a div), it

too can contain flow content. In this context, the anchor is what's commonly referred to as a "block-level

link."

Listing 6-14. An anchor with flow content

<a href="utility-belts.html">

<h3>Utility belts</h3>

<p>For all of your utility belting needs!</p>

</a>

The anchor element's transparent content model is a great example of a guiding principle of HTML5: pave

the cow paths. For years, web page authors have wrapped anchors around block-level content and