A Step-by-Step Guide to Building a Website

Creating Basic Web Pages from Scratch

Basic Principles
(or, "Key things to remember, that will save you problems later on!")

• Your IPF fellows web site is a collection of individual files, written in HTML, inside your public_html folder on the Policy.hu server
• Your first web page must be called index.html (not myindex.html or index2.txt, or any other variation) -- without this file, no one will find your web pages!
• Your index.html will contain links to your other pages.
• Files must be written in HTML
• File names must end with .html (or .htm , but be consistent!)
• File names are case sensitive (e.g.; CV.html is not the same as cv.html
• File names canNOT contain spaces, accented characters, or other punctuation.
• Files must be in your public_html directory/folder
• You will first create your web site with an HTML editor (like Netscape Composer) on your local computer, THEN you will upload the files with an SFTP client to put them on the server.
• You use an HTML editor (like Netscape Composer) to create pages, and a browser (like Netscape Navigator) to view pages and to test your pages and links. (You cannot properly view and test page links with an editor (Composer), and you cannot edit your pages in the browser (Navigator).
• When you wish to make changes to your site, you must make the changes on your local computer, and then upload the changes to the Policy.hu server with an SFTP client.
  Note: When you upload files, they will replace the files that were previously on the server.

1. Create a Folder for your Web Site

   • create a new empty folder/directory on your local computer where you will save and work with your website files
   • give this folder an obvious name like WebWork or MyWebSite
   • make sure that you know where this folder is located and where to find it from the desktop and from the Save As command
   • do not put anything else into this folder, only your newly created web site files

    

2. Open Netscape Communicator to Create your first index.html page

   • Netscape Communicator includes several programs including an e-mail client, an Internet browser (Navigator), and an HTML editor (Composer)
   • we will be using both the browser (Navigator) and the editor (Composer)
     Note: MS Internet Explorer does not include an editor, so you cannot use it for creating a basic web site.
   1. In Composer, open a New Blank Page
   2. save this page as index.html inside your WebWork folder
   3. type in the text for your home web page
      - this page should introduce you and your project
      - it should contain links to your other pages which will have more detail on your project and related sites
   4. create at least two lines of text that will be links to your other pages
      for example:
      - My Resume
      - My Research Project
   5. save the page

    

3. Create Other pages

   1. while still in Composer, open a New Blank Page
   2. save this page in your WebWork folder
      - you may give the file any name you wish, but it must end with .html
      - do not put any spaces in the file name, file names are case sensitive
      - for example, name the page: resume.html
   3. type, or copy and paste text into this file
   4. at the bottom of the page include information about the date the page was created/modified, who created it, and
   5. type a line that says something like: Back to My Home Page
   6. open another New Blank Page and follow steps 1 to 5, but save this file under a different name like: project.html
   7. save the page

    

4. Make Links between your pages

   1. return to your index.html page
   2. select (highlight) the line where you wrote "My Resume"
   3. click on the Link (looks like a chain) button, or select Insert -> Link from the menu bar
   4. click on the Choose File button
   5. in your WebWork folder select the resume.html file, and click Open
   6. click the OK/Save button
      - you have now successfully created a link between your index.html page and your resume.html page
      - all other links that you create will be done in exactly the same way
   7. repeat steps 1 to 6, this time creating a link to your project.html page
   8. save the page

    

5. Link back to index.html and testing the links

   1. While still in Composer, open one of your other pages, like resume.html
   2. select (highlight) the "Back to my Home Page" text you wrote earlier
   3. using the same method described above, make a link to your index.html page
   4. save the page, and repeat this for any other pages you have created
   5. open Netscape Navigator, you can do this one of 3 ways
      - from the Communicator menu, select Navigator
      - from the File menu, select New -> Navigator
      - click on the Preview (ship's wheel) button on the button bar
   6. in Navigator, open your index.html file
   7. click once on the colored text that says My Resume
      - this should take you to the resume.html page that you created
      - Note: with Web pages you only need to click once to activate a link, you do not need to double-click
   8. click once on the colored text that says Back to my Home Page
      - this should take you back to your index.html page where you can follow any other links that you have created
   9. Note: If changes you have made to your page do not appear in Navigator, try the following:
      - make sure that you have saved your changes after working in Composer
      - make sure that you have opened the correct version of your page, and that it was saved in your WebWork folder
      - click on the Reload button, or hold the shift-key and click the Reload button

    

6. Congratulations!! You now have a working web site!

    

7. Use SFTP to put your pages on the Policy.hu server

   1. open your copy of the SSH client, or another SFTP client
   2. establish a connection over the Internet to the Policy.hu server
      - Host Name (remote server): www.policy.hu
      - User ID/Login: YourFamilyName
      - Password: the password you set when you first accessed your account
   3. in the left column (Local System) of the SSH client, locate your WebWork folder on your local computer
   4. in the right column (Remote System) of the SSH client, locate and open the public_html directory
   5. select your newly created or modified web files on your local computer
   6. transfer these files to the Policy.hu remote server by clicking on the -> button
      - Note: whenever you transfer files with SFTP, they will replace any files of the same name that are already in the destination folder
      - when you return home, you can use the same process to transfer files from the server to your personal computer by clicking on the <- button
   7. Remember: you must use SFTP to upload any changes you make to your web site in the future.
      

    

8. Test your Web site on the Internet

   1. open Netscape Navigator
   2. type www.policy.hu/YourFamilyName/ in the location bar
   3. Viola! your Web site is on the Internet for the rest of the world to see.
   4. Now, keep your web site regularly updated :-)
      

Created Tuesday, 6 June 2001


 
Merrill Oates Oates@policy.hu
Last Modified 15.Mar.2004

URL: <http://www.policy.hu/inetclass/StepstoWeb.html>