Relative URLs

A relative URL need only to specify a file name or a relative path for its link destination:

<a href=“treehouse.html”>tree houses</a>

This assumes the destination file is in the same directory as the HTML file containing the link

If the file is in a different directory, path information must be added to the href value

'../'  means 'Go up a level' ("open the box in which you are")

'directoryName/' means go down into that subdirectory

Start with '/' means start at the root (entry point) of the web site

For instance, to go back to the home of the web site, even if you don't know where the page you are working on will be place on the global web site

Directory hierachy

What you want

Relative URL

Root

  • Directory A

    • file1.html

  • Directory B

    • Dirctory B1

      • file3.html

    • Directory B2

      • file2.html

         

Go from file2 to file3

../B1/file3.html

../../B/B1/file3.html

/B/B1/file3.html

Go from file3 (or file2) to file1

../../A/file1.html

/../A/file1.html