I am designing a web interface where we have filters on left side and search results on remaining page. How much page's space should left filters take? Any percentage?

closed as primarily opinion-based by maxathousand, Shreyas Tripathy, locationunknown, Wanda, Ken Mohnkern May 10 at 17:43

Many good questions generate some degree of opinion based on expert experience, but answers to this question will tend to be almost entirely based on opinions, rather than facts, references, or specific expertise. If this question can be reworded to fit the rules in the help center, please edit the question.

  • Hello @ammu. Unfortunately, there's no right or wrong answer to this, and will depend largely on a number of factors, like device width, how extensive your filters are, how much data is displayed in the results, etc. You'll ultimately just have to mock it up and see how it looks with your specific data. – maxathousand May 9 at 13:18

300px is a good choice. Depending on the font-size and letter-spacing, you may need slightly more or less.

A width between 20% and 40% is usually the best choice for a single sidebar and if you're going to use more than one sidebar, I suggest you don't exceed a total width of 50% (20% + 20% and 15% + 35%, for example).

For a single sidebar, you can also utilize the Golden Ratio approach, where the width of the sidebar is around 38% of the main content area's width. You can find more information about Golden Ratio in Jarel Remick's The Golden Ratio in Web Design article at Nettuts+.


  • 2
    Do you have any support for this recommendation? – maxathousand May 9 at 13:18
  • Nothing official, like you have already mentioned. Just a good starting point. – Ren May 9 at 13:22
  • 2
    This may help code.tutsplus.com/tutorials/… – Ren May 9 at 13:38

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