[an error occurred while processing this directive]
You are visiting PotentProducts.com.
Home Page.
Resources.
The Forums.
Web Services.

 

Follow that Path
This Tutorial is for Beginners

Knowing the Right Path

Anyone operating a Web site needs to start thinking in terms of a path rather than a "URL" or "link" to a page.  A Web site can have a "URL" and a Web page can have a "link", you on the other hand, must think like the Server — and the Server only knows paths.

In the Tutorial on Web Roots it was explained about Document Root and that is where we are working from.  As far as this Tutorial is concerned, that is the beginning or "root", of all pages, images, and scripts, that we will be referring to.  These are the Publicly accessable files you want your Site Visitors to see and use.

Quick Recap


Absolute Link starts with http://
Used when referring to any resource or protocol available on the World Wide Web, regardless of what Server is being used.

Relative Link usually shown as ../
Used to indicate moving "up" one level from where you are.

Path always starts with /
Used when referring to the beginning of Document Root as the starting point, regardless of what page the "path" is used on.

This Tutorial will show and explain how using a path can make your coding experience a whole lot easier.

Note: We are dealing with a Server using Linux, not Windows.  Although using ../ works with both Linux & Windows, it is not recommended for use on a Server.  After awhile it gets too confusing knowing how many ../ to add. 

 
Getting Organized

As you develop your site and add more pages, you will start to create new directories.

Why?

Because it helps to keep you, your site, and your Visitors, more organized — that's why.  You are going to find things getting all mixed up, if you don't know the correct path.  And if you don't know, how will the Server know?  Your Web pages, images and scripts, must not only be known to the Server, the Server must know if they are publicly or privately available and where to find them when needed.

Since you are Master of your Domain or, in this case, Master of the Web Site, it is logical that "you" are the SiteMaster and responsible for telling the Server, where things are and who has access to them, regarding anything to do with the Web site.

Do not keep all your Web pages and images, plus whatever else, in your Document Root — which is where your Home Page is. This is a common mistake made by people using HTML Editors like FrontPage or Dreamweaver.  This will make it very frustrating "for you" because the more files you have, the longer it will take your FTP program to load.  You might start to think the Server is slow or service is bad and in fact, it's because your account files are not organized.

In order to keep yourself from going nuts, because of all the potential confusion and slow-downs, you need to create specific Directories for specific Files.  One Directory for the most common of these specific Files is the "images" directory.  This is the Directory to keep all files ending with "jpg" or "gif" or the "png" format.  Those three image formats are the most common, but it can be whatever file type is used to represent an image file.

This means you need to create an images Directory and the "path" to all images should start with /images/ which, of course, tells the Server to look in the images directory for your Hosting account.  By default, it also tells the Server to start looking from the Document Root which every Sitemaster needs to remember as well.


The Shortcut Path

For the sake brevity, we will presume that you are aware each path is coded within the HTML Anchor tag:

<a href="path">whatever</a>

We will leave that part out as we just want to focus on the path part.

Let's say on your that you have a Free Hosting account and on your Home Page you have a link to an image.  Now which of these two would you rather use:

http://something.???.com/~account/images/image.gif
  or
/images/image.gif

The first one is a "link" and uses 53 characters.
The second one is a "path" and uses 18 characters.

Regardless of using a free Hosting account or paid-for, you will always save on coding when using a path and make things much easier.

http://domainname.com/images/image.gif

The average Domain Name is 6 characters long, 4 characters for the .com plus 7 characters for the http:// part.  By leaving all that out, 17 characters in this case, we begin to see the ease of use when using a path.

If we do the math, using 10, 20, or 30 pages, we start to see the value of using a path rather than something else.  This not only helps, to cut down on coding — and less code means less problems and possible mistakes — it also makes things easier to remember.

Gotta like that!


Drilling into Directories

Now let's say you created created a directory called "funstuff" and wanted to use the same image you had on your home page.  The "funstuff" directory is one level down from your home page, and you could use:

http://yourdomain.com/images/image.gif
  or
/images/image.gif

A more extreme example is when it comes to using scripts for a Forum.  I have seen this type of coding:

http://www.domain.com/forum/non-cgi/Skin/Default/images/user.gif

That's 63 characters, when instead, they could have used:

/images/user.gif - 16 characters

Notice how the coding with the forward slash has not changed from our other examples?

Think of putting files in one place, then, by just using the forward slash, you are telling the Server to start at your Document Root to look for whatever.  If you have an image that is 3 directories down, from your Document Root (where your Home Page is) the code stays the same.  Regardless of where the page is, by coding to always use the same path to the image, it will always by easy to remember, because it does not change.

This allows you to move/create, files or directories — as you choose.  With some very easy changes to your coding, your Server knows exactly where to find what it needs and you find it easier to remember how your site is laid out.


Summary

I'm not saying that it will be easy to change coding on current pages or even that it is easy to understand.  What I am saying, is once you get used to thinking of "paths" and how a Server uses them, you will find it a lot easier to maintain your own Web site.

Although I've used images in the examples, the same thinking applies to: most anything within your Web site that the Server would need to find.  Error messages for pages and images, will become a thing of the past.  Another advantage which we never discussed, is the simplicity & ease of use, when moving your Web site to another Server.  Using "paths" instead of a "URL" or "link" means you can pick-up, move to another Server and be in business, almost as fast as you can upload your files.

 

 
Tutorials Available

Disclaimer · Web · Windows

cPanel Flash Tutorials

Web Basics

.htaccess

 
 Friday, March 29th, 2024 MST