1

I have a website that was designed to have a side menu running along left side of the screen from top to bottom. Works great, looks great, but I'm having some issues when it comes to making it responsive.

The way the side menu was designed, when open it "pushes" the web content to the side a bit so the menu has enough space to exist. Obviously, this creates a bit of an issue on mobiles as it eventually pushes the main content into a space far too small to exist in.

My original idea for solving this problem was to remove/hide the menu when browsing from a small device, however it seems like a really bad idea to remove navigation.

The new/current running idea would be to modify the side menu so that on mobiles, instead of pushing content to the side, rather it appears over the content. However, I have been told that it seems like bad design to have a menu appear over content on a page, hiding said content from the user.

I've created a basic mock-up of the situation here: http://jsfiddle.net/dv64q6xf/1/

Would it be bad design to allow this side menu to embark on top of the main content? Alternatively, would there be a better way to handle this?

Improve this question
1
  • bootstrap brings the content <div> below the menu <div>
    – colmcq
    Commented Sep 16, 2015 at 16:29

3 Answers 3

Reset to default
2

When user is trying to navigate to another page of your website, their focus is only on the current goal which is to navigate so hiding content doesn't hurt at all

Better way to handle this is to hide less important items of your navigation into a 3-dots more icon by using this Paradeiser Nav Solution

See the image below for how Paradeiser Nav works, go to their github page and use it

Paradeiser Nav

Improve this answer
1

If you see many website on mobile, the side menu push the content on a page when user click on icon's menu.

it's not a problem.. Just when the user clicks on a navigation link, your side menu must push out.

Look this : http://designbeep.com/2013/10/22/20-jquery-side-sliding-panel-plugins-show-hide-website/

Improve this answer
0

Hiding your content is a better option according to me as it focus the attention of the user to the options you are providing.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.