Linking pages is one of the critical parts of HTML.
Reading here for this subject
- The anchor tag (with the href attribute) creates a clickable link.
<a href="url">Highlighted Text</a>
- The Highlighted Text is usually shown
underlined in blue
- Click to go there.
- Various forms of URLs used as links.
- Absolute: Go to another server: https://www.ibm.com/watson/services/natural-language-understanding/
- With the same directory: html1.html
- Relative to the current directory: ../syl.html
- Relative to the same server: /lookup.php
- Within the same document: #bottom
- Within a different document.: html1.html#headerdesc
- Types of URLs.
- Absolute: https://www.ibm.com/watson/services/natural-language-understanding/
- Start with a protocol and host name.
- Provide the complete location.
- Relative. Omit certain parts of an absolute URL.
- Starts with a slash: URL is a path on the same server:
- Start with something else: relative to the starting directory (folder).
- Just a file name: look for it in the same folder. name.html
- Partial path: start from the same folder.
- Page location: http://www.example.com/some/folder/from.html
- Link URL: head/down/here.html
- The .. component goes up one level by removeing a folder name.
- Page location: http://www.example.com/some/other/folder/from.html
- Link URL: ../../upfolder/fred.html
- .. is the antidirectory
- Internal links.
- A #id at the end of a URL specifies a location within
- The location is marked by the id element on any tag:
<anytag id="id" ...>
- If the URL starts with a #, it jumps to a label in the same
- In the earlier example, this internal link: #bottom
moves to a tag <p id="bottom">.
- In the original HTML,
the location is marked by an href-less a tag:
<a name="id"></a>. You may still see that. If you're
worried about older browsers, you may even want to throw one in along side
your actual target.
- The effect of linking depends the document type.
- Text or HTML documents are generally loaded in the same window.
- Documents associated with an application may start that application.
The window you clicked in remains unchnaged.
- Word processor documents start the word processor.
- Zip files may open an archiver.
- Computer source files may open a text editor or programming tool.
- Multimedia files may play in the browser, or open an external
application, depending on the configuration.
- If the browser has no idea how to interpret the file, it will usually
offer to save it.
- If linking non-HTML content, its a kindness to say so in the link text.
- Also, if the target is a large file, it is nice to say so for the
benefit of users on a slow or expensive connection.
- Good links.
- Should give a clear description. Don't put the destination in the
text, and then click here in the link.
- Should be as short as possible.
- Don't repeat the URL.
- Use different labels to different places.
- Use relative links whenever possible. Can be more efficient, and makes
the web site easier to re-arrange.
This is the bottom of the document. The markup is
<p id="bottom">...</p>. The link above is to #bottom,
so it moves here.