Located on the "Current News" page - the item posted on December 2, 2002 - the thumbnail image of the newest Hardwear design links to a new browser window with a description of the item and an enlarged image.

This technique makes it possible for the reader to go directly to the information on the item that catches his attention without having to search through the site for it.

Also, having the item just as a thumbnail on that page makes the load time a lot quicker than if the image were larger.

The Parts Source page is an image map. It allows the reader to click on different hotspots on the bicycle to get close-ups of the parts used in the jewellery.

This allows the reader to learn about bicycles and also see where all the different jewellery parts come from.

I inserted a jump menu on the main Products page that takes readers to each of the different product pages quickly.

I don't really think this feature is necessary because I have a pop-up menu that navigates to each product page in the main navbar and I have a sub menu at the top of all of the Products pages.

I think I may take it out after you mark my site.

My rollover navbar is located on every major page and is the main method of navigation for the site.

Not only is it attractive (the links are all image files that change colour when moused over), but it is large, easy-to-read and it changes from red to light grey when moused over so the reader knows where his mouse is.

My site is full of examples of small-scale layout. For example, each main page has a header that tells the reader where he is. This information is laid out in a hierarchical way: The Necklaces page has a main header that we are in "Products." Then there is a subhead that says we are more specifically in "Necklaces," then there is a pullquote telling us more about the page and then there is a submenu to navigate through the products section. Then I have an introductory paragraph, an explanatory photo and then more info with thumbnails of products.

All of this is predictable and consistent throughout the site so the reader knows what's going on.

The style sheet is consistent, using the same font throughout (Ariel) and sticks to the red/black/grey colour scheme.

I made quite a few different text styles to keep the text visually engaging (for example, I made quotes italicized and red) so it's more fun to read.

Even though there are lots of text styles, I don't think they make it busy, rather, they make the content more interesting and easy to read by braking up blocks of text.

My example of animation is the logo on the home page. On load, it grows from really tiny to its full size through a number of frames.

I think it is cheesey and I will get rid of it after you mark it. Just showing you that I can do it.

Luckily it only does it once.

Some of my testers actually liked it though.

I used Tooltips to annotate the product images that show the different coloured beads available. Tooltips work perfectly on all the PC's I tested it on, but when I tried it on a Mac the other day, the annotation kept opening up on the far left side of the screen.

I think this example of annotation is useful to the reader because if the colours weren't labelled, it would be unclear which colour is which. It is also useful for ordering purposes so the reader knows which colour he is ordering.

I used the flashing arrow links as my example of ready-made javascript. I don't like them and I'm going to take them out. I guess they help the reader by showing him what he is mousing over at the time. But I don't think they're necessary. They're actually kind of annoying.

But there ya go. I can do it.

Look at my swell pop-ups in the main navbar. They allow the reader to see all of the submenus of the site just by rolling over the main links.

This technique gives the reader a clear overview of how the site is set up so he can more effectively navigate. For example, if the popup submenus weren't there, he wouldn't know right away that there are five sub-sections under Products.

• What were your intentions when creating your site—what did you want your audience to do after visiting your site?
  
• I wanted the reader to learn more about the company, be able to order products, be able to contact the company and be able to look at the products.

• Describe your strategy to achieve the audience doing what you wanted.
  
• I made sure to make the navigation really clear and straightforward to make it very easy for the reader to know where he is and where he is going. I used lots of clickable images for the products and made the contact link available on every page. I also made an easily downloadable order form available and gave other ordering options in case that doesn't work for the reader.
  
• I also included a brief but interesting "About" section that allows readers to find out in more detail what the company is about. I made it even more interesting by including an image map that shows the reader where on the bicycle the different parts come from.

• Describe the design problems you encountered and the solutions you tried.
  
• I had a really hard time doing the pop-up menus in the main navbar. I tried making one in a blank test page and that worked, but when I did the exact same thing in my template, it didn't work. I tried copying the exact code out of the test page and pasting it into the template, but that didn't work either. I then asked someone in the computer lab for help, but she couldn't figure it out either. She suggested redoing them her way, which she knew would work. But I didn't want to redo my entire navbar. Eventually I stumbled across the answer. Now I have a great looking pop-up navbar. Yay!
  
• I couldn't make tooltips to work properly by substituting images for text. So I asked you for help and you suggested using the 'open browser window' behaviour instead. So I did. And it worked.
  
• A major design problem was due to the fact that I was trying to be revolutionary. I had the main navbar in the centre with less than half of the page width containing content. The rest was blank space. It looked artsy, but it was impractical and boring because only a small portion of the space was usable. I solved the problem by going to back to the tried and true navbar on the left, content on the right.

• What do you think worked best? Why? (Discuss a specific part of a specific page.)
  
• I really like the way I set up the individual Products pages (The necklace page for example). I used a bunch of thumbnails to show each product and made each thumbnail link to a separate page with a description and enlargement of the piece. That saved a lot of download and scrolling time because if I would have used the full-size image of each product, it would have been a huge page and taken forever to load. If I had only used the thumbnails and not had larger images, it wouldn't have done justice to the products and the web site wouldn't have been a good selling tool.

• What would you like to do over? Why? (Discuss a specific part of a specific page.)
  
• I wouldn't have included animation on the logo of the home page. I think it looks cheesey, it's choppy and it takes a long time to load. I think the logo should be very quick to load (on dial-up), especially on the home page because it's the first thing the reader sees.

• What were the results of the formal usability tests you did with the three different people outside of class?
  
• The formal usability tests outside of class were really helpful because they kept grounding me. I became so attached to the project and I know exactly how everything works, so I didn't always realize that some things were unclear. The reason I put the pop-ups in the navbar is because the simple sub-menu under the sub-header of the pages (for example: Products) wasn't immediately apparent. I kept the sub-menu as a back-up even after installing the pop-ups, however, because I wanted to allow for the possibility that the pop-ups may not necessarily function on every computer.

• What would you like to add that you haven't already said?
  
• I am really pleased with how professional this page looks. I never would have believed that I could do this - not even at the outset of the project.