About Folders and Directories

Introduction
I'll admit that when I first went to learn HTML, folders and directories confused the crap out of me. It's really a simple concept, but sometimes it can be a bit diffucult.

In this section I hope to give you a better understanding of addresses, folders, and directories in terms of web usage.

If you know how to navigate through the files on your computer well, and manipulate folders, copy folders, etc. then this shouldn't be to diffucult a concept.

Before We Start
Note that this is written by a windows user, I'm sorry if it seems a bit confusing to Mac users. If you would like to write a "Mac" version of this tutorial I will gladly give you credit and a link. Feel free to include screen shots. Email Tutorials to: jenni@jaydemail.com.

Because we will be dealing with the address of files/folders a lot, we need to set up the file explorer so that we can see the full path of files.

1. Go to the desktop by minimizing all open documents/folders, or clicking the desktop icon on your toolbar.
2. Double Click on the "My Computer" icon.
3. Now the file explorer will open. In the tool bar, go to tools > folder options. (This may be different on different Operating Systems).
4. Click the view tab
5. In the advanced settings, where it says files and folders, check the "display the full path in the address bar" option, if it is not checked already.
6. Click the OK button

Now you will be able to see the full address of a folder that you are in.

Navigating and Linking On Your Own Computer
Files are usually stored in "folders". This helps keep everything orginized.

On my computer, the hard drive is called "C:\", or the "C Drive" as I occationally call it.

If on my C drive I had a folder called "website1" the address to that folder would be: c:\website1\

If I had a file called "index.html" located in the "website1" folder, the address to that file would be: c:\website1\index.html

Let's say I had another file in the "website1" folder called "bio.html", and on "index.html" I wanted to have a link to "bio.html". On "index.html" I would type a link like this: <a href="bio.html">Click Here</a>.

I only have to type the relative address because "bio.html" and "index.html" is located in the same folder.

Now let's say I had another folder on the C drive called "website2", and in that folder I had a file called "image.gif".

If I wanted to link to "image.gif" on the "index.html" page located in the "website1", then I would have to type the full address, because we are now dealing with two seperate folders. I would type the address like this: <a href="c:\website2\image.gif">Click Here for Image</a>

But, let's say that back in "website1" I had another folder called "part2" and in that folder I had a file called "guestbook.html". If I wanted to link to "guestbook.html" on the "index.html" page located back in "website1", all I would have to type is the relative address: <a href="part2/guestbook.html">Guestbook Here.

Navigating and Linking On the Internet
Setting up links for the internet is kind of like that. The main differences are, you usually don't deal with the backslash, you use the foreslash instead. You usually can't use capital letters, or spaces, and most importantly, your folders won't be located on any "drive".

Instead of some drive like C:\, we are dealing with a website URL. I suppose you could pretend that if the address of your website was http://www.domain.com, then your folders and files would be located on the "http://www.domain.com" drive. It's not quite like that, but if it makes it easier, then we will pretend.

Let's say you had some web space loacated at http://www.myhome.com, and in that web space you had a file called "index.html", and "bio.html", and you also had a folder called "part2" with a file called "guestbook.html".

Linking to various files would work the same way.

If I want a link to "bio.html" on my "index.html", then I would type <a href="bio.html">Bio</a>

If I want to link to guestbook.html, I would have to type <a href="part2/guestbook.html">Guests</a>

If I wanted to link back to "index.html" on the "guestbook.html" page, then I should type the full address: <a href="http://www.myhome.com/index.html">Back To Main</a>

Let's say I wanted to link to another website, then as you know you would just type <a href="http://www.thierhome.com">, but what if I wanted to link to a page that was contained in one of thier folders? What if they had a folder on thier webspace called "mine", and in there was a file called "about.html".

Then the address would be http://www.thierhome.com/mine/about.html.

Main?