drop down menus

[griever]

How do you feel about drop down menus?  Not the form option ones, but the DHTML/CSS ones, like this, but without the submenus.

I'm thinking of switching over because then everything on my site would be 2 clicks away, instead of 3 clicks....

[Xepher]

As with most things, use what's needed/useful, not just what's shiny. If you've got a lot of stuff, that makes sense to organize in terms of menus, then they're great. If you've got only 4 sections to your site or something, trying to do dropdown menus is just a waste. Form should follow function.

[griever]

I've avoided drop down menus because they've seemed too shiny.  I have 4 sections, actually, but each section goes deeper (or will eventually).  Right now, I've got breadcrumb trails holding everything together, plus an overall main navigation strip, but I find personally that I end up going back to the main navigation and starting from the beginning when I move between actual content.

[Databits]

I disagree. Shiny is very very nice, so long as it works.

Drop down (DHTML) menus are extremely common now days, and from a professional standpoint, very useful. As for "compatibility" for those morons still running shit like Netscape 5, IE 4, text browsers, etc... well they can just get bent. It's 2007, time to upgrade. Heck MS won't even push new updates to your windows system in anything under IE 6 anymore, so that should hardly be an issue.

So, shiny is totally, completely, 100% safe to use. Just make sure to test it with older browsers if you can, and if at all possible, avoid writing your own JS for it, use an existing lib with a nice small footprint. I'd suggest jQuery and some of it's addon's for something like this.

Web design is all about the look now days. Especially when you have a product you want people to know about.

There's my $0.02.

[reinder]

Two clicks instead of three is worth it regardless of the shiny. Make sure that the most important things are 1 click or zero clicks (i.e. on the front page, especially if you have a webcomic), though.

DHTML/CSS has become really good in the past few years, usability-wise. Of course, AJAX has brought us many infuriatingly unusable designs. I don't agree that websites these days are all about the looks - functionality is more important than shininess if you want people not to hate you. But it HAS become easier to accomplish both.

[griever]

All the most recent stuff is 1 click away from the front page.  It seems to also help Google index my stuff.

Thanks for the input, guys.  I'll play around with it this weekend and see if something decent emerges.

[griever]

Okay, so a weekend turned into a couple weekends, but I have the general layout up and I'm curious to see what you all think of it.  I also experimented with making the menu backgrounds moderately transparent (about 90%), but didn't like that so much. 

One of my immediate concerns it that one of the menus covers up the gray recent updates box, but without disregarding the 800x600 screen resolution, I can't think of any other solution. 

One of my friends suggested getting rid of the recent updates box, which appears on every page, and just making it a 50/50 recent updates/news on the front page.  I'm not sure...I've had this format for a long time (recent update box) and to me, it would just seem weird without it.

Anyway, if you all have some free time, please let me know your thoughts.  Thank you!

http://griever.xepher.net/test/index2.php

[Databits]

Looks good and clean, however...

I'd make it so that the actual menu category changes color as well as the menu opening to make it completely obvious what one they're under.

Don't remove the recent updates box unless you have something else to replace it on other pages. Granted there are sites out there that use a completely separate front page, but they also do just that... use a COMPLETELY separate front page which usually differs a lot more than having one or two things changed.

The menus break under IE6 in higher resolutions. For some reason the last menu is wrapped to the next line instead of being next to the rest, regardless that there's enough room for it. This issue also happens under IE7.

Also under IE6 and IE7 the menu that's wrapped does funky move around stuff when you open other menus. In addition, the menu close timeout acts kinda funky as well, and due to the menu doing the funky moving thing, you are unable to really navigate it in IE6/7

[griever]

Ah, yes, I had planned on either using colored text or an image for the menu categories.  I just haven't gotten around to it yet.  But no worries, the navigation will be a bit clearer in the end.

I ran the page through Netrenderer (http://ipinfo.info/netrenderer).  I checked it for IE6/7 prior to adding the content sections and it worked then, but there must be something in the content sections that are messing the menu up.  I'll try to fix that tonight or tomorrow, because I think it might also clear up the funky moving/opening/closing stuff.  But I have to go to work now.

Thank you!

[Xepher]

Dang it, accidentally his close when trying to unmaximize (so I could view quasi-800x600.)

Anyway, I think what I was saying was that you could either make the menus smaller, so they don't span the entire page. It leaves a LOT of empty space on moderate to large resolutions. That the menu pops over the updates box isn't a huge deal, except that the box lines up exactly under one menu, so it looks like it belongs to something separate from the rest of the page content (which is covered by menus too.) You could make the box narrower or wider, so it didn't match the menu, then it wouldn't feel quite as weird. Alternately, and the one I'd probably go for (because I love symmetry) would be to make the "Recent Updates" span the whole top of the page. The actual updates on the left of the box, and then your affiliate logos over on the right. Then ALL menus would cover the box, and it would feel uniform.

Otherwise, I think it all looks pretty sharp, and it works just fine in firefox 2 under linux. Can't say for IE though.

As a side note (and as noted in another thread) I really should redesign the newsbox...

[griever]

Thanks, Xepher!  I'm also using Firefox on a Mac and it show up fine too.  *kicks IE*  I like your idea for the recent updates box.  I'll try that, and moving it may also fix the weird IE menu bug as well.  I'm also a big fan of symmetry.

[Databits]

Even on a Mac you could run a VM. The only reason I can test it under IE6 and IE7 is because I have Win98 running in a VM on my system and IE6 in it.

[griever]

Okay, I think I've managed to take care of the problem of a lot of things.  I took into account Xepher's idea of not having the menus be so large and at the same time, it solved the "recent" box weirdness problems.  I also searched around for an alternative method, as Databits was having problems with sticky menus, and I think I've gotten it fairly good.

I'm not quite sure what menu style would be best though.  If you mouseover the various menus, the 1st, 2nd, and 4th are all different.  I like the 1st one because it brings more color into the site, but I like the 2nd and 4th because they blend more with the top bar.  Any thoughts?

http://griever.xepher.net/test/index2.php

[Xepher]

2nd menu style... symmetry all the way.