Webpage Workshop: Home » XHTML » Linking to other pages

Linking to other pages

Linking to other pages is what turns a collection of webpages into a website. Without links a website is totally useless, and the Internet would not be what it is today!

There are two basic types of links; internal and external, and these link to pages on your own site or to other websites on the Internet. The basic syntax of the anchor element is shown below:

<a href="URL">link text</a>

In the above example, the URL represents the address of the webpage that you wish to link to, and the "link text" is the text that appears on the page as a link. You can also use an image as a link, but more on images in later tutorials.

Internal links point to a page on the same website; that is a page with the same domain name. They can be specified in a few different ways.

On a page located at http://www.example.com/dir/page.html, the following URL styles can be used:

<a href="page2.html"> will point to the page located at http://www.example.com/dir/page2.html.

<a href="/index.html"> will point to the page located at http://www.example.com/index.html. The slash at the start of the URL means "go to the root directory".

<a href="../index.html"> will also point to the same page. The "../" bit means "go back a directory".

Finally, <a href="dir2/index.html"> will point to http://www.example.com/dir/dir2/index.html.

External links are used to link to pages that are not in the same website. They must all begin with http://. For example:

<a href="http://www.example.com">Visit Example.com</a>

In the above example, the link is used to point at the website located at http://www.example.com.

In the next tutorial, we will discuss the use of links to point to a specific location on an webpage.

<< Previous page | Next page >>