Dropdown menus: Good Practice?

[(Pete Cresswell)]

How does this site's menu implementations stack up good-practice-wise?

http://www.wcasd.k12.pa.us/

Although I can't find "About Us" anywhere in the HTML, the code behind the first
dropdown ("About Us") seems TB this - invoked by a MouseOver later on:
----------------------------------------------------
<SCRIPT language=JavaScript>
<!--
function mmLoadMenus() {
if (window.mm_menu_0521134046_0) return;
window.mm_menu_0521134046_0 = new Menu("root",160,15,"Verdana, Arial, Helvetica,
sans-serif",10,"#000000","#02457a","#E7E7E7","#ffffff","left","middle",2,0,500,-5,7,true,true,true,0,true,true);

mm_menu_0521134046_0.addMenuItem("Overview","location='http://www.wcasd.net/about/about_main.htm'");
mm_menu_0521134046_0.addMenuItem("Community
Involvement","location='http://www.wcasd.net/about/com_involve.htm'");
mm_menu_0521134046_0.addMenuItem("New Student
Registration","location='http://www.wcasd.net/about/stud_reg.htm'");
mm_menu_0521134046_0.addMenuItem("Strategic
Plan","location='http://www.wcasd.net/about/strat_plan.htm'");
mm_menu_0521134046_0.addMenuItem("Assessment
Data","location='http://www.wcasd.net/about/access.htm'");

mm_menu_0521134046_0.addMenuItem("Budget","location='http://www.wcasd.net/about/budget.htm'");
mm_menu_0521134046_0.hideOnMouseOut=true;
mm_menu_0521134046_0.bgColor='#999999';
mm_menu_0521134046_0.menuBorder=1;
mm_menu_0521134046_0.menuLiteBgColor='#999999';
mm_menu_0521134046_0.menuBorderBgColor='#ffffff';

 

[Fernie]

Hi Pete,

I cannot answer your question but I am really interested in working on some
javascript menus soon.

Can anyone recommend a good editor for that generates the javascript for
you? My html editor generates some javascript but nothing in regards to
menus.

Thank you,

Fernie

 

[Noozer]

The whole site is pretty much a pain... Too small to read and wastes most of
the space in my browser with unused space.

 

[David Dorward]

How does this site's menu implementations stack up good-practice-wise?

http://www.wcasd.k12.pa.us/

+ They have regular links for when JS isn't available.
+ Menus don't vanish the moment the mouse leaves them

So better then most.

However ...

- User decides to visit "About Us", moves mouse, clicks, notices new menu
appearing (i.e. drop down menus at all are a generally bad idea)
- Regular links are images (worse, no alt text)
- Invalid markup
- Cursor doesn't change to indicate menu items are clickable
- Small target areas due to tiny font size
- Menus don't open when tabbing

 

[Beauregard T. Shagnasty]

How does this site's menu implementations stack up good-practice-wise?

These kinds of menus are one of my pet peeves.

Being right-handed, the mouse cursor is usually toward the right side
of the page. Well, that's where the scrollbar is. Ok, I've read the
page and I move the mouse over and up to the left to click the Back
button, and three or four of those dang menus fly out at me. Really
irritating.

I heartily recommend you do not use them.

 

[(Pete Cresswell)]

RE/

+ They have regular links for when JS isn't available.
+ Menus don't vanish the moment the mouse leaves them

So better then most.

However ...

- User decides to visit "About Us", moves mouse, clicks, notices new menu
appearing (i.e. drop down menus at all are a generally bad idea)
- Regular links are images (worse, no alt text)
- Invalid markup
- Cursor doesn't change to indicate menu items are clickable
- Small target areas due to tiny font size
- Menus don't open when tabbing

Thanks.... that's the kind of info I was looking for....

 

[rf]

These kinds of menus are one of my pet peeves.

Being right-handed, the mouse cursor is usually toward the right side
of the page. Well, that's where the scrollbar is. Ok, I've read the
page and I move the mouse over and up to the left to click the Back
button, and three or four of those dang menus fly out at me. Really
irritating.

I heartily recommend you do not use them.

Check the one here, from the next thread, "Select menus above flyout
menus?":
http://southernpine.com/joinlocator.shtml

Lots of fun can be obtained by mousing up and down the menu and watching all
the menus busily slide in and out

 

[(Pete Cresswell)]

RE/

I move the mouse over and up to the left to click the Back
button, and three or four of those dang menus fly out at me. Really
irritating.

Just tried it...I see what you mean.

 

[(Pete Cresswell)]

RE/

I heartily recommend you do not use them.

How about a tree-view scheme - where main topics appear in a vertical list on
the left of the screen with a little plus sign on each one that has child
items?...where clicking the menu item expands the children into view until it is
clicked again....i.e. they don't just automagically expand or contract...so if
the user expanded all of them, they'd all stay that way?

 

[wizard]

RE/

How about a tree-view scheme - where main topics appear in a vertical list on
the left of the screen with a little plus sign on each one that has child
items?...where clicking the menu item expands the children into view until it is
clicked again....i.e. they don't just automagically expand or contract...so if
the user expanded all of them, they'd all stay that way?

IMHO it is even worse. At least most of the menus work on mouse-over.
Try to avoid both.

 

[(Pete Cresswell)]

RE/

IMHO it is even worse. At least most of the menus work on mouse-over.
Try to avoid both.

What's the answer then?

Always expose the entire heirarchy?

If so, is there a commonly-accepted way to do it concisely? (e.g. little lines
to children with the children indented maybe a couple pix...if so, how to draw
the lines? .BMP images?)

 

[Beauregard T. Shagnasty]

Check the one here, from the next thread, "Select menus above
flyout menus?": http://southernpine.com/joinlocator.shtml

Lots of fun can be obtained by mousing up and down the menu and
watching all the menus busily slide in and out

<LOL> Reminds me of the inside of a piano!

 

[C.W.]

Hi Pete,

I cannot answer your question but I am really interested in working on some
javascript menus soon.

Just remember that JavaScript menus are relient on JavaScript enabled
or the environment it is 'encountered' with - such as search engine
spiders can handle some javascript but not all ... so may not be able
to follow the links shared in a javascript menu. They can't follow the
links? They can't find and index those linked pages either then.

So always provide an alternate method of navigation.

Can anyone recommend a good editor for that generates the javascript for
you? My html editor generates some javascript but nothing in regards to
menus.

There are several free script sites that offer these kind of scripts
too. Someone just posted some links to 3 or 4 drop down menus from one
source in the psat week in another thread.

Carol

 

[Blinky the Shark]

Being right-handed, the mouse cursor is usually toward the right side
of the page. Well, that's where the scrollbar is. Ok, I've read the
page and I move the mouse over and up to the left to click the Back
button, and three or four of those dang menus fly out at me. Really
irritating.

Not about code, but two words: mouse gestures.

I just removed the back/forward buttons from my main toolbar.

WRT dropdowns, one site I frequent has two rows of them at the top of
the content part of the window, below the logo'n'stuff at the very top.
One is essentially for the whole site, and the one below it is for the
section the user is in. So if you happen to mouse down and pass over
the top row of dropdowns, one of them expands and covers part of the
bottom row, and it's usually the bottom row (the section-specific one)
that the user is interested in -- that's why he's in that section.

http://www.sportsline.com/collegefootball

From up in your browser's toolbars/menus), try and click the "Stats"
button on the second row.

 

[Fernie]

Hello Carol,

Thanks very much for your advise.

Best regards,

Fernie

 

[Hywel Jenkins]

Hi Pete,

I cannot answer your question but I am really interested in working on some
javascript menus soon.

Can anyone recommend a good editor for that generates the javascript for
you? My html editor generates some javascript but nothing in regards to
menus.

http://software.xfx.net/

Learn to quote properly, too.

 

[John McGaw]

RE/



What's the answer then?

Always expose the entire heirarchy?

If so, is there a commonly-accepted way to do it concisely? (e.g. little lines
to children with the children indented maybe a couple pix...if so, how to draw
the lines? .BMP images?)

I'm not claiming that my design is a good example for anyone to follow
but simple indenting is the most recent scheme I've worked on. An
example of the hierarchy can be seen readily at
http://johnmcgaw.com/furniture.html . Sadly the way I implemented this
is extremely clumsy and error prone during composition so I will be
trying to clean that part up on the next go-round. And I'll get rid of
the ugly colors and clunky "buttons" too just in case anyone was going
to point them out to me.

 

[(Pete Cresswell)]

RE/

http://johnmcgaw.com

At the moment, I'm not getting through from here.

 

[John McGaw]

RE/



At the moment, I'm not getting through from here.

Dunno. Site is up now and was up earlier this AM between coffee and
walking times. Guess there could have been some sort of a glitch when
you tried.

 

[(Pete Cresswell)]

RE/

Guess there could have been some sort of a glitch

Got it now.

Wow. What tool are you using to generate that HTML...or are you doing it by
hand? And just to give me a little foot in the door, is TheImager.js something
you wrote or something that's available publically?