Getting started with free web hosting

Welcome to the getting started with your web hosting account guide.

 

This guide provides information about the basic functions needed to utilize your new web hosting account.

 

This guide assumes that you have verified your email address and received your web hosting account details.

 

Table of contents

  1. Accessing your web hosting control panel (CP)
  2. Understanding your directory structure
  3. Basic HTML help ( html editing software, images, links etc.)
  4. Uploading files with FTP (FileZilla)
  5. Uploading files with your File Manager
  6. Registering a domain name & updating name servers
  7. Adding a top level domain (tld) to your account
  8. Where to get help / support
  9. Upgrading your web hosting plan

#2 - Understanding your directory structure

Before you begin the task of creating your web pages, you need to understand how naming and organizing these files affects the way they interconnect or link to one another, via the URL. This guide gives some recommendations for naming and organizing your files and discusses how absolute and relative URLs are used so that your linked files and pages will always work.

 

Naming Files

  • Give your files descriptive, consistent names.

  • Give your page files an extension of .html

  • Even though you may be able to use a longer filename on your computer, we recommend using the 8.3 convention (8 or less character name with a 3 character extension such as 'yourpage.html'). Filenames become part of the page's URL, and shorter is better!

  • Do NOT include special characters (such as #, &, %, ^) or spaces in your filenames.

  • Files and directory names on the web server ARE case sensitive; YourPage.html IS NOT the same as yourpage.html

  • If you name the first page of your website 'index.html', you do not need to state the filename to reach your site. For instance, if your username is 'test' and your files reside on the web server in a directory called 'Mydir' and you've named your homepage 'index.html', readers can reach your page by using the URL: "http://test.free-web-space.biz/Mydir/".

Organizing Files

  • If your collection of web documents is small (up to about 30), storing them in one directory is logical. However, as your collection of files grows, you will want to consider grouping your files into directories.

  • The type of directory organization appropriate for you will depend on the type of information that you are publishing. The example below illustrates one possibility.

    / (Document Root)
    /images
    /forum

  • The document root directory is what is accessed when you go to your site: Example: test.free-web-hosting.biz

    In the example above, you see the "document root" directory. images and forum are subdirectories below the root directory, but on an equal level with each other. Subdirectories could be created under images and forum. Example: /images/buttons

    The http / url path to the buttons directory would then be:
    test.free-web-hosting.biz/images/buttons

  • The document root directory is already created with your web hosting. This is the directory where you upload the files you want people to be able to view through their favorite web browser.

Absolute and Relative URLs

  • Ok, so now you want to promote and tell someone about your site. You need to give them your URL. What's a web site without connecting to and from your collective pages? You need to use a URL in the HTML code.

  • What is a URL? A URL (Universal Resource Locator) is the address or location of a file, whether it be an HTML page, a graphic image or some other web file. There are three parts to the address.

    Example:
    "http://www.free-web-hosting.biz/getting-started/index.html":
    http:// is the Internet Tool Type
    www.free-web-hosting.biz/ is the Host Name
    getting-started/index.html is the path and filename

  • What is an Absolute URL? This is the method of using all three parts of the URL to establish the location of the linked file. Absolute URLs are used when giving out your site's location or for connecting to documents outside your directory structure.

  • What is a Relative URL? This is the method of using only the path (directory names, if any) and filename of the URL to establish the location of a file. Relative URLs are used for files within your directory structure. The importance of relative URLs is that by using them, you can create links between files that will work no matter if they are on your computer or on the web server.

Connecting Files (HTML)

Let's pull it all together with an example of a directory structure and some sample files.

 

Let's assume you have the following files and directories on your computer:

C:\My-Website\index.html
C:\My-Website\free.html
C:\My-Website\courses\outline.html
C:\My-Website\graphics\image.gif

 

When you upload your files using FTP, do NOT upload the My-Website folder. Instead, select all files within the My-Website folder and upload the files and directories all in one batch to your document root directory in your web hosting account.

After you have uploaded the files, your site can now be accessed via a web browser at your subdomain.

  • The URL that connects / links free.html from index.html is simply:
    "free.html" To access free.html directly you would type the following into the address bar of your browser:
    http://test.free-web-hosting.biz/free.html

  • The URL connecting outline.html from index.html is:
    "/courses/outline.html"

  • The URL that connects image.gif from index.html is:
    "/graphics/image.gif"

  • Let's say you want to connect back to index.html from outline.html You would use the double dot notation to take you back up one directory level, from courses, like so:
    "../index.html"

Final Notes

Notice a couple of things about URLs. When used in HTML code, the URL is enclosed in quotation marks. The forward slash (/) is used to separate the directory name(s) from the filename.

 

If you feel this guide was hard to understand please let us know in the web hosting support forums what sections you did not understand and we will do our best to rewrite it in a simple way.

 

Yet another example: As you can see just above here we have placed a link to the web hosting support forums. As you can see in your browsers address bar, this page ("/" document root) is located in sub-folder /getting-started The web hosting support forums is located in sub-folder /forums

 

Do you now know how we've linked to the support forums?

ANSWER: ../forums

 

Remember from above, "../" takes you down one directory level, then we add "/forums" which now links links to the correct directory of the web hosting support forums.