Designing Your Website's Directory Structure

Oct 5
21:00

2004

Stephen Bucaro

Stephen Bucaro

  • Share this article on Facebook
  • Share this article on Twitter
  • Share this article on Linkedin

... is granted for the below article to ... ... use for ezine, ... ... as free bonus or part of

mediaimage

----------------------------------------------------------
Permission is granted for the below article to forward,
reprint,Designing Your Website's Directory Structure Articles distribute, use for ezine, newsletter, website,
offer as free bonus or part of a product for sale as long
as no changes are made and the byline, copyright, and the
resource box below is included.
----------------------------------------------------------

Designing Your Website's Directory Structure

By Stephen Bucaro

Any kid, and their grandmother too, can make a webpage.
There are many "wysiwyg" webpage design applications that
let you create a webpage as easy as typing text. But only
a few people can create a WEBSITE. The stumbling block is
knowing how to link webpages together to form a website.
I have seen many websites that consist of a single webpage
- about a mile long!

The first problem is that websites are contained in virtual
directories. You know that your webpages can be found at
yourdomain.com, but the actual path to yourdomain.com on
the web server may be known only by the system
administrator. And the system administrator can move your
website to a different folder, or even a different computer,
without changing its virtual address.

The second problem is that most people don't know how to
write a relative link. Relative links have the advantage
that you don't need to know the path to the webpage that
you want to link to, you only need to know where it is
"relative" to the webpage containing the link.

Designing Your Directory Structure

The first step to implementing a website is to design the
directory structure. Let's design a directory structure for
a simple download website. The website consists primarily
of articles and digital material that visitors can download.
You could just dump everything at the top level of the
website. Good luck maintaining that website!

To keep the files organized, you need to create
sub-directories (folders) on the website. Even though the
website consists only of articles and digital downloads,
you need five sub-directories, as described below.

- articles
- downloads
- general
- common
- cgi-bin

You understand what the "articles" and "downloads"
sub-directories are for, but what are the other three
sub-directories for? It's standard practice to provide
certain features on your website, as listed below.

- About
- Contact
- FAQ
- Privacy Policy
- Search
- Sitemap
- User Agreement

Each of these features requires a webpage. Instead of
dumping the webpages at the top level of the website, or
mixing them in with articles or downloads, let's put them
together in a folder named "general" (I'm sure you can
think of a better name).

All of your webpages use certain things in common, for
example, your logo graphic. If your web server provides
SSI (Server Side Includes) all your webpages can share a
common header file and a common footer file. You might
also define all your website's styles in a common style
sheet. Let's put all of these files in a folder named
"common".

Your contact page might use an email form. If your server
provides server-side scripts, you would place the email
form script in a folder named "cgi-bin". Cgi-bin stands
for "Common Gateway Interface - Binary". Few people use CGI
any more, and those that do don't use binary files, but the
folder name has stuck as a traditional place to store
scripts. Almost all websites come with a preconfigured
cgi-bin folder, and the website may be configured so that
the cgi-bin folder is the only folder with rights to run
scripts.

I would also recommend that you create certain
sub-directories for some of the above mentioned directories.
Most web pages contain images. You could dump all the
images in the same folder with the webpages, but when you
get more than about 50 files in a folder, it becomes
difficult to maintain. You should create an "images"
sub-directory in the articles, downloads, and general
directories. The downloads directory should also have a
"files" sub-directory to store the downloads.

This arangement of directories and sub-directories will
provide good file organization for the example website.
Understanding my reasoning for this directory structure
should help you to design a directory structure for the
website you have in mind.

Default Page Configuration

Every website has at least one default webpage configured
(also called the "home" page). The default webpage is the
webpage that is returned when the user enters or clicks on
a link containing only the domain name, without a specific
file name. On a Unix or Linux web server, the default
webpage will usually be "index.htm". On a Windows web
server (IIS), the default page will usually be "default.asp".

The website administrator, or if your webhost provides the
required "control panel" feature, you can actually
configure any page to be the default page. If your web
server has more than one default page configured, I would
recommend removing all but the default page that you intend
to use.

Now, let's assume that all of your webpages need to link
to an image file named "logo.gif" stored in the "common"
folder. The relative link on your default webpage would be
as shown below.

"common/logo.gif"

The website file manager interprets this as "look in the
folder named common for the file named logo.gif".

However, the link on any webpage contained in one of the
sub-directories would be as shown below.

"../common/logo.gif"

The website file manager interprets this as "go up one
level, then look down in the folder named common for the
file named logo.gif".

This difference in the link may not be a problem unless you
use SSI or ASP (Active Server Pages) to build your webpages
from a common header file and a common footer file. Then
you need a different link in the common file depending upon
whether the page linked to the common file is the default
webpage (where you would use common/filename) or a webpage
contained in a sub-directory (where you would use
../common/filename). There are several ways to solve this
problem.

1. If your website has a server-side scripting engine like
ASP or PHP and you know how to program, you could implement
code that selects the proper link.

2. You could use the complete path, including the domain
name, on all pages. This will cause problems if you ever
have to move your website to a different web host (Until
all the dns servers across the planet have been updated).

3. You could put your home page in a sub-directory, for
example "common", and make your default page into a
re-direct to your home page. Then you would use
"../common/filename" for all links. The following meta tag,
placed the head section of your default webpage, will
immediately redirect the users browser to your real home
page.

meta http-equiv="refresh" content="0,url=
"http://yourdomain.com/common/homepage.htm"

In this article, I showed you how to design a directory
structure for your website and how to create relative links
to link all your webpages together to form a website.
Website visitors don't like to do a lot of scrolling, so
try to keep your webpages to only two or three screens high.
Please, no more websites that consist of only one mile long
webpage!

----------------------------------------------------------
Resource Box:
Copyright(C) Bucaro TecHelp. To learn how to maintain
your computer and use it more effectively to design a Web
site and make money on the Web visit bucarotechelp.com
To subscribe to Bucaro TecHelp Newsletter visit
http://bucarotechelp.com/search/000800.asp
----------------------------------------------------------