Pages - HTML - Hyperlinks

HTML - Hyperlinks

The world wide web is a huge international resource of countless websites and webpages. In order to navigate between pages we often click links that send us to another page, these are the most common type of Hyperlinks.

Hyperlinks can also be used to download files, open an email, opening an FTP client, navigate to a particular point on the same page or call for another sort of action.

We will show some examples of different Hyperlinks and how you can go about coding them, the code is shown at the top of all examples.

Email Hyperlink

<a href="mailto:you@example.com">Please email me</a>.
Please email me.

Email hyperlinks generally open up the local email client (i.e. Outlook, Thunderbird, Apple Mail etc.), typically these links won't work for people who use web browser based email clients, which is why it's normally advisable to make the email address visible like this:

Please email me at <a href="mailto:you@example.com">you@example.com</a>.
Please email me at you@example.com.

Page Hyperlink

As discussed earlier, the most common use of a hyperlink is to get directed to another page/website. For example:

I love listening to music on <a href="http://www.youtube.com">YouTube</a>.
I love listening to music on YouTube.

You can also make relative hyperlinks, which means the link is calculated from the current page. This reduces the amount of code required and works well for moving to another page within the same directory, like so:

Honey Graphics have lots of <a href="pages.php">useful information and guides</a>.
Honey Graphics have lots of useful information and guides.

Relative hyperlinks can also be used to link to things within folders:

<a href="images/welcome.jpg">Here is an image from our homepage</a>.
Here is an image from our homepage.

Or you can specify to look in a parent directory:

<a href="../index.php">Look at our homepage</a>.
Look at our homepage.

Contextual Hyperlink

Hyperlinks are normally shown in a different colour or underlined, making them stand out. Visitors will often skim read, by making the text of the link clear as to where it takes the visitor it often helps to make the navigation of the website easier. Try and avoid making hyperlinks that say 'Click Here', tell them where the link will take them, like 'Contact Us'.

Want to know more or have questions?

We try and make our website helpful to viewers and clients, if you have any tips or suggestions please contact us. If you like this article please Share on Facebook.

Adverts