nav bar help please

Evilreg

Evilreg

Evilreg

Associate
Joined
14 Jan 2010
Posts
134
Location
Humberside uk
hi guys

I have been reaserching different navigation bars and looking for inspiration for a new site im working on. im still very much a noob at all this stuff.
i have found a style of nav bar i like here im not saying i wish to copy it but the desgin does inspire me a bit.

how would i go about creating somthing like this im guessing using an image with hotspots would be bad SEO?

if anyone could point me in the direction of a decent tutorial i would be greatful

is it possible to create this effect using css and html.

im currently using dreamweavercs4 in code view.

im not looking for someone to do this for me just point me in the right direction to create it myself i learn more that way :)

thanks in advance for any comments you may leave.
 
Evilreg said:
i have found a style of nav bar i like here im not saying i wish to copy it but the desgin does inspire me a bit.
Click to expand...
I wouldn't say that's a nav bar as such, more mystery meat navigation, but each to their own.

Evilreg said:
how would i go about creating somthing like this im guessing using an image with hotspots would be bad SEO?
Click to expand...
You're right, the easiest way is to make it as one image and use an area map, although this is very 1998. The alternative is to slice the image to make each clickable area it's own link. Neither of these are very good for SEO.

Evilreg said:
is it possible to create this effect using css and html.
Click to expand...
Not really. The area map can only be done in HTML, and as it's one giant image there's not really much worth doing with CSS.
 
Thanks for such a swift repy Spunky.

The site im working on only has three pages About, Gallery and Contact and when i created a bar style nav bar it just looked daft so i was looking round for inspiration.

With Navbar titles such as the one's mentioned above they are not really what i would descirbe as keywords do you think its worth worrying about the SEo from the navbar ? or have i missed the point somwere.

im still in the messing around in photoshop phase so im im open to suggestions.
 
i just re-read your answer's spunky and i dont intend making a singular image like that site has i just wish to create an image for the header /nav.

just not sure weather im understanding seo correctly.

current thinking is to go down the photoshop and slice method unless its gonna screw my seo completley but with only 3 pages and fairly genereic titles am i really going to benefit from doing it the other way?

very interested to hear peoples opinions on it.

thanks to all for taking the time to read :)
 
of course there is a trade off, but if you make the titles and keywords the same, and have an xml sitemap and do as much seo wise as possible, the penalty shouldn't be that great
 
3dcandy said:
of course there is a trade off, but if you make the titles and keywords the same, and have an xml sitemap and do as much seo wise as possible, the penalty shouldn't be that great
Click to expand...

i do not have much info for the footer of the web site pages so i could do this there good idea

thanks for the input
 
You could definitely do that sort of navigation without having to resort to image maps or Imageready slicefest.

Have the links in a good ol' semantic unordered list in the markup, and then use background images, CSS positioning and z-index manipulation to get them to appear overlaid and 'unordered'.

It's more work, but hey: it's proper :)
 
Last edited:
It's possible to use just HTML and CSS. With CSS3 updates, you could put each link in a div tag then use "border-radius" to make it circular. For background effects, look into "box-shadow" and background gradient. For text, I'm not sure exactly but I know you can make some cool text easily.

Only works with the latest browsers though.
 
hi guys thanks for taking time to comment

im still messing around a bit in photoshop not to sure if im gonna stick with this
what i have so far looks a bit of a mixed bag.

the z-indexing idea sounds interesting but i would be worried about how it would look cross browser.

im not ready to give up the concept just yet but think i need a little more design time on it.

i may even upload a jpg of my design for some advice later when i get in from work. # edit #

thanks again to all that commented
 
Last edited:
ok so below is what im trying to achieve it is a work in progress and at the moment im not happy with some of it.
my intention as it stands is to slice the image and turn parts of it into a nav buttons not great seo i know but i will add a site map to the footer in the hopes of improving it.

i welcome any suggestions

Ashley-textile-art-web-header.jpg


fyi the sit eis for an artist friend of mine but my artistic talents well you can see what there like lol.
 
Last edited:
You must log in or register to reply here.
Back
Top Bottom