COMP3400/COMP6340 
Laboratory 4 - Website Design

Note: 2003 Version now available

The aim of this laboratory is to give you experience in designing web sites and critically reviewing existing ones.
  1. Website accessibility:

    For this exercise you will carry out an analysis of the Official Web Site for the Organising Committee for the Athens 2004 Olympic Games, based on that used in the 2000 Games.

    1. Test the english version of the 2004 Games home page using the "Bobby" web-based tool (probably best to use the Advanced Options facility, as it provides the offending line in the HTML source). What were the Priority 1 accessibility errors found?
    2. Read the recommended action for any Priority 1 problems (accessible via the link from the problem identifying text). Return to the accessibility errors and determine what changes need to be made to the HTML for each instance of each error.
      • If you need to determine information about or view specific images on the 2004 Games home page, open the page in a new Netscape window, bring up the Page Info window and select the images you want to investigate.
    3. Compare the 2004 Games home page with the Sydney 2000 page. Which is easier to use? Why?
       

  2. User Attention Spans:

    Read Jakob Nielsen's comments (The Need for Speed) on web page download times. What percentage of Internet subscribers in the US were using dial-up connections (as opposed to high-speed connections) in August 2000?

    Use the NetMechanic tool to generate estimates of the download times of the ANU external web page and the UC web page over a 28.8K modem. Select to check only one page, and choose not to receive a monthly tune-up, and you then need not supply an email address. Be sure to read the detailed report.

    Which page is more likely to keep the attention of users?


  3. Wireless Web Design:

    Use a Structure Flow Chart (see Chapter 1 of Lengel) to describe the design of the Dept of Engineering web site using one page of diagrams. Now examine the HTML of their home page and list the features used which would need to be removed to create a web site suitable for an I-mode wireless device, using cHTML.

    From the design you previously drew, derive an alternate design suitable for small screen devices which use cHTML. [There are no right or wrong answers, but some designs will work better than others. Derive your design, and see how it goes when you implement it in the following exercise.]

    Use Netscape's File->Save As menu option to save the HTML of the Engineering home page to your public_html directory, with the file name engn.html. Check that you can view your copy of the document in Netscape - it should be accessible as something like http://iwaki.anu.edu.au/~u9999999/engn.html (you may need to change the permissions on the saved file); note that the images and most links will be "broken". Now open the file with emacs, and modify it so that it is text only (i.e. remove the images and/or replace them with text), compliant with cHTML, and matches your alternate design suited to small screen devices. You can simulate a small screen device by resizing your Netscape window to about one quarter of its normal size.

    Are images, tables, and fonts critical to the Dept of Engineering's web site design? Use the NetMechanic tool to estimate of the download time of the existing design using a 14.4K wireless modem. Will your design be faster to download? Why? Is it likely to pass the "Bobby" tests? Why?

See also:

This document is Version 1.0 - 13 May 2002: http://www.tomw.net.au/2002/wdlab.html

Comments and corrections to: webmaster@tomw.net.au

Copyright © Tom Worthington 2002.