CSci 1101 Lab 1. Due Friday, Feb. 2 at 10pm

Goals of this lab:

Tasks for the lab:

  1. Log in to a lab machine. Use the same login that you used for the blog. The password is the same as your initial password for the blog
  2. First thing you need to do is to change your password. Double-click on the terminal icon at the top of the window to open the command prompt window. Type passwd. You will be asked to type in your current password and then your new password twice. Your password must have at least two different kinds of symbols, such as letters, digits, and punctuation marks. Make sure to remember your new password.
  3. You may also want to change your password on rynite (alternatively you can reset it later through WinSCP). To do this: in the same terminal window type ssh rynite. If a message appears warning you that authenticity of the server cannot be established and asking if you would like to continue connecting, answer "yes" (not just "y"). When prompted for a password, type in the same password that was given to you in class. After you connect to rynite type passwd again and change the password to a new one (it may be the same one that you use on the lab machines or a different one). Type logout when you are done to quit ssh.

Uploading the initial web pages:

  1. Start the browser by either clicking on its icon or by typing firefox & in the terminal window.
  2. In the browser go to the web page example http://cda.morris.umn.edu/~elenam/1101_spring07/examples/first_page2.html (note that the page name has an underscore in it); view the page source.
  3. Start jEdit text editor: go to the Applications menu, choose Programming, and then choose jEdit. If it's not in the application menu then type jedit (all lower case) at the command prompt.
  4. Copy/paste the page source into the jEdit window and save it as first_page.html in your home directory
  5. Open the file http://cda.morris.umn.edu/~elenam/1101_spring07/examples/first_style.css in the browser, open a new file in jEdit, copy it there, and save as first_style.css, also in your home directory.
  6. At the command line create a directory images by typing mkdir images
  7. Save the images from the web page into the directory images
  8. You might want to check that all files are in the right locations by using "Open File" menu in Firefox and opening the file first_page.html. It should look exactly as the page you were viewing before.
  9. Upload the file to the server by typing (in the terminal window) the following commands:
  10. To upload the folder images into your public_html on rynite, you need two to use two sftp commands:
    Check out more sftp commands if needed.
  11. View your page at http://rynite.morris.umn.edu/~yourloginname/first_page.html (replace yourloginname with your login name). Make sure the page shows up as it should.
  12. Validate this page by copy/pasting its URL into XHTML validator. Caution: the URL should contain the full domain name of the server: rynite.morris.umn.edu (using just rynite would work for viewing pages in the lab, but will not work in the validator). If you get an error message pointing to the link tag, put quotes around stylesheet.

Changing the web page

In this part of the lab you are asked to experiment with the given web page. Please feel free to change other things as well, the more you experiment - the better. However, you need to follow these guidelines: Here are some features of the web page that you need to experiment with:
  1. Change the first list in the page to be ordered.
  2. Change one of the headers in the page to a different level (say, h4 to h3).
  3. Add a paragraph that has the following: two different content-based tags (<cite>, <dfn>, or any other ones) and a link to any web site. Make sure that your page is still XHTML-compliant (with possible exceptions noted above). The text can be anything, it doesn't have to be related to the topic of the page.
  4. Make one of the images into a link (to any web page) by nesting it inside the a (anchor) element.
  5. Change the width or height of any image in the page.
  6. Set the width and the size attributes of the <hr> element (see p. 114).
  7. Use CSS file to change formatting of any type of a header. you may change color or font properties. Make sure that your change shows up on the page.
  8. Change the style of the image border.
  9. Add formatting of a <div> element (it appears at the bottom of the page)
  10. Add a style for a:active, it should take place when you are slowly pressing the mouse button on a link.

How to submit this lab

You have till 10pm on Friday, Feb. 2 to finish this lab. You don't need to submit anything, simply leave your web page on rynite. Don't change anything in it after the deadline until you receive the grade. If you would like to experiment with HTML further, simply make a copy of the HTML file with a different name and upload it to rynite.

If you have any questions, please come to my office hours or e-mail me.


This page is a part of CSci 1101 course web site.

The views and opinions expressed in this page are strictly those of the page author. The contents of this page have not been reviewed or approved by the University of Minnesota.