Voyage Feedback Stage 1

I showed my first draft website to a few classmates and my lecturer and got some very useful feedback. As I already suspected I was told that the index page doesn't look very good but the main map page got some good reviews and seems to be good enough to keep as it is. I was told the button image looks very outdated and the header logo doesn't quite fit in with the overall design of the site. My lecturer specifically told me that I should replace the images on the index page with one background image of my world map and create a transition effect between this page and the map page. After the lecture I spent some time resolving these issues as best I could. Here are the steps I took:

• I created a new index page and used a reduced size world map as the background image; this image was made to cover the screen using css.
• I created a new header logo with text underneath. I added a line of css3 code to the word 'Voyage' to create a drop shadow and also a box shadow around the wrapper that surrounded the header.
• I kept the slideshow but reduced the size of the images to make it fit to the right of the logo within the header; the text was floated left and the slideshow was floated right to create this alignment.
• I added a new jquery routine to both of my pages which added a cross disolve between each page; I am very happy with this effect as it looks quite slick. I learned how to do this through an online tutorial which can be found at http://www.onextrapixel.com/2010/02/23/how-to-use-jquery-to-make-slick-page-transitions/

  Here are the three javascript routines I have used on my website so far:

1. Jquery cross-fading slideshow on index page.
2. Jquery cross disolve page transition on index and map pages.
3. Jquery image map scrolling on map page.

Here is a screen shot of the new index page:

At this stage I am happy with the outcome of this project but I will again seek more feedback from other lecturer's and make any necessary changes.