ON-LINE TUTORIAL
Establishing a web site at Bradley University
 

 

Table of contents

 

Basic  Requirements :

1. You must be associated with Bradley University.

2. You must have a login to one of Bradley'’s web servers (hilltop for faculty, students for students, lydia for official Bradley pages). If you do not know, you may look in the ph directory. Type your last name and check "Return all fields." It will return to you all your directory information, including your "alias" which is your login. If you do not have a login, contact 677-2950 to request one.

3. You must have a basic working knowledge of computers. You should be able to use a mouse (click, double-click, click-and-drag). You should be familiar with saving and retrieving files from your computer hard drive or floppy disks. You should be familiar enough with the internet to know what web pages look like and how to navigate from one web page to another in your web browser.
 

Necessary Software to Get Started
 
                   For Windows/PC                               For Mac
QVT\Terminal (or other Telnet software) NCSA Telnet (or other Telnet software)
WS FTP (or other FTP software) Fetch FTP(or other FTP software)
Netscape Navigator or Communicator (or Internet Explorer) Netscape Navigator or Communicator (or Internet Explorer)
 

If you do not have this software, you may download it from the Bradley software repository (for Bradley people only).

Back to Table of Contents

 

What is HTML

HTML (hypertext markup language) is the "code" of the World Wide Web. It is highly recommended you learn how to write basic HTML. A Beginner’s Guide to HTML is specifically written for beginners and is a very good place to start. You may also use your browser to view the HTML source of any WWW document you find. In Netscape choose "View," then "Document Source." This is a great way to "learn by example" what a typical HTML document looks like.

Back to Table of Contents
 
 

Basics of storing your information on the Bradley Web Servers

Your home page must be housed on a web server—not simply a server that provides access to shared resources such as WordPerfect Office®, Word®, or Excel®. Your college or department may maintain a web server and provide space on it to the faculty. However, if one is not provided for you, your home pages will be located on one of Bradley’s central web servers.

The machine names are listed below:
 
"www.bradley.edu"  departmental pages 
"blackboard.bradley.edu" course sites - edit with Blackboard
"hilltop.bradley.edu" faculty and staff personal pages
"students.bradley.edu" student personal pages
 

Faculty and staff have accounts on "hilltop" and students have an account on "students". To publish a new official Bradley web pages on "lydia" you must submit it to the Public Information office. To publish web pages to "Blackboard" you must request a course site be extablished through an online request http://brd106p4.bradley.edu:8100/online/SERVLETS/BbMain.html or contact the Instructional Technology Assistance Center (677-2332).

Web pages housed on the Hilltop server have an address of http://hilltop.bradley.edu/~youruserid (where youruserid is replaced with your Network ID).

Departmental web pages are stored on Lydia and have an address of http://www.bradley.edu/collegeabbreviation/departmentabbreviation. Student home pages housed on the students system servers have an address of http://students.bradley.edu/~youruserid.

If you already have a login on a central campus system for use with E-Mail, but need access for updating departmental web pages, contact the Network Administrators (677-3295 or 677-2958).

Bradley has established certain guidelines for creating official and personal web pages. This page includes links to a template for departmental pages and a site for downloading the official Bradley wordmark, a counter, as well as important considerations when designing a web site.

Back to Table of Contents
 
 

Logging In

Use Telnet (on MAC) or QVT\Terminal (on PC) to log in to your directory. Choose "File/ Open…". When the software asks for "Host", type in the appropriate machine name (listed in chart above). At the login prompt, type in your login. At the password prompt, type your password. If you have never logged in before, your default password is S######, in which ###### stands for the last six digits of your social security number.

Your login automatically opens the correct directory.

If you experience any problems, please call or stop by the Helpdesk in the Library Reserves area, 677-2964.

Back to Table of Contents

 

Establishing a Public_html Folder

Make a directory called "public_html" under your home directory. This is where you will place all of your public files for viewing on the WWW. (You only have to do this once.)
At the prompt,  type :

cd (return)
mkdir public_html (return)

Back to Table of Contents

 

Making Your Directory World-Executable

Make your home directory and the new directory world-executable. (You only have to do this once.)

chmod o+x . (return)
chmod o+x public_html (return)

Back to Table of Contents
 
 

Creating a basic Web Page in HTML

The web servers are UNIX servers. These are the UNIX commands you would type to start making a page in HTML. This example is using the "hilltop" server:
 
Change directories to your public_html folder
cd public_html (return)

Tell the server you are ready to write a file called "index.html" in HTML (using a UNIX editor called "pico")
pico index.html (return)

For more information on "pico" please see this documentation.

This will open a white page for typing your HTML tags and content. Use this format:

<html>
<head>
<title>
              type text to appear as the title of the browser window here
</title>
</head>
<body bgcolor=white text=black>
    <h1>
               type the title of your web page here
     </h1>
     <br>
     <hr>
     <p>
                type your content here
      </p>
      <hr>
 </body>
 </html> When finished, press CONTROL-X simultaneously. Type Y to save the file under the name you gave it initially ("index.html").

