4

we have a standard horizontal menu bar with submenu items with long texts. These texts are really long and we can not make them short, every word is necessary. Like:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

I have looked at solutions like megamenus (not suitable for us) or ellipsis. Do you think use of ellipses can mislead user? Or do you have any other solution? By the way we are using Primefaces, if you reccommend any component from Primefaces..

Thanks in advance.

|improve this question
  • Are those titles for articles that people can edit for instance? I'm just trying to get some context on what that information is. Is that information shareable between different people, or is that private for only the user who created those editable documents? – Majo0od Aug 15 '14 at 14:34
  • no they are not editable. They are stable menu items. – lamostreta Aug 15 '14 at 14:39
  • Oh, I was confused because the drop down menu looked like it was coming from the edit category. Can you still provide some context as to why they are long? Is it just the jargon you guys are using, or is it user generated content? If so (user generated content), can others see those lengthy menu items? – Majo0od Aug 15 '14 at 14:42
  • It is long because the domain requires it. The terminology/jargon of the domain makes it impossible to shorten the phrases.. The content is absolutely generated by us. – lamostreta Aug 15 '14 at 14:48
  • So this is just a regular menu, nothing dynamic about it? – Majo0od Aug 15 '14 at 14:49
4

Long menu items are not necessarily a problem, it's how they get presented that can sometime make them appear awkward and not well thought out.

Consider the worst case scenario of dealing with menu items that are too wide for the screen.

A few options might be to:

  • truncate the text (not ideal)
  • use an ellipsis at a suitable point (beginning, middle, but not the end)
  • multi-line items

An ellipsis is common in menu items when recently used files have long path names, but don't use one at the end of the text as that could be misinterpreted.

You might think multi-line text is not common in menus - until perhaps you consider the ubiquitous mega drop down menu common on the web, or the panel-like popups used by Microsoft Office and other applications.

In these cases, the menus have been designed for chunks of text, with appropriate white space and grouping. Perhaps something like these examples below could be used as inspiration to solve your problem more elegantly:

enter image description here

enter image description here

|improve this answer
  • thanks for the explanation. I think I'll go with long texts in menu items separated by gaps from other items. – lamostreta Aug 18 '14 at 12:23
2

Honestly, I don't think it's a big problem, as long as you provide a clear distinction between where one starts and where it ends.

Although I would say you should keep menus easy to scan. Having extensive menu names could cause some confusion.

Here is what I'm thinking for a design (lines in-between):

mockup

download bmml source – Wireframes created with Balsamiq Mockups

I still highly suggest that you shorten those for the sake of the IA and even SEO. Good SEO and clean URLS also make the experience really fun and memorable.

|improve this answer
  • Do you suggest lines in between the menu items? – lamostreta Aug 18 '14 at 8:37
  • 2
    About the SEO: Since the target system will not be in intranet (it will not be in internet), we do not have SEO-related requirements. Thanks for reminding, though.. – lamostreta Aug 18 '14 at 8:39

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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