CSci 1101 Lab 1. Due Wedn., Feb. 6 at midnight

Goals of this lab:

• Introduction to your computer science lab computer accounts.
• Introduction to the process of editing your files on the server (rynite).
• Introduction to file system and basic LINUX commands.
• Practicing the basics of HTML/XHTML.

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. I can remind you your password if you forgot.
2. Go to the menu Applications -> Internet and find the icon for Firefox browser. Press the right mouse button over the icon and select "Add to launcher". This will add it to the tools panel on top.
3. Start Firefox by either double-clicking on its icon or by typing firefox & in the terminal window. Go to the page http://cda/~elenam/1101_spring08/psets/lab1.html; this will bring you to these lab instructions.
   Note that Firefox may take a while to start so you might want to continue with your work while it is starting up.
4. Go to the menu Applications -> System Tools, choose Terminal and also add it to the panel.
5. Now you need to change your password. Double-click on the terminal icon (that you just added) 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 new password must have at least two different kinds of symbols, such as letters, digits, and punctuation marks. Make sure to remember your new password.
6. Optional: You may also want to change your password on the server 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.

Saving the web page:

1. In your terminal window type cd public_html
2. In the browser go to the web page example http://cda.morris.umn.edu/~elenam/1101_spring08/examples/first_page.html (note that the page name has an underscore in it); view the page source.
3. Type jedit & (all lower case) at the command prompt to start the text editor jEdit.
4. Copy/paste the page source into the jEdit window and save it as first_page.html in public_html
5. Open a new tab in the browser (File -> New Tab) and type in http://rynite.morris.umn.edu/~yourloginname/first_page.html (replace yourloginname with your login name). Make sure the page shows up. Note that it does not have any images yet.
6. At the command prompt create a directory (folder) images by typing mkdir images
7. Save the images from the web page into the directory images
8. Reload the page, check that the images show up.
9. 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).

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:

• Use your textbook to see what tags and options you should and shouldn't use. Don't use any deprecated tags or attributes and avoid physical style tags. Don't use style attribute (I'll explain this later in class).
• Edit the file on your lab machine (in jEdit window). Save the file.
• Reload it in the browser. Holding the shift key while you are refreshing the page tells the server to update all the files used for this page. While it may not be necessary at this point, it's a helpful thing to know for the future, so keep this in mind.
• Check your page using the XHTML validator. If it's not XHTML-compliant, correct the mistake.
• When you are done, make sure to save the file, then go to System -> Log out to log out of the lab machine.
• If there is anything you don't understand or if would like to know more, please ask right away!

Here are some features of the web page that you need to experiment with:

1. Add a paragraph anywhere in the page. The text can be anything, it doesn't have to be related to the topic of the page. Use a strong or em tag for a part of the text inside the paragraph.
2. Add a line break anywhere in your new paragraph.
3. Change the first list in the page to be ordered.
4. Change one of the headers in the page to a different level (say, h4 to h3).
5. Add a a link to any web site. Make sure that your page is still XHTML-compliant (with possible exceptions noted above).
6. Make one of the images into a link (to any web page) by nesting it inside the a (anchor) element.
7. Change the width or height of any image in the page.
8. Set the width and the size attributes of the <hr> element (see p. 114).

CSS features - optional

1. 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.
2. Change the style of the image border.
3. Add formatting of a <div> element (it appears at the bottom of the page)
4. 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 untill midnight on Friday, Feb. 1 to finish this lab. You don't need to submit anything, simply leave your web page on the server. Don't change anything in it after the deadline until you get the grade (by e-mail). 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 the server.

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.