1. For instance, http://sandbox.mc.edu/~bennet/cs302/outl/intro.html
2. The first part, http, is the protocol. It tells the browser which rules to use to talk to the server. Usually http or https, but there are some others.
3. The second part, sandbox.mc.edu is the name of the server where the page is. Names usually start with www, but don't have to.
4. The third part, /~bennet/cs302/outl/intro.html in this case, is called the path. It's the location of the page on the server. It's called a path because it tells what folders you have to go through to get there from the top of the server.

1. The Highlighted Text is usually shown underlined in blue by default. (But can by changed using CSS.)
2. Click to go there.

1. The destination of a link is a URL, but they may be abbreviated in various ways.
2. Absolute: Go to another server: https://www.ibm.com/watson/services/natural-language-understanding/
3. With the same directory: html1.html
4. Relative to the current directory: ../syl.html
5. Relative to the same server: /lookup.php
6. Within the same document: #bottom
7. Within a different document.: html1.html#headerdesc

1. Absolute: https://www.ibm.com/watson/services/natural-language-understanding/
   1. Start with a protocol and host name.
   2. Provide the complete location.
2. Relative. Omit certain parts of an absolute URL.
   1. Starts with a slash: URL is a path on the same server: /files/goodfiles/greatfiles/wonderful.html
   2. Start with something else: relative to the starting directory (folder).
      1. Just a file name: look for it in the same folder. name.html
      2. Partial path: start from the same folder.
         1. Page location: http://www.example.com/some/folder/from.html
         2. Link URL: head/down/here.html
         3. Produces http://www.example.com/some/folder/from.htmlhead/down/here.html
   3. The .. component goes up one level by removeing a folder name.
      1. Page location: http://www.example.com/some/other/folder/from.html
      2. Link URL: ../../upfolder/fred.html
      3. Result: http://www.example.com/some/other/folder/from.html../../upfolder/fred.html
      4. .. is the antidirectory
3. So, if you are looking at a page http://fromsite.xyz/some/location/there, and you must follow a link to dest, figure out the new URL like this:
   1. If dest starts with (or is entirely) http://differentsite.abc, then dest is where you go.
   2. If dest starts with '/', then go to http://fromsite.xyz/dest
   3. Otherwise,
      1. Start with http://fromsite/some/location/dest
      2. Remove any appearance of component/.. until there are no more.
      3. If that leaves any .. parts at the after the host name, just discard them.
4. Internal links.
   1. A #id at the end of a URL specifies a location within a document.
   2. The location is marked by the id element on any tag:
      <anytag id="id" ...>
   3. If the URL starts with a #, it jumps to a label in the same document.
   4. In the earlier example, this internal link: #bottom moves to a tag <p id="bottom">.
   5. 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.
5. The effect of linking depends the document type.
   1. Text or HTML documents are generally loaded in the same window.
   2. Documents associated with an application may start that application. The window you clicked in remains unchnaged.
      1. Word processor documents start the word processor.
      2. Zip files may open an archiver.
      3. Computer source files may open a text editor or programming tool.
   3. Multimedia files may play in the browser, or open an external application, depending on the configuration.
   4. If the browser has no idea how to interpret the file, it will usually offer to save it.
   5. If linking non-HTML content, its a kindness to say so in the link text.
   6. 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.
6. Good links.
   1. Should give a clear description. Don't put the destination in the text, and then click here in the link.
   2. Should be as short as possible.
   3. Don't repeat the URL.
   4. Use different labels to different places.
   5. Use relative links whenever possible. Can be more efficient, and makes the web site easier to re-arrange.

Relative Links

This is the bottom of the document. The markup is <p id="bottom">...</p>. The link above is to #bottom, so it moves here.