Design 1 

User Guide:
Begin from tour.html, which is the overviews page.


Fixes Completed:
-All errors mentioned in errorLog.rtf
-Images modified
  *catalogs.jpg
     Changed the zoom view to a catalog image.
  *froogle.gif->froogle.jpg
     Changed the zoom view to a spa image.
  *images.jpg
     Added a blue background to the zoomed in image.
-Images created
  *Lucky.gif
     Main image for "I am feeling lucky" section.
  *toolbar.gif
     Main image for "toolbar" section.


Additions:
-Images:
  *art.gif
     Downloaded from Google's search tip site.
  *bluearrow.gif
     Downloaded from Google's search tip site.
  *bluearrowL.gif
     Modified left arrow.
  *Google_sm.gif
     Downloaded from Google's search tip site.
  *s.gif
     Transparent gif used as space holder
-style sheets
  *Google.css
     Downloaded from Google's search tip site.


Design Note:

The Google tour webpages in this design are intended to be added into the Search Tips section under Site Map.  Hence, the search template is used along with the Google style sheet.

To give the UI more of a "tour" feel, individual webpages are created for each section for easy navigation.  User can navigate both by the left-nav or the "back" and "continue" arrow buttons. The buttons should be stationary regardless of window size, except for the last page, more.html.

Since not much content is presented in each section/page, the width size of the main table is limited to 80%, with minimum size enforced by using the space holder, s.gif. Minimum table width is set to 650px.



Pros:

-Can be easily integrated into the current UI.

-Everything designed along the search template, except for the table width (which is set to 80% instead of 98%).

-Easy maintenance, since each section has its own html page, and a place on the left-nav bar, additions and/or manipulations to individual sections can be done efficiently for website maintenance.


Cons:

-Not much content on each page, so require the user to click more often.

-The tour.html page has three competing headers.

-Nav button (<<back) jumps on the last page (more.html).