6.0 Links

The real power and beauty of the Internet, and the whole reason it came about in the first place, is the ability to jump from any website in the World to any other website via clicking on simple text (or image) links called hyperlinks. To make these links to other parts of a web page, other web pages or even other websites, we need to introduce another tag: <a>. This is called the anchor tag.

The anchor tag is used in conjunction with the following attribute: href. This attribute is short for hypertext reference, and it specifies where the link is to. This is a fine example of using tags and attributes together for more than just controlling the appearance of web page elements.

To make a simple link from one webpage to another page, imaginatively called page2.html here, the format is:

<a href="page2.html">Page 2</a>

The content placed between the opening and closing anchor tags is the actual hyperlink that will be displayed on screen, like so:

There is another attribute that should be used in links, namely the title attribute. This is used to give a short description of the link when a visitor hovers over it. For example:

<a href="http://www.freewebtutorial.co.uk/" title="LEARN HTML!">Free
Web Tutorial</a>

Would look like this in a browser (try hovering over link):

The anchor tag is a very powerful tag. Without it, the Internet would simply not work.

File Naming

We already know that the first page of any website should be called index followed by the extension, which is usually .html (although other web extensions are available for other web languages e.g. index.php etc). As for extra pages, these can be called whatever you like. It is often wise to call a page after whatever topic the page covers. For example, if it were a page about healthy eating, the page could be called healthy-eating.html. Not only does this make the page easier to find should you wish to modify what you wrote about healthy eating, it is also good for SEO purposes. And although they are allowed these days, avoid using spaces in file names at all costs. Much like reserved characters in HTML, there are reserved characters in Unicode that are unsafe to use in file naming, and the space character is one of them. If you wished to use a space in a file name you would need to use %20 like this:

healthy%20eating.html

Which of course looks awful. And if you do use the space character and not the above code, the %20 will still appear in the browser address bar when the page loads. This is bad for SEO too, because when your site eventually builds inlinks from other sites, you will have links to eating healthy.html and links to eating%20healthy.html, instead of just to the first, which will dilute the importance of your page to the search engines.

The solution to this is very simple. Instead of spaces, use either dashes (-) or underscores (_) like this:

healthy-eating.html
healthy_eating.html

Either character will do and any is preferable to using a space. Personally I prefer to use the dash symbol, and there is some arguable evidence that some search engines prefer it over the underscore.