My app has this kind of design in the ideal, normal use case:

enter image description here

but, in case the user creates two or three nested folders with a long folder name, like in this structure:

enter image description here

it quickly becomes problematic:

enter image description here

I can of course widen the box but that doesn't seem the best solution:

enter image description here

Therefore, I need some guidance on what can be the best way to sort out the problem of long folder names. Thank you!

1 Answer 1


You can use a chevron << to the left of the folder navigation breadcrumb in case there is no room for all of the folder names. Push the parent folder names to the left giving priority to the child on the far right.

enter image description here enter image description here

However for very long names, you can set a standard maximum length for the characters that should be displayed for each folder name(giving priority to the child too) when there is no room between the breadcrumb and actions/controls to the right, use an Ellipsis ... to signify the adjustment.

enter image description here

You can also chop off some characters on the child incase it is very long or you want to leave enough space between the breadcrumb and the actions.

enter image description here

In case the user wants to navigate back uptop, they can click on the chevron to reveal the parent names. It can be a dropdown or horizontal scroll for the folder names.

Dropdown on clicking chevron

  • 1
    Wow! Very detailed and thorough answer! Thank you! I will accept your answer in a day or two if there's no better answer. Mar 24, 2016 at 7:42
  • 3
    Another plus to this approach is that Windows users (who are the vast majority of computer users) will find this totally natural.
    – PieBie
    Mar 24, 2016 at 11:43

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.