graphics for the web online, CIS58.53B

1 2 3 4 5 6 7 8

CLASSMATE'S ROLLOVER SURF EXAMPLES

| A | B | D | F | H | M | R | S | W

Joseph Abouata

http://empirewrestlingfederation.com/main.html

The web site uses a simple layout with primarily orange and black colors. The rollovers loaded very quickly, and the on rollover state was used very cleverly. When the rollovers were off, they were darkened; but, when rolled over, the buttons became slightly larger and lightened. Navigation was no problem, the only flaw was that this site is too simple with the graphics layout.


Sebastian Amiet

http://www.mtv.com/

i like this rollover at the top left because its clean and gives the right information without losing the overall view of the site layout. it was really easy to navigate and it the download time on dsl was extremely quick.
this site is cool and has 1000s of info.


Angie Barragan

http://threeinabox.com/artists.html

In this site, when you roll over the names of the artists, a remote rollover appears showing pictures of their work. I thought this was very appropriate for an artist‚s site. The only thing I don't like is that it took forever to download. The navigation is very easy. You just click on the name of the artist, and it takes you to his/ her portfolio. On each individual page, there are little thumbnails of the artists work and when you roll your mouse over them, a bigger version of the example appears.


Ray Bernard

http://www.lincolnvehicles.com/vehicles/interior.asp?sVehi=nav

I enjoyed this site because it has several rollover navigation bars and lots of "eye candy". There are several rollovers on the navigator image. Also several more buttons can change the picture. I enjoyed the color button.
I think this was done in flash and it took a long time to download on a dial up modem. The navigation was well done with the main bars on the top page and 2nd level buttons on the left side.


Sue Bianchi

http://www.ucrh.org/

This site has a very simple „look‰ with interesting rollover navigation. The three levels (communities) giving you the option to bypass a second level going directly to your choice of communities. Below the main navigation is a summary. I think it loads quickly (I have cable so it‚s difficult to tell on a 28k modem).


Karen Dias

http://disney.go.com/park/bases/playhousebase/today/flash/index.html

The Playhouse Disney rollovers are great and very well done for kids. There is a lot going on with animated things moving when you rollover links. It is very visual for kids, especially those who can't yet read. My 3 year old knows exactly what to do and where to go and how to get there because of the simplicity of the rollovers. As well there is sound that keeps their interest.

Robert Forde

http://www.pga.com/

I chose this rollover site because of my interest in golf. I liked the simplicity of using the underline to create the rollovers. It loads quickly; it's easy to create; and it is very clear, especially when you get into those very small areas of navigation on the sides of the page. I found it very easy to use.


Kim Hall

http://keenphoto.com/index.html

This is on of my favorate sites. It belongs to a good friend of mine. I thought it would be a good site to show use of remote rollovers. Enter the site by clicking the main picture or the enter link. His use of the frameset with the remote rollover makes for easy and clean navigation.

I like the way he not only changes the color of the link in the rollover state, but also shifts the link to the right, then has a simple yet discriptive box explaining where each link takes you. I like the way he set this text in white, for contrast.

Take a bit to look around. What a terrible job he has huh? Believe me he loves every minute of it! David used to go to our SRJC, you'd never see him without a camera in hand.


Carol Ho

http://www.marvel.com/

I think the rollovers used in this homepage is pretty neat and high-techie and they stay open until you roll over to another button. When they are rolled over, the menu comes out in a flash. They work nicely and very appropriate with the site since site is about hero action comic books. It's very easy to navigate. What troubles me about this fashion is that when a button has no rollovers, it reveals a pink color, which is also the color of the buttons with rollovers. Very misleading...they should have a different button color to indicate they don't have rollovers. Yes, and with a 56k modem, the rollovers added a little download time, like a good 5-10 second to load.


Paula Molnar

http://www.wolvesburrow.com/ODclassic.html

This is absolutely one of the coolest sites I have ever seen regarding rollovers and buttons! If you visit it, please be sure to roll over each button to see what it does. It is very amusing and entertaining. Although primarily a Flash site, the use of rollovers is done well. The buttons do not detract and in fact add to the excitement of the site. The site loads fast, in DSL, and runs quickly and smoothly at all levels. Have fun!


James O'Brien

http://www.vmware.com/

