PART 7.1 - Links and URLs both Absolute and Relative

Layout for the 1st hole

Layout for the 1st hole

Layout for the 1st hole

Layout for the 1st hole

Layout for the 1st hole

Layout for the 1st hole

Layout for the 1st hole

Layout for the 1st hole

Layout for the 1st hole

Layout for the 1st hole



We are located on the Museum Web Site in the folder "docentclass"

  • A link is the connection made between documents on the Internet.

    • A LINK Contains

    • The URL (Uniform Resource Locator) i.e. the PATH NAME to the document that you want to link to.
    • Some descriptive text so that the viewer can decide whether the referred to document is of interest
      • In these notes represents a block of text or a file that we want to link TO
    • Yes there is syntax to do all of these things

We will discuss the following today:

  1. Absolute URLs
  2. Relative URL's for named blocks of text in the same file
  3. Relative URL's for files in one folder
  4. Relative URL's between folders on a web site

    absoluteABSOLUTE URLs

  • Absolute URLs

    • They are known as a full URLs
    • They define the location of a file in absolute terms using the full path name and the correct grammar
    • So what are the steps along the path?

      Decide what protocol to use

      • If you want to have the server recognize HTML then the protocol that you want the server to use is:
        • http:// (Hypertext Transfer Protocol)
      • If you want to upload or downoad a file from some web site the protocol to use is:
        • ftp:// (File Transfer Protocol)


        Where do I want to go?

      • What computer out of all of the 10's of millions of computers do you, OH MASTER, want me to link to?
      • You want to link to a specific Domain name (our domain name is

      • Once I get to that domain what folder should I look for?

            • Folder name i.e. /"folderIwant"/ (in our case "docentclass") notice the ubiquitous forward slash /
              • The forward slash / indicates the end of one path item and the start of the next one
              • The / at the end of the path statement asks for the index page located in the last folder in the path name

      • You know that folders contain files
        • The file that you usually, not always, look for is the index file, named aptly, index.html or occasionally index.htm
          • This is also referred to as the home page


    • To Summarize the absolute URL to our site (path name to our site) is:
        • This full path name gets you to
            • The proper protocol http:// for understanding Hypertext Mark Up Files
            • We will also use the ftp:// protocol (File Transfer Protocol) to upload our pages to the Internet later
            • The Museum web site -
            • Into the folder docentclass
            • And to the file index.html
              • So why don't we put index.html at the end of the path name?
              • And what does the forward slash / do?

relativeRELATIVE URLs in the same folder

  • A relative URL relates the folders and files on your own web site to each other

  • You can link to a section within a document or to any document on your web site using relative links

    • You don't need a server type, or a domain name to access a file or folder on your own site
      • On our site web site all files are in the folder "docentcouncil"
      • So the relative URL is simply "somefile.html"

    • The server recognizes that to get to "somefile.html" it must look in the folder containing the linking document to find the linked document
      • If the file is not there you will know. The error messages will pop up in many different forms

    Relative URLs between folders on our own web site

  • In the case where we create subfolders under "docentclass" that we want to link to

    • Then "docentclass" is the "parent folder"

      • Then there could be another file that you want to link to say "someotherfile.html"

        • If "someotherfile.html" is in a subfolder then that folder becomes the "childfolder"
          • If "someotherfile.html" is in a subfolder of "childfolder" that folder becomes the "grandchildfolder"
            • Etc. etc to quote the Yul Brunner version of "Anna and the King of Siam"

        • For example to get to the picture "image.jpg" in the "graphics" (child) folder from "docentclass" (parent) folder
          • the pathname is /graphics/image.jpg
        • To link to a file in the parent folder from a child folder
        • "
          • the path name is ../"filename.html" where filename.html is the file that you want in the parent folder
          • from a grandchild folder to a parent folder ../../filename.html
            • ../ is the server code for stepping up one folder on the server
            • ../../ = how many folders?

            HTML is a tag based language. So where are the tags?