|
File Structure
File structure is the hierarchy of folders
or directories on your disk or hard drive. It is also called
directory structure or directory hierarchy.
 How
to organize your student folder for this class
 First,
create a folder in your HSStudent Folder called "mysite" to house
all of the files you create for this class.
 Inside
the "mysite" folder, create separate folders called:
IMPORTANT:
For the Web, DO NOT USE SPACES in file names or
folder names. Get in the habit of naming your folders
and files without spaces. You can use an underscore or
a dash to break up a word.
 Inside
your "project" folder, make a folder for each assignment. Name
these folders:
Remember: NEVER name a folder or
file with spaces
 Why
File Structure is Important for Understanding Linking
With absolute
links, you link to an outside external Web site somewhere
on the Web. With relative links,
you link to an internal file that you created within your
Web site.
Because each assignment includes many
files, keep the files for each assignment seperated into
different folders. This way, when you are working on your
Personal Site, you know to save all of your HTML files
 Here
we are inside the personal folder. Say you want to link
your file resume.htm to the file called called links.htm.
If both of these HTML files, resume.htm and links.htm are
in the same folder, (in this case the "personal"
folder, then the link would look like this:
<a href="links.htm">Links</a>
Remember, to make an absolute link,
you must include the entire path to the file on the Web,
starting with http (for example, http://www.coventrypublicschools.org/chs
) but to make a RELATIVE link, within your own file structure,
YOU DO NOT NEED http, or a drive letter.
All that matters when making a relative
link within your file structure is the directions from one
file to another file. Think of it like this: the file with
the link code in it asks: Where is that other file IN RELATION
to where I am?
How would you link to your resume.htm
file from the table of contents page, which is named default.htm
and is sitting outside of the personal folder?
Give Directions: The Table of Contents
page (default.htm in the illustration above) asks, "How
do I get to resume from where I am?"
If we add this code to the default.htm
table of contents file will the link work?
<a href="resume.htm">Resume</a>
Why or Why Not? Look at the file default.htm
in the window above. Now read the HTML in the link and pretend
that you are the browser and try and follow the instructions.
The link tells us: look in the same folder that you are
in and you will find the file resume.htm. But if we look,
the file resume.htm is not inside the www folder with default.htm
anymore. It now belongs inside the "personal"
folder and if we click inside the personal folder, we will
then see the file resume.htm
So in order to make our link from the
table of contents page to the resume file, we have to revise
the directions: First look inside the folder called Personal,
and THEN you will find the file called resume.htm
The link will now look like this:
<a href="personal/resume.htm">Resume</a>
Now we can successfully link to the
file because resume.htm is inside the personal folder.
Relative links work
in relation to the file with the HTML link code. If we are
going to make our link on the table of contents page, then
we give directions from the table of contents page.
 What
if the file I'm linking to is up one level from where I
am?
What if we wanted to reciprocate
the link, and make a link from our resume.htm page back
to the table of contents page. How would we give directions
to the table of contents page from resume.htm?
In order to give directions
from the resume page to the table of contents page we have
to say:
Move up one directory,
outside the one we're currently in (which is the personal
folder) and into the www directory which is up one directory.
If we click the UP button on the browser, we will then be
in the www directory, which is where the default.htm table
of contents page is.
How do we tell the link
to look in the directory above it?
We
do this by using ../ before
the file name
(dot-dot-slash) ../ indicates
"go up one folder level." So to link from resume.htm
to the default.htm table of contetns page we have to say
go up one folder level and then look. The code would be:
<a href="../default.htm">Table
of Contents Page</a>
../ is
used to indicate "up one directory"
What about this:
If we forgot to use the
../ before the file name and instead placed this code on
the resume.htm page, would the link work?
<a href="default.htm">Table
of Contents Page</a>
Where would that link take
us?
Can you have more than
one file named default.htm?
 Think
of it like this: The file with the link says:
"I know where I am. Where are
you in relation to me? Are you right next to me in the
same folder? Or do I have to look inside another folder
before I can see you?"
 Back
to Linking with the
anchor tag
Jump
down links
|
