GDT 150 Design for the Internet

Handout: Using FTP

File Transfer Protocol (FTP) was one of the first protocols developed for transferring documents across a network. Even though it is somewhat slower than HTTP, used for downloading web pages, its stability and reliability make it ideal for transferring large amounts of data. Most software that you download from the internet is transferred with FTP. It is also the best way to upload websites to remote servers.

There are two programs that we’ll use for FTP, WS_FTP and Dreamweaver. WS_FTP has a very traditional FTP interface and process, while Dreamweaver’s FTP interface is somewhat simpler and more streamlined.

In order to post your site, you need to know the following: the hostname/ address of the server where you’re putting the files, your username, password, and the path to your root folder. Often, your username will route you to the correct folder on the server, and you won’t need to know a specific path.

For your class website:
Hostname/ address: stu.wccnet.org
Username: your email username
Password: your email password
The path to your website will be public_html. If you have not created this directory yet, it will not be found. If it’s your first time transferring files, you will need to create this folder.

In order for the website to work properly, you must exactly replicate your site’s directory structure on the server. Otherwise, images will be broken and relative links will not work. Also, your home page must be in the root folder and must be called “index.html.”

To use WS_FTP:

  1. Open WS_FTP. If the connection dialog box doesn’t automatically open, click Connect. Enter the hostname, your username and password. For connection type, choose Auto-detect. This will ensure the connection is the correct type. Click OK.
  2. Your local computer is displayed in the left-hand window, the remote is on the right. The transfer mode is indicated at the bottom, either ASCII, for text files, or binary, for image files. Generally, it’s best to check “Auto,” which will automatically check the data type and transfer in the right mode. Navigate to the local folder that contains your website by double-clicking the up arrow at the top of the left-hand window, and then clicking on the proper folders. If your folder is on the desktop, the desktop folder is located at C:/Windows/Desktop
  3. If you are creating your website on the Washtenaw server for the first time, you’ll need to create a folder called public_html by clicking on the MkDir button on the right side of the window. Type in the folder name, and press return or click OK. Double-click the public_html folder to open it. You’ll need to replicate your directory structure inside this folder. Click the MkDir button to create each directory you need.
  4. Once the directory structure is created, you’re ready to start transferring files. To upload files to the server, or put, there are several options. With the same directory selected on both the local and remote machines, simply double-click each file on the local side to put it on the server. You can also select a file, or multiple files, and click the arrow in between the two windows. (To select multiple files, hold down click on one file, and Control-click on another file to select it. To select a group of consecutive files, Shift-click.) In some versions of WS_FTP, it’s also possible to drag and drop from the local window to the remote window.
  5. To download files from the server, or get, simply repeat the process, but go from the remote directory to the local directory.
  6. When you’re done transferring files, click “Close.”

Other FTP programs such as Fetch and CuteFTP use similar techniques. Dreamweaver FTP is also very similar.

To use Dreamweaver’s FTP:

  1. First you need to enter FTP information when defining a site. In the site definition dialog box, click “Web Server Info” and choose FTP from the drop down box. Then enter the host, path, username and password. Make sure that “Save” is NOT checked on a public machine. Click OK and then Done.
  2. To connect to the FTP server, simply click “Connect” in the site window. The remote files will be listed on the left, local on the right.
  3. To transfer files, highlight a file or files, and click “Get” to download files, or “Put” to upload files. Dreamweaver will even get or put an entire folder at once, creating any necessary folders. You can also drop and drop from one side to the other.
  4. When you’re done, click “Disconnect.”