Navigation Research

This navigation bar uses a simple rollover effect that when the cursor places over it, a gradient effect occurs causing a change in colour to give a clear visual representation of where the cursor is and which link is being selected.

This navigation bar uses a simple filled area in which text is overlaid using a contrasting colour to make the links stand out more. These links are made more appealing by the simple use of a small strip of colour at the top which is unique to each link so you can tell the difference between each link. Furthermore, there is also a nice effect underneath each of the link headings using smaller text in a faded colour to give a brief indication of what the page is about and what you can expect to find there.

This navigation bar combines several elements such as images, headings and sub-headings. The idea of combining a simple image with the text gives a simplistic feel to the navigation section thus making it clear and easy to use.

Looking closely at the original images, they are made using a clear white background to make each part clean and crisp giving the whole effect a more professional feel. As before, they use the same idea of using smaller text underneath the main text to give an indication of what you will find on the page and what the page is about. Furthermore, they use a rollover image that changes to a tab-styled finish which is filled with a darkish neutral colour giving a contrast between the link and the background making the link you are hovering over stand out and "pop out" from the rest of the links.

This navigation bar looks very appealing and is VERY eye-catching as you are drawn to this section immediately when the page begins to load. This is achieved by using vibrant colours which contrast with each other giving the indication that each section of the website has its own unique colour scheme thus making them easier to identify.

The links are separated between the sub-links by applying a embossed effect to the background of the heading so that it sinks into the background making it darker thus giving the impression it looks more like a title that an actual link.
Therefore, the sub-links look more like the main links between the pages as they are kept quite simple using a white font colour on the vibrant background making them clear and crisp.

I like the fact that this banner uses a combination of these effects as well as using a computer generated image at the bottom of the navigation section to further make it more eye-catching and appealing as the image uses very similar colours to  those used in each of the sections in the navigation such as the green, blue and the orange.

This navigation bar aligns each of the links vertically up the page instead of using the more traditional horizontal alignment used on most websites. This effect works well here as the links are very simple rollover images with the background slightly dimming when hovered over. I think anything else other than text in this style of navigation bar would look too clustered and unprofessional giving the impression that the website wasn't well thought out at all.

The navigation bar is made even more professional looking by using similar colours used on the page giving the impression that a specific colour scheme is applied to the website.

This navigation bar you can clearly tell was made using Flash and action-script as it animates by slowly moving out and sliding across before sliding back to the right when you are not hovering over the selected link. I like this effect as it makes the site less formal thus making it more appealing to younger audiences.

I like the fact they haven't used any text in each of the links but instead, used a series of white image silhouettes giving associations made with each image and each page. This combined with a series of colours in a spectrum makes the silhouettes stand out from the background this making them more eye-catching and easy to look at.

This effect is very useful as it doesn't require much space usage as the links slide out and back taking up less space as they would really only require a think strip no more than
10-15 pixels wide and the length would be decided depending on how many pages i had on my website.