ALL ABOUT LINKS - HTML5 - page 133

As you can see when you place that code in a Web page, the author value is advisory and the
cite element changes the appearance of the text. In some respects, both are advisory in that
each calls attention to the content — one in the code, and the other in the screen display.

Hierarchical and sequential link types
You can organize your links using both hierarchical and sequential link types. h e hierarchi-
cal rel values include index and up . h e up value refers to a level up in the hierarchy, and
index refers to the very top. For example, the following code references a directory that is
the top of the hierarchy, three levels up from the calling page.

< a href = ”/” rel = ”index up up up” > Home </ a >

h e clearest path in the example is made by referencing both the index and the number of
up levels.

h e sequential link types include first , last , next , and prev with each keyword relative
to a page within a sequence. For example, the following code goes to the next page relative to
a page in the sequence:

< a href = ”page4.html” rel = ”next” > Page 4 </ a >

h e implementation of these link types is dif erent for dif erent browsers, and they're better
used with the link element to map out a site's organization relative to a given page than to
direct a page using the a element.

137

PAGE ANCHORS AND IDS
In addition to linking directly to a page, you can link to a specii c location on a page. One way
to link directly to a location on a page is to assign an anchor to a tag on the page using the
name attribute. For example, the following code will jump to the position on the current page
where the “developer” name is found:

< a href = ”#developer” > Developers </ a >

To set up the target using an anchor, just assign a tag the name of the anchor like the following:

< div name = ”developer” >

In testing the anchor technique on HTML5 browsers, it failed to work on several. h e HTML5
browsers seemed to have adopted using CSS3 to create IDs and use them exclusively. h e
following example ( AnchorID.html in this chapter's folder at www.wiley.com/go/
smashinghtml5 ) shows how to use IDs as anchors:

<! DOCTYPE HTML >
< html >
< style type = ”text/css” >
/*D4CBA0,BD4A14,804130,4F3C33,6D7F59*/