>>>
1 |  2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16

1. Getting Started

During this first week of class, we will review the course as a whole and get to know one another and our web design interests. All of us have strengths and weaknesses in our pre-existing knowledge of the web, so the more we know about each other, the more we can learn to rely on one another for help throughout the semester.

This course is conducted on an informal studio model where you actively work on projects during class and solicit help from both me and other students. There will be times when I have to lecture and show the class as a whole certain software routines, but for the most part we will be working on projects and helping each other learn the art of website design.

Setting Up Your ISU Home Page Account

The first thing you need to do in this course is to set up your ISU homepage account, if you have not done so already. To set up your account, first establish a Telnet connection in Programs=>Network Applications under the Windows Start menu. You will need to enter both your Vincent username and password in the dialog screen to establish a connection.

  1. Using your Net-ID and password, login to the following Acropolis page: https://asw.iastate.edu/cgi-bin/acropolis/user/homepage
  2. Click on "Register Home" at the very top of the list and then click the "Register" button on the next page.
  3. You can then log out of Acropolis.

This public server file space will be where you transfer all XHTML files for your projects. In the next step, we'll discuss how to establish a new site in Dreamweaver, and later, we'll learn how to transfer files to your new account using a procedure known as File Transfer Protocol (FTP).

Starting a New Site

Now that you've enabled your ISU server space, we set up a new Dreamweaver site file so you can begin composing files and creating your own site. To do so, follow the instructions below.

NOTE: On your home version of Dreamweaver, you will only need to carry out these instructions once; unfortunately, though, you'll need to repeat these steps each time you work with your files in our classroom. Just make sure you transport the main folder of XHTML and image files back and forth from home.

  1. Download the file 313starter.zip to the desktop.
  2. Right click on the file and extract the folder "313starter" from the zip container file.You will use this folder the next few steps to create a new Dreamweaver site.
  3. Open the Dreamweaver application under the Windows Start menu.
  4. In Dreamweaver's main menu, go to "Site => New Site." This will bring up the Site Definition dialog box
  5. Click on the "Basic" button to begin the Site Definition Wizard.
    6. Site Definition dialog
  6. On the first screen, give the site whatever name you would like. In this example, I have typed in "313Student."
  7. Below that, type in the information as shown, replacing "yournetid" with the first part of your ISU email before the @ sign. Click the "Next" button to advance to the next screen.
  8. On the next screen, select the radio button beside "No, I do not want to use a server technology" and click the "Next" button to advance to the next screen.
    9. Site Definition dialog
  9. On the next screen, define the location of your site files by clicking on the small folder to the right of the input box and navigating to the "313starter" folder you extracted from the zip file in Steps 1 and 2. Click "Next" to advance to the next screen.
  10. On this final screen, choose "None" from the drop-down menu asking about a connection to the remote server. We will establish an FTP connection the site later, but for now, click "Next" to advance to the Site Definition summary page and then click "Done" to being editing your pages.

Basic HTML Tags

In your Castro book readings for this week and next, you'll be learning about some basic formatting tags, such as <i></i> for italics and <b></b> for boldface. These are not that important, as you'll be formatting your text in the future using Cascading Style Sheets.

What are important now are the structural tags such as <h1> and <h2> and <p>, which determine the structure of the text on your page. It is important that you commit some of these basic structural tags to memory early in the course, as we'll be using them more and more in coming weeks. We'll discuss this more in class.

Establishing FTP Access

Now that you've set up a Dreamweaver site, you'll need to establish an FTP connection to the ISU server so you can begin moving new XHTML files over to your live website. As with the site setup procedure, you'll need to do this each time in the computer classroom, but only once on your home machine. To establish an FTP connection, follow these instructions:

  1. First, determine the location path of your Web directory
    1. Using your Net-ID and password, login to the following Acropolis page: https://asw.iastate.edu/cgi-bin/acropolis/fileman
    2. Write down the location of your directory at the top of the window. My own server space reads "Current directory: /afs/iastate.edu/users/19/21/honeyl" but yours will contain different numbers and, of course, a different username.
    Site Definition dialog
  2. Return to Dreamweaver's main menu and go to "Site => Manage Sites."
  3. In the Manage Sites dialog box, locate the name of the site you created earlier and click the "Edit.." button.
  4. Click the "Advanced" button on top of the Site Definition window and select "Remote Info" from the Category listing on the left.
  5. Choose "FTP" from the Access drop-down menu, which will create the window seen on the right. Make sure that you recreate this window exactly as shown, with the exception of Host Directory, which should be your own directory path, and the Login and Password, which you be those for your ISU Net-ID.
  6. Next, click on the Firewall Settings button and type in the information shown in the preferences window below.

    Firewall SettingNOTE: For Windows users, the Firewall Port Number should be just 21 and not the 2021 as shown in this Mac example.

    In campus computer classrooms, the FTP firewall uses an installed program called KFTP to handle secure access to your web server, so all you need to do is type in the numbers as shown below. On your home machine, though, you'll need to download the program by using Scout on Windows machines, or if using a Macintosh, by following these instructions.