• Home
• Articles
• Software to use
• Websites to visit
• Books to read
• Gadgets

Search for:

©2008 Mike Gobbi

Web Site Basics

• Date: June 27, 2006
• Topic: Webmaster
• Level: Basic

Articles > Webmaster > Web Site Basics

So you want to build a website? This article covers the very basics — what files to put where and what they mean.

What is a Website?

A website is simply folder on the hard drive of a web server. When browsers request a page, the web server locates the appropriate file and give it to them. Every Mac OS X computer is also a web server1, and the special website folders are /Library/WebServer/Documents and /Users/yourname/Sites. To view the files in these folders, you would run a web browser and load the URL http://localhost/ or http://localhost/~yourname.

Important Files

There are four important files in every website:

index.html2 is the page that people see when they try to view the top of the website or the top of a folder (i.e., if you load http://www.yourdigitalmentor.com/ you are actually seeing http://www.yourdigitalmentor.com/index.html). You can — and should — put an index page into every directory that you expect people to navigate to.

favicon.ico3 is a 16x16 icon that appears in the left of the web browser's URL field (the favicon.ico for my website looks like ). You don't need to provide an icon, but it's nice. And the web browsers will always try to load it, so if you don't provide one your web statistics will have a lot of unnecessary "file not found" errors.

robots.txt4 is a text file that tells robots (like Google's web crawler) what pages not to look at. On my site I say not to go to the ratings pages (the links in the right column) because I don't want the robots to give me bad data.

basic.css5 is a cascading style sheet6 that defines the appearance of your website. The stylesheet is optional and can have any name you choose. It's a good idea to have one, though, and to name them consistently.

Important Folders

While there are no rules about how you must organize your website, there are conventions that you should follow to keep your life simpler. Basically, separate sections of your site should be in separate folders, and images should be stored in their own folder. So the simplest site should look something like what you see on the left.

As the site grows it will begin to resemble what you see on the right. The top-level images folder (public_html/images/) should contain all images that are used by the top-level pages and by pages in more than one subdirectory.

How deep should your heriarchy go? I am very hesitant to go two levels (i.e., apples/macintosh/) and would almost never go three (apples/macintosh/scotland/). At this point my file organization is going to be difficult for me to understand and, more importantly, my information model is going to be difficult for my visitors to navigate.

File Naming Conventions

There are a few basic rules of web filenames:

1. No punctuation marks.
2. No spaces.
3. No capital letters.
4. Use either hyphens or underscores in your site, but not both.
5. Either always hyphenate/underscore between words (i.e., top_banana.html) or never do (topbanana.html). I suggest that you choose 'never'.

The reason for these conventions is so that if you ever need to say a URL out loud you don't forget to say a punctuation mark or capital, and if you write it down there is no confusion about whether a horizontal line is _ or – and whether a space is really a space.