Now that We have a basic understanding of HTML Tags and how they work, I'll assume that you have downloaded, or bought your wysiwyg editor, and installed it, and have tried it out with a few 'test' html pages. If you haven't, then do so now...I'll wait...*whistling*...

OK...all done?

Do you now have a basic understanding of how to put the text and images
into your page and move them around until you are satisfied with the result?

Setup your webpage for uploading to the server:

  1. On your desktop, create a 'NEW FOLDER' (directory) and Name it 'MY_PAGE'
    (or whatever you want).
  2. Open the directory, and make another 'NEW FOLDER' inside it, called 'images'.
  3. Save the images you want to place in your html page in your html document inside that folder.
  4. Now open a new blank page in your editor, and SAVE your blank document as 'index.html' in the 'my page' directory.
  5. Continue to add elements of text and images to your page, selecting images from the images directory, until you have completed it to your satisfaction, then SAVE your changes.

Fig. 2

 

This is what your directory structure should look like.
You should have the main (my_page) directory at the 'top' level, with the images directory and index.html inside that, and your image files (gifs) inside the images directory.

The 'path' to your images (image links) within your html document should look like this:
<img src="images/01.gif">

 

Website Organization Basics:

Some inexperienced developers put all their html documents and all their image files in a single public directory. A server will organize them alphabetically (either descending or ascending) or by number (beginning with '0').
This is OK if you have a limited number of images, and html pages (a small home page setup for example) but if you plan on building and maintaining a sizeable site (some of the ones I work with contain 200-300 html pages and twice or three times as many images) you will find that trying to update the pages on your site will be come very confusing and time-consuming. IF you begin by organizing your website structure in directories, you will have a much easier time of it, down the road...

Here are a couple of possible directory structures for your website:


Fig. 3

 

REMEMBER: The Webserver must be able to 'follow' the path you have laid out to find your images, so you will need to MIRROR the structure existing on your own harddrive, with that on the server. If the 'path to images' works on your own machine, it should work on the server as long as you are using a 'RELATIVE ADDRESSING' system. Most WYSIWYG editors will setup the path to your image directory AS a RELATIVE path, so you should not have any problem. Later, you may want to change the RELATIVE PATHS to ABSOLUTE PATHS... but for now, relative will work fine.

ON to UPLOADING....

Previous      Next