HOMEWORK 2 Due date: January 20, 2006, 23:59:59 Document status: DRAFT Homework 2 consists of three parts: two of them in HTML (frames and tables), the third one is a programming assignment. A. PRELIMINARIES Place all files relevant to this assignment into the respective directories (as explained in the directions for Homework 0). When the assignment is finished, link all pages to the index.html page in your cs101/hw2 directory. B. HTML ASSIGNMENTS 1. Frames (40 pts.) Create frameset with three frames that will display a series of HTML pages in the manner of a picture presentation. The picture pages have already been created for you and are located at http://www.classes.cs.uchicago.edu/archive/2006/winter/10100-1/html/hwks/hw2/villa_adriana_source/ (This is our 'source directory' for this assignment; it can also be accessed from the course schedule webpage.) Your job is to create an HTML frameset as shown at http://www.classes.cs.uchicago.edu/archive/2006/winter/10100-1/html/hwks/hw2/frame_example.html All pages to be loaded into the frameset, including a stylesheet, are located in the source directory. You'll have to inspect link targets of the navigation page, 'villa_adriana_nav.html', and find out how to name your frames so that the pages will load correctly. As 'noframes' option in your frameset page, provide a link to the table-based layout you'll be creating as part 2 of the HTML assignment. 2. Tables (40 pts.) Create a set of table-based HTML pages that mimics the frameset above. An example is given at http://www.classes.cs.uchicago.edu/archive/2006/winter/10100-1/html/hwks/hw2/table_example.html SUGGESTION: You will need six pages. 1. Create a template HTML page with the table frame. Then, add content to top row and navigation column. You don't have to rewrite the content of the frameset pages. Open the banner and navigation pages in your browser and view the source page. Copy the
s that contain the content elements and paste it into the appropriate table cells. Also, copy the element from the source into the head of the HTML template. The background color used in the banner frame of the frameset is called 'maroon' and has the rgb value '#800000'. It is part of the style sheet definition for the banner. In order to add background color, add the attribute class="banner" to the tag that contains the image. 2. The links in the navigation page point to other pages of the frameset. Reset the links to match the files you are going to create. It is best to use a consistent naming scheme: table_start.html table_picture1.html table_picture2.html etc. Don't forget to remmove the 'target' attributes of the links. 3. Save your template, make five copies, and name them according to the naming scheme devised when you set up the links. 4. Now edit new pages and cut and paste the content of the picture files of the frameset into the table-based pages. C.PROGRAMMING (20 pts.) Our first programming assignment doesn't have much to do with programming. Its purpose is to learn how to set up a script so that it runs. The specifications for the script are quite simple: Write a Perl script, called 'first_script.pl', that prints a message of your choice that can be be read in a web browser. a. Find out the path to the Perl interpreter on CS network by typing which perl on the command line. The output of this command must be the first line in your script preceded by these two symbols: #! The first line in your script should look something like this: #!/path/to/perl/interpreter This is a convention on Unix system that passes the script that follows to the interpreter and executes it (provided that the interpreter is at that location). The script will execute two simple lines. The first one must be EXACTLY as stated here: print "Content-type: text/plain\n\n"; It is crucial that the text string ends with two '\n'. These are newline characters that are required by the HTTP protocol. Without them, your message will not appear in the browser. The second should look similar to this: print "YOUR MESSAGE HERE.\n"; Please replace YOUR MESSAGE HERE with a text string of your choice. Save your file. b. Make your script executable so that it can be run from the command line without explicitly invoking the Perl interpreter. While being in the same directory as the script, type chmod 755 first_script.pl You're done. If you now type ./first_script.pl on the command line and see your message appearing on the screen, you've successfully written your first script. The output of the script should look like this Content-type: text/plain YOUR MESSAGE Now, link the script to the index.html page in your hw2 directory, just as if it were a normal html page. If your message appears in the browser window after you have clicked the link, you have completed this part of the homework assignment.