Tutorials:

1. Web Hosting Basics
2. Domain Names
3. Transferring Files (FTP)
4. Web Site Design

Web Site Design:

Site Organization:
Everyone has their own method for site organization, but this model seems to be very helpful for people getting started. We highly recommend you follow it until you grow reasons to do otherwise.

In the examples below, we use yourwebsite.com as a substitute for your actual domain name.

It is very important that you have a specific folder on your local hard drive where you keep your web site's files. Because we don't know what you named that folder or where you put it, we will always call it c:\website\ and I'll leave it up to you to know where it really is. (If you currently have your web files in a big mess inside My Documents or something, then create the c:\website\ folder and move them in there.) If you have multiple domain names, you may wish to organize them in seperate folders underneath your c:\website\ folder.

Name all your files in all lowercase letters with no spaces. If you would like seperation in a filename, use the dash (-) character. (The filename rules apply to all files, even images.) Inside your html, referance your files with the same filename (including lowercase); most web servers are case sensitive and this just makes your life easier.

The first page of your website is named index.html. If you are using PHP in your pages, then name it index.php.

Keep your main html pages in the main folder and, for each main html page, create a folder to hold images and other items that page may need. It is also good to have a main images folder to hold images that appear on more than one page.

If your main homepage file is index.html and you also had a page2.html, your site might look like this:
In the main c:\webpages\mysite folder:

The mylogo.gif and button.gif appear on both pages so get put in the universal images folder; the other items only apply to a specific page and end up in a folder for just that page. This saves you an incredible amount of work later when you decide to change images on your site and have them organised. Many large sites have hundreds of images. When you decide an image is unneeded, it is really nice not to have to wonder how many places you used it. Who wants to have to look at their entire website looking for broken picture links?

When you referance a file in your html, like mylogo.gif, use a relative path to the file.
Use: ./images/mylogo.gif
Not: www.yourwebsite.com/images/mylogo.gif
This will permit your web site to be viewed on your local hard drive exactly the same as on the server.

Site Design:
It is time to create your web site. We will pretend that you already know what kind of information you will be placing on your site and jump right into building it.

Most beginners have no idea how to build a web site. Most tutorials on learning how to make a web page focus on basics and don't give you much more than an ugly little "Hello World" web page. We will assume that you don't know what you are doing and still want a great looking website!

The first thing you should do is go template shopping. It is very important that you pay money for your template. It may only be $5, but paying for your template insures that you have nicely dodged all the people giving away "free" templates that they don't own. You really don't want someone showing up and telling you how you have infringed on their copyrighted material because of the template you used for your website.

Here is a list of some template sites where you can shop for a nice template. The first place on the list, Steve's Templates, will permit you to use a template for free. You can continue to use it for free by leaving the link to his website on the template or you can remove the link and pay a small fee for the template. This is fantastic, because Steve has given us permission to use one of his fully-functional templates in our tutorial.

Template Sites:
www.steves-templates.com
www.basictemplates.com
www.hooverwebdesign.com
www.allwebtemplate.com
www.jsbwebtemplates.com