VMware uses a small rollover along the top of the screen. The rollover integrates nicely with the layout of the site. It matches very well with the color scheme and has a professional look to it. It uses small images that won?t add much to the page download time and is easily navigated. It has the same form as text based hyperlinks would and this type of navigation is used commonly as text. I found this to be a good example because it has an interesting look to it.


Richard Rebischke

http://foxsports.lycos.com

I like this one, foxsport.com as it had a good sample of remote rollovers in the top navigation area. When rolling over the navigation gold buttons on top, They will changes to black type with white background sub navigation area. They pop up under with active links and turns to gray that makes it easer to see. All but two have remote rollovers with information. It makes it easer to get around the web site with good remote rollovers. Have a good day. Rickbythelake(:>)


Preston Reyes

http://www.k2snowboards.com/newsite/Gear_boards.asp

What I though t was really impressive about these remote rollovers was the rapidity with which they changed and the perfection of their placement. Each one lined up so well with where the previous one was layed out. I sam assuming the preloaded the images because the swith over is so instananeous. Also, it just plain makes sense, to have a close up without actually changing pages. Nice Work I felt.


Katherine Stasinski

http://www.naeyc.org/default.htm

I chose this site because NAEYC is a professional organization and I liked their home page. Their navigation bars on their home page are very similar to what we've been doing in class (color overlay on rollover). I see that they also chose not to do persistent rollovers! Their home page rollovers work well with the design (not distracting) and there is ample space to display the additional information made viewable by the rollover.

However, navigation on subsequent levels were not as easy to determine where you are. For example, on the home page I clicked on the "Children's Champions" link. It took me to a page that was clearly "Children's Champion" (name in the title bar, same name in the heading, and also the top link of the navigation box at the left of the page). The weird thing is that the "Action Center" link (on the left of the page) is always highlighted, which would make me think that I'm always on that page, rather than the current page being hightlighted. If I click on the "Federal" link, I go to the Federal page ( as reflected in the title bar and in the heading), but the "Action Center" link is still highlighted (which translates more strongly to me that that is where I am rather than where I really am!). I think it's always highlighted to "call you to action" and not to give you an additional indication to where you currently are on their site.

If I click on the "Affiliate Relations" link on the home page, subnavigation again displays but nothing is highlighted on rollover (just "underlines" showing that it's a link), and the same goes for when you click on another link in the sub menu. I think it would be better with a color overlay in the navigation on the additional levels showing where you currently are. The rollovers didn't seem to add any additional time to the download time.


Kent Ward

http://www.3dreality.net

This site has some really nice looking rollovers. The site is for a company that does 3-D animation, and their website looks like it uses state of the art animation techniques. The navigation rollovers are pretty amazing. You want to use the links just to watch the rollovers. There is some pretty busy and distracting stuff going on until you move the mouse over a link to start the rollovers. That alone makes you want to start navigating. This is a cool site that is definitely worth a visit.


Anabel Werner

http://www.tufenkiancarpets.com/tufenkian/home.html

Tufenkian Carpets

I chose this really wonderful website by Dan Miller Design of NYC. It's one of my favorites.

A mouseover on the 'Home" and "What's New' links on the main page bring a short, delightful and non-repeating bit of ethnic music perfect for the site's subject and the mood; that also brings explanitory text which comes into the spot as an animation (simply the words traveling in.) The other links below those two bring in remote text in the same way but with no more sound. This is using 'a light touch.' It would be TOO much to have the sound every time. The site is rich in color and sophisticated web tricks, but subtle and restful by blocky, simple, clean, consistent design.

Other links again have sound. It is integrated perfectly with the whole and very easy to navigate.


instructor:
Corrine Haverinen  voice mail: 707.527.4999 X9206
e-mail:
haveart@sonic.net

top | home | start here | syllabus | homework | grading | message | instructor
lesson 1 | lesson 2 | lesson 3 | lesson 4 | lesson 5 | lesson 6 | lesson 7 | lesson 8


© 2001-2002 Linda Hemenway and Corrine Haverinen All Rights Reserved.
Designed and edited with permission by Corrine Haverinen.
This site is prepared for CIS 58.53B Designing Graphics for Web Pages students,
Santa Rosa Junior College, California. Reproduction in whole or in part in any form or medium without written permission is prohibited.