Learning Web Design, 6th Edition

Chapter 6. Adding Links

6

Adding Links

In this Chapter

Linking to external pages

Linking to documents on your own server

Linking to a specific point in a page

Targeting new windows

Mail and telephone links

If you’re creating a page for the web, chances are you’ll want to link to other web pages and resources, whether on your own site or someone else’s. Linking, after all, is what the web is all about. In this chapter, we’ll look at the markup that makes links work—links to other sites, to your own site, and within a page. There is one element that makes linking possible: the anchor (a).

<a>...</a>

Anchor element (hypertext link)

To make a selection of text a link, wrap it in opening and closing <a> tags and use the href attribute to provide the URL of the target page. The content of the anchor element becomes the hypertext link. Here is an example that creates a link to the O’Reilly Media site:

<a href="https://www.oreilly.com">Go to the O'Reilly Media site</a>

To make an image a link, wrap anchor tags around the img element:

<a href="https://www.oreilly.com"><img src="tarsierlogo.gif" alt="O'Reilly Media site"></a>

AT A GLANCE

Anchor Structure

The simplified structure of the anchor element is as follows:

<a href="url">linked content</a>

By the way, you can put any HTML content element in an anchor to make it a link, not just images. As of HTML5, it is valid to put multiple elements in a single a element.

Nearly all graphical browsers display linked text as blue ...