HTML reads what is between the "<" ">" symbols as tags. There is an <open tag> and a </close tag>. Tags are closed by placing a forward slash (/) in front of the second tag.

Here is a very basic list of what the tags mean.

html – the file is written in html
head – this is the "header" and does not appear on the web site
title – this appears as the title of the browser window
body – this is the body of the web page
h1 – largest font size (h6 would be the smallest)
br – line break
hr – horizontal rule
p – paragraph All but two HTML tags require a closing tag. They are <br> and<hr>. Most errors happen because tags aren’t closed properly. For more on HTML see A Beginner’s Guide to HTML.

Back to Table of Contents
 
 

Using HTML editors

There are many HTML editors available as commercial software (FrontPage, DreamWeaver, etc.). There is also traditional word procession software that converts documents to HTML (MS Word, Word Perfect, etc.). There are also freeware and shareware available from the WWW. If you choose to create your documents in software such as those listed, you will need to save the files as HTML and then upload them to your directory on the web server.

You will use FTP (for Windows) or Fetch (for Mac) to upload your HTML files, image files or any other files you include on your web site. Choose "File / Open New Connection". Type in the host, login and password where prompted just as you did with the QVT (or Telnet) software earlier. Example:

 
Host hilltop.bradley.edu
ID mylogin
Password s123456
Path
 

Back to Table of Contents
 
 

Uploading a File To The WebServer
 
Once you are logged in to FTP or Fetch, you can upload files from your computer to the web server. Now it should be listed in the window above your files. FTP is a little different from Fetch so the directions are listed separately.

Fetch (Mac)

Open your "public_html" folder by double clicking on the folder. Click "Put File" button. Find the file on your computer. Click "Open" button. Next to "Format:" choose "Raw Data" by clicking and holding the triangle then moving your mouse to "Raw Data". Click "OK". Fetch will then upload your file. You will see the file appear with the date and time it was uploaded.

WS_FTP (Windows)

File from you computer are listed on the left. To change the directory, click the "ChgDir" button, then type in the name of the directory in which your files are stored. Files in your directory on the server are listed on the right. Open your "public_html" folder by double clicking on the folder. (You may go up a directory by clicking on the up-arrow followed by two dots. Then click "ChgDir.") TIP: C:\WINDOWS\DESKTOP will give you access to files saved on the desktop.

Select the file you want to upload from the list on the left. Click the right arrow button to move the file to the server. You will see the file appear with the date and time it was uploaded.

If you experience problems using Fetch or WS_FTP, please call or stop by the Helpdesk in the Library Reserves area, 677-2964.

 Back to Table of Contents

 

Make your files world readable

Login and change directories to your public_html directory by typing the following at the prompt:
        cd public_html (return)

Each time you are ready to make a file(s) available on the WWW, you need to make the file world-readable.
        chmod o+r filename (return)

If you have several such files in the same directory, you can change them all at once just as easily:
        chmod o+r * (return)

Back to Table of Contents
 
 

URLs And Machine Names

You should now be able to access your files through your favorite browser (such as Netscape). The "URL" of each file (the file's unique address on the World Wide Web) will be:

http://machinename/~loginname/filename

For example, consider a user named "xyz" who is using hilltop and has made a world-readable file called "myplace.html" in his

"public_html" directory. The URL of this file is:

http://hilltop.bradley.edu/~xyz/myplace.html

Back to Table of Contents

 

Creating Sub_directories

If you are accumulating a lot of files in the public_html directory, you might choose to organize them into directories. Remember, you will need to make the directories world-executable:

        mkdir newdirectory (replace "newdirectory" with the name you give your new directory)
 
        chmod +x newdirectory

You will also need to make sure any references to those files in your existing web documents are correct. If you move all your images to a directory called "images/" you will need to change the file reference to "images/picture1.jpg" so the browser knows where to look for that image.

Back to Table of Contents
 

 
Using "index.html"

If the name of an HTML file you are accessing over the web happens to be "index.html", you can omit the filename from the URL and it will be inferred. For example, if the user "xyz" from our previous example also had a file called index.html, that file's URL would simply be

http://hilltop.bradley.edu/~xyz/

(Note: the trailing slash IS important!)

Because of this shortcut, it's a good idea to use "index.html" as the filename of the "main" document in each directory you create.

Back to Table of Contents

 

Registering Your Web Site
 
When you feel that your new home page is ready, register it in the ph database: student, faculty/staff. This way, a link pointing to it will be added to the student or faculty/staff list of homepages within 24 hours, and everyone looking there will see that you have joined the community. Official Bradley sites may be linked to other Bradley sites. Please complete this submission form.

Back to Table of Contents

 
 

Created by Barb Kerns, Instructional Technology Assistance Center.
With adaptations from
http://www.bradley.edu/people/help-homepage.html
Last updated: June 3, 2002
if you have any comments regarding this tutorial, please email brk@bradley.edu.