Nav Bars & Making The SE Readable

[ChrisBro]

Hello everyone

I have been playing with my video software agin uh oh sorry

Anyway was just reading another thread about nav bars and alt tags and after asking Dr Google his thoughts it seems that they should be used as Sledger later suggested in the thread, but............. navbars that se's can read seems by general concenus to be the "preferred" option.

SO I was thinking how can this be done, my understanding of creating nav bars in WD or XXP is that the mouse off layer image and text and also mouse over layer image and text need to be soft grouped then the 2 layers need to be grouped in order to make things work? I may be completely off the bat there it is just my understanding of things.

Anyway me being me decided to have a play and came up with a way you can have the text on the mouse off layer readable as text as long as you use web safe fonts it should work fine. Not being a technical genius or html guru I decided to do a short video to seee what you guys think.

THe only layer that is grouped in anyway is the mouse over layer and it is grouped rather than soft grouped, but the mouse off layer consists of background button image that has the link then the text on top none of which is grouped.

ALthough this would make the text readable to the search engine Im still not convinced it would indeed be a safer way of doing things, I have never attached alt tags to nav bars as discussed in another thread I personally think there are only certain circumstances they come in useful, and although the text in a grouped nav bar is not readable the se will will at the link anyhow.

Cant make my mind up if it is of use or not so who better to as than the good people here

See what ya think

Chris

[Drwyd]

I use soft grouping and popup layers for sharp, robot readable menus. The drawback is that it is not quick to put together.

[ChrisBro]

Hi Drwyd hows you?

Crikey impressive stuff, I am going to have to study that a bit to get a better understanding of what you have done there, it looks excellent though, I will try and de-construct and see how you put this together.

Nice work

Chris

[Drwyd]

Doing well mate, hope you are keeping busy

From memory the method is :-

1. Create (off) button and text
2. Create new layer
3. Set (off) button to popup layer on hover
4. Clone (off) button and change colour
5. Move (over) button to new layer
6. soft group both buttons together and point group to target

you will need a popup layer for each button or drop down enjoy

[cursor]

Note that by not grouping the text in your menu system, the mouseover tab assignment to stimulate a popup layer will not work predictably (at least not in Internet Explorer).

With Drwyd's navbar construction style there are 15 popup layers.

Consider instead doing what covoxer recommends, which would result in a more efficient layer structure similar to this:

mouseover_sockets
sockets
mouseover_screwdrivers
screwdrivers
mouseover_spanners
spanners
tools
MouseOver
MouseOff

[Drwyd]

Covoxer's method is easier but Chrisbro is after anchor text to appear in the HTML which does not happen with hard grouping as the button and text is merged into a graphic. Looking into that IE problem now

[cursor]

Take a peek at this example that has no text grouping, yet uses covoxer's recommended structure.

[Drwyd]

Aha your version has anchor text. The only downside is the mouse pointer on hover. Any way to solve that ?

Cant find any problems with the long method, works well in all browsers - although it does not like zooming in Safari

[cursor]

Aha your version has anchor text.

Apparently all text on mouseover layers will use global website link colors (Web Properties > Link tab). There is no way to uncheck the 'Use common website link colors' option box.

Perhaps covoxer can offer some insight. Is it not possible to have a custom colored text link on a mouseover layer?

[Drwyd]

Solved the mouse pointer problem, all items need to be a link, doh but how on earth do you control the mouseover text colour ? It seems I am stuck with the default blue (XWD5)