Files and DirectoriesHow files are organized

How your code refers back to it’s contentRelative vs. absoluteRelative to the root or relative to the referring document

<img src=“http://simpsons.com/images/homer.jpg” /><img src=“images/homer.jpg” /><img src=“/monkeys.jpg” /><img src=“/temp/homer.jpg” />

HTML files and paths

Sometimes /web/ sometimes / It is the beginning of the site and the

directory holding the site. A link to /folder2/file1.html is a link relative

to the root of the folder.

The “root” of a website

Just the name of the file:

<img src=“homer.jpg” />

Same Directory

Just the name of the file:

<img src=“images/homer.jpg” />

Image in a folder in the same directory:

Just the name of the file:

<img src=“../homer.jpg” />

Image in a folder ABOVE the current directory:

Absolute & Relative URLs

File name Absolute Relative to doc

Index.html http://www.site.com/2005/index.html index.html

Image.gif http://www.site.com/2005/images/image.gif images/image.gif

Data.html http://www.site.com/info/data.html .../info/data.html

An absolute URL • shows the entire path to the file, including the scheme, server name,

the complete path, and the file name itself • Like a street address

A relative to the document URL • points to the location of the desired file FROM THE FILE THAT

CONTAINES THE URL. Instead of an address,

• Like saying “three doors down”, or “image xyz that is in the same directory as this file”

• When working within pages you can reference pages & items within the same directories.