

Paradeiser – An Alternative to the Hamburger Menu - quaffapint
http://lucidlemon.github.io/paradeiser/

======
SchizoDuckie
Please, don't make me resize my browser for a demo, add a screenshot.

This implementation works very nice for sites that have like 6 menu items, but
the reason designers _loved_ these fricking hamburger menus is because they
could stuff a shitload of content in there.

Sidenote: position:fixed still doesn't always work properly on mobile, plus a
navigation bar should really be at the bottom of a page for thumb-
accessibility (but that's just a matter of tweaking some css, ofcourse)
Sidenote2: Why do you hide it on desktop? Mystery meat!

Good work, keep the initiatives coming!

~~~
danielwinter
Hey, dev here.

Well, there is a screenshot right at the greeting :)

Yes, this implementation is focusing on 3-5 pages on your website - which is
mostly enough for like 90% of all common sites. And if you need more for less
important stuff like Terms of Service, FAQ or anything you could imagine,
there is still an overflow button, which is kinda like a hamburger menu, but
at least you have a few items without clicking a second time - and you see
them instantly. On a usual hamburger menu you can't even see your options
without opening it, which increased my bounce rate on gaumengut.at by 80%.

I noticed that position:fixed is a bit awkward when pinch-zooming on mobile,
but what are other and better alternatives? I primarily wanted to make it as
easy as possible so that it's just a drop-in solution, without further code.
Hence why I positioned it on the top instead of the bottom, it's easier to
implement using pure css and without forcing the user to change his DOM too
much.

I hide it on Desktop as I primarily wanted it to be a mobile navigation. The
font size is too small for Desktops (distance to the display, mostly non
retina...), but a desktop version is planned.

Thanks a lot for your feedback!

------
rspeer
Hey look, it's a menu that's actually useful for understanding what's on the
site and navigating it. Nice.

Given that, wouldn't it be better if the menu were always visible? I had to
resize my browser window to be tiny to even see that it was there on the
Paradeiser site (and not just in the screenshot).

~~~
danielwinter
Thanks a lot!

As mentioned earlier, it currently is only thought as an alternative to the
hamburger menu on mobile, as most websites use different menus for desktop,
and therefore it is really hard to make this `use this menu and you will be
happy` menu on desktops. But we don't quite have so much room to play with on
mobile screens.

In addition to that the font size really just works on high-density screens,
so it would require major reworking for desktops. I planned to do that though.

------
steeples
I like this. Reminds me of this site
[https://www.hamburgermenu.xyz/](https://www.hamburgermenu.xyz/)

~~~
danielwinter
Thanks!

I used to use hamburgler
([http://johnm.io/project/hamburgler/](http://johnm.io/project/hamburgler/))
which seems to be a clone of the website you mentioned.

I used it on gaumengut aswell, but saw an increase in the bounce rate by 80%.
Therefore I needed something else :)

------
DanBC
I like this. I dislike the fact that it is always on screen. It's probably
best to autohide it.

------
datalist
Sweet name! Austrian for tomato, good choice!

~~~
danielwinter
thanks!

------
ratfacemcgee
awesome, made my browser crash lol.

~~~
danielwinter
Uhm, which browser? That really shouldn't happen.

~~~
ratfacemcgee
Safari and Chrome on OS X Yosemite

