Before Getting Started:

Print this and keep it next to your computer at home.

You probably have figured out how important it is to name your files properly for a browser to "read" it, to title your page, and how important it is to keep your files organized. From the very beginning of your work on a web page, you need to be aware of organizing your files. It can get very confusing.

• Organizing by folders

If your site is large enough to break down into separate sections, (folders), then each section would have its own folder. For instance, you may want to store all of your graphics in one folder, all of your lessons in another, school related information in one, and yet another for the presentations that you may be giving.

Whatever you decide, you need to implement your system from the very beginning; that is, you should make all the folders you will need for the entire site before you begin. If you decide later to add some this can very confusing and quite likely, your links will be break.

• Organizing by name

If your site is relatively small, you could just give each different kind of file a preix that indicates what it is. For instance, your title gifs could all begin with "head", your lesson files could all begin with "lp". (I personally prefer folders....).  You will see some sites done this way.  Most are sites with lots of images.  Instead of describing the image, numbers and/or letters are used.

• It is very important to know how to name your files. You have created HTML files (those for the web) and some graphic files. It is best to make these names as simple as possible. Some suggested rules:
 
• Use all lowercase letters. The browser can read upper and lower, but your files are easier to organize and look more consistent if they are limited to lower case.
• Use only letters or numbers-no funny characters. Do not use apostrophes, colons, semicolns, bullets, slashes, or any other characters except letters or numbers.
• You can use the ~ (tilde), aa(underscore), - (hyphen), or . (period)
• Never use a space in any file name.
• All web pages must end in .htm or .html. hint: html looks a bit more professional.
• Put an extension at the end of your graphic file names so you know what they are. They must have been saved in the same format as what they are named. ie. graphic.gif or graphic.jpg
• Keep the file name short. (this reduces typos when people try to type it in) and it looks much neater.
• Saving and titling pages:
• When you Save As, you are saving the code as an HTML file, which is a web page.  Every web page has a name that ends in .htm or .html.  This is how the browser knows it is a web page.   The very first page of your web site must  be names index.html or index.htm.
• Now you have to title your web page.  The title has nothing to do with the HTML file name you saved it as!  The title is what will appear in the title bar of the window when someone else views your page on the World wide Web.  Bookmarks use the title and this is what will appear when someone "saves" your site with a bookmark. Search engines look first at your title and decide from that where to add this page to their database so others canfind you.  Make this title relevant to the page!

Upload Your Site:

• You must have WS_FTP for Windows on a PC or Fetch on a Mac before you can upload your files.

There is other software available, but these are the programs that we have used in this class.
• You must know your host name,  girltech.cs.rice.edu
• Your host type, Unix(standard), automatic may work.
• Your userid, which will look something like sboone.
• Your password, which you help decide.  (You need to CHANGE the password that was given to you.)
• The directory path which your files will be stored.  It will look something like this: sboone/webpages/lessons.

• Open the FTP program
• Type in the data needed to run the program
• Check the preferences or options you the data format to sent as
• raw data (same as binary) for images
• ascii for your HTML files
• You are now looking inside the computer AT RICE. The folder name the CEEE has given you (home) is open and available, you must open the webpages directory (this is an actual alias to a different place, but don't worry about that).
• Transfer your files.

• Since your files are visible to the world, open your home page in your browser, online. Go through EVERY page and click every link.  Make sure every graphic is there.  Make sure all e-mail forms work.  Make sure animated graphics are miving (and stopping), and that any sound siles you created are loading and playing.

• You are going to want to update your files regularly.
• to update an existing page work on a saved copy of the file, then upload this file to the server.  This new reworked file will replace the old file, so BE VERY CAREFUL.
• If you want to add an entirely new section, You will have sever new files for this new section.  This means your home page and probably other pages will have changes.  Update all of the links that you may have on ANY of your pages.  We recommend you keep a list of files that need to be added and replaced.  (paper and pencil type).  It is also a good idea to keep back-up copies of ALL files someplace on your hard drive.

Home Computer Hard Drive						Server at Rice
	Folder (Directory) on Your Hard Drive				Directory (folder) at Rice
		file.html  (home)	FTP	(Rice)  file.html

Back to the Table of Contents                       Back to Monday's Lesson

URL = http://teachertech.rice.edu/Materials/GT2001/East/filestructure.html

---

These pages were developed through GirlTECH, a teacher-training program sponsored by the Center for Excellence in Education (CEEE) with support  from the National Science Foundation through EOT-PACI.
Copyright ©  Susan Boone , GirlTECH, June 2001.

last edited, sb  6-17-2001, 15:03.