Assignment 8 (5 pts) - Final (10 points)

Making a Simple Web Page With HTML
Editing it With Composer

return to David's facutly home pages
Name:

CABT 160 - To Be Completed In Class the Day of the Final Under Instructor Guidance.
Click Here for Printable Version
Making a Simple Web Page With HTML Coding in Notepad
Edit the Web Page in Composer


Step 1 - Find Notepad On Your Computer
  • Make a folder on your desktop titled "FinalYourName".
  • Find Notepad on your computer and open it by clicking on "Start":
    left click Start-->Programs-->Accessories-->Notepad
  • Notepad will open to a blank page.


Step 2 - HTML: Create a Page Using unformatted Text and Container Tags

An HTML document has two sections or parts, the Head and the Body. The minimal tags you need for a simple Web Page are:

<html>

<head>
<title>insert a page title here</title>
</head>

<body>

Insert some content here

</body>
</html>

Type the html tags above onto the blank page in Notepad.

Save the page to your folder as: index.html

Preview in a browser according to my instructions now in-class.

Add the following code tag to any one word:

<font color="#FF0000">word</font>

Add the following code tag to any one word:

<b>word</b>

Save the page. Preview in a browser according to my instructions now in-class.

Close notepad.

 

Step 3 - Edit the Web Page in Composer

Follow the instructor's directions and do the following:
NOTE: Be sure to Save the page.

  • Open Composer as we did last week (remember SeaMonkey?)
  • Use either File > Open File on the Composer Menu bar or the Open button on the tools bar to open your FinalYourName folder and open the index.html page you made in Notepad.
  • Add a Table that is one row 600 pixels wide and one column long (width = "pixels" setting, not "% of Window"), turn the border off and put all your content into the table as well as all content we add to the page.
  • Add some text
  • Add an absolute link to a site of your choice (an http:// link)
  • Add a few graphics and Resize at least one of them
  • Change the text font
  • Insert a Hidden Link (aka Easter Egg)
  • Change the page background color
  • Make a 2nd page quickly with just the words "Page 2" on it and make a relative link from each page to the other. (maybe a 2 item "menu bar")
  • Retitle the pages with the word "New:" then your title
  • Insert a horizontal line at the page bottom and insert the © symbol and a sentence claiming this work as yours.
  • Save everything
 
Step 4 - Test the Site in Your Browser and Using CORE FTP client (software), upload your HTML files and Graphic files to a Webpage server

Open your folder and double click your file titled "index.html" to see if your web page works.

For this class, we will use a FTP client called CORE, the HTML server called "webhawks", and a directory for your files called public_html. CORE is a free download. http://www.coreftp.com/

We will upload our website files to the server and be able to view them through any browser connceted to the Internet, anywhere. In other words, your website will be published on the Internet...but almost no one will know it is there or what the URL is to view it because the world hasn't heard about it.
Click here for the Bus89 FTP lesson

Class Demo

These instructions will help you configure and use a campus computer or any computer that has CORE installed on it to upload your website files to our student server called "webhawks".

  • Site Name = webhawks
  • Host/IP/URL = webhawks.org
  • User Name = cabt160 + first 2 letters of first +first 4 letters of last name + last 4 digits of your student ID#: (Your network Account name) For example cabt160daambr1234 for me.
  • Password = your birthday in the form of MMDDYY (110750 for November 7th, 1950)
  • In the Connections Box drop down menu choose SSH/SFTP
  • Click the "Advanced" button then choos e the "Directory/Folder" tab
    • in Remote Folder box type: public_html
    • in the Local Start Folder box type: Y:\Desktop (At home it would be something like C:\Documents and Settings\Desktop OR C:\Documents and Settings\daambros\Desktop)

The URL = http://webhawks.org/~cabt160daambr1234

If you are unable to do this, THEN copy the folder and its contents into My Faculty Turn in folder inside the CABT160 > Turnin > FinalExams folder instead.


When done, if you have any comments then fill in the comments below. Then go to the bottom of the the page and click on the button to email the comments to me.