Peregrine Associates
*
Websites > Buttons

Buttons, Buttons every where!

Navigational buttons are how you get from one point to the next.

There are usually three states to a button that we use:
• standard - this is how a button looks normally
• highlight - the button when you mouse over it
• select - when a button is selected

This helps when you want to pick a specific button in the navigational bar. So, when you mouse over one, it should alter in some manner to let you know which one you are about to choose, then the selected button helps you to know instantly what page you are on. This could be as simple as changing the color of the words to having something ‘light up’ to making the button look pushed in!

Below are several button samples just to give you an idea of what can be done. Of course, you can always visit our client’s sites and see them in action!

 

 Gel Button
This is a COOL button made popular a few years ago. Good for fun sites.
• Standard – as you see it now
• Highlighted – mouse over it, the bottom pushes in and gets lighter
• Selected – pops back out and is lighter than the standard color
 Metallic Button
Looking for high tech? There’s lots of choices to give your buttons that stereo effect. Here’s one way:
• Standard – as you see it now
• Highlighted – mouse over it, the bottom pushes in and the light turns yellow
• Selected – pops back out and the light turns green because now it’s on!
 Simple Button
Looking for plain buttons? Sometimes this works best. Here, the button itself highlights.
• Standard – as you see it now
• Highlighted – mouse over it, the bottom pushes in and the background gets slightly darker
• Selected – pops out and the background is lighter to set it apart from the rest
 Text Button
Looking for even simpler buttons? Here, the only thing that highlights is the text itself. The use of thin lines between each button helps to separate them.
• Standard – as you see it now
• Highlighted – mouse over it, the copy changes color
• Selected – the copy changes to another color, different from the rest so it’s easy to see what page you’re viewing on the web site

 

 

 

Peregrine Associates
PO Box 721 Warrington PA 18976
215.343.2499
Sales@peregrineassociates.com

Copyright 2007 - All Rights Reserved