: How can I make a nav bar thats not boring! Every time I design a new site, I use the same kind of nav bar. As thickish border at the top of the screen, single color, with menu links inside.

@Rivera951

So, as mentioned. This is a little vague. But, I'm going to give you my thoughts on the matter.

I agree that a nav bar shouldn't be so visually interesting that it takes away from the information communicated on the page or confuses navigation or anything like that.
But I don't think there is any harm in a nav bar being a little more than just a bar of colour (depending on the design of course as in some cases aesthetically a bar of colour may work best).

So things to consider to add a little more umph;

Text/Icons/Images

Does your nav bar need to say 'home' when a logo or house icon may be just as effective?
See the nav icons here for an example. These icons of course can be done simply and cleanly in a style that matches that of the site. Depending on the site, a well chosen font might be just as effective if not more. There's a very short point here about simple nav fonts but of course it should be whatever is interesting, matches the style of the site, is not distracting and is most importantly, entirely legible.

Does it have to be a block

As opposed to having colour in a block (/////) as seen in your example, depending on what needs to fit on the nav bar you could add spaces between the colour of appropriate.(/.//.///.////) the . in these brackets representing space and the / representing yor choice of colour/colours. It could also be a gradient, a series of circles, that get bigger as you go along etc. If using several colours don't forget to consider colour theory to get the most out of your choices. There are lots of questions on this site related to colour theory, some of the answers might give you some good ideas.

Texture

I can see in the example that you gave that the colour of the nav bar matches the red of the picnic blanket design further down the page. Why not go a step further and add the texture of the blanket. If done appropriately this could meant consistent cohesion between the site content and the nav bar as well as not confusing the nav bar - just a little extra detail. As the colour of the nav bar depends on the content of the web page, so too would the texture. You might on other sites want to use brushed steel, canvas, wood etc. Texture can add a lot too. Here are some example tutorials for several textures in Photoshop, including, denim, grass etc.

Light/Shadow

When doing design I think that light and shadow are always great to consider,this could really add to your designs particularly if you are using textures, light them up, give them appropriate shadows, they'll look great. I recommend being subtle with this on nav bars because you may not want dramatic light and shadow drawing too much attention. Here light and shadow is discussed, there are also lots of questions related to the topic an numerous resources. You're best off to know what exactly you are lighting to find the appropriate resources for it.

Hope these suggestions help, good luck with your future nav bar endeavours, remember to keep them clear and concise for users, of course with a little umph :)

Vote Up Vote Down