6.4 Linking to Email
As well as linking to webpages and websites, we can also link directly to an email addresss. Instead of specifying a file, a path name or a URL, the value used is: "mailto:" followed by an email address. When the link is clicked, the default email program will open with a new blank message addressed to the specified email address. For example:
<a href="mailto:someone@freewebtutorial.co.uk">Send an email to freewebtutorial.co.uk</a>
This would look like this in a browser (although this is a dud link):
The only problem with this is that it leaves the specified email address open to spammers. For example, if you had a "contact us" link on your website then the unscrupulous types out there can obviously view your source code, either manually or using searchbots, obtain your email address and then send you spam emails. A more secure way is to set up a contact page with a HTML form that is then handled by a form processor, but this is for later.
Navigation Menus
Links are used extensively in site navigation menus, which can be horizontal or vertical. Making a navigation menu is simply a matter of entering links into a list. For example:
<ul> <li><a href="page1.html" title="page 1">Page 1</a></li> <li><a href="page2.html" title="page 2">Page 2</a></li> <li><a href="page3.html" title="page 3">Page 3</a></li> <li><a href="page4.html" title="page 4">Page 4</a></li> </ul>
This is the basic format for most navigation menus. Styling can then be added using CSS to decide whether the menu is to be vertical or horizontal, to remove list bullets and to add nice colours, background colours and other special effects. Refrain from using graphics for navigation menus as these do not help with search engine optimisation (see the section on SEO).