Is it appropriate to use an ellipsis in website left-hand navigation?

Question

I'm working on a site that primarily has a flat hierarchy. It's very wide and shallow (lots of sections hanging off the root of the site, but very few subsections).

As a result of this the design has evolved so that currently selected side-menu items are bold and have an arrow to the right, pointing at the content.

Now, this brings us to a dilemma. On very rare occasions one of the menu items does not lead to a straight content page, but to another landing page with its own side menu.

One proposal is to give such menu items an ellipsis to signify that there are more menu items behind that click:

^{download bmml source – Wireframes created with Balsamiq Mockups}

However, according to a previous post here: What are the rules of using ellipsis on buttons, the use of an ellipsis is discouraged when there is not an actual confirmation step linked to that menu item, and suggest using an arrow instead.

But because we already have an arrow in the navigation, this introduces a contradictory pattern - one arrow means 'this is selected' and the other means 'this will take you somewhere else'.

^{download bmml source}

So, can I use the ellipsis approach after all? Is that a recognised pattern as far as on-page navigation is concerned, or do we need to rethink the whole design approach (which, unfortunately for a site of this size is quite an undertaking)?

Answer 1

The wireframe you have provided (with an arrow on the right of the text) to show that that particular level has sub sections in the same level could be changed. Move the arrow on the right to the left of the button before the text with a few pixels of padding. This is a very standard tree organization approach.

Answer 2

An ellipsis gives me the idea that the label text didn't fit the space. If I saw it I would hover it to see a tooltip for the complete text. How about using a down arrow:

After your comment it's clear that it isn't about a dropdown menu. But I still think the ellipsis isn't the best indicator for an item with it's own menu. Desktop conventions don't always work for websites, the hamburger icon is more commonly understood on the web.

If you still insist on using the ellipsis, maybe it is a better idea to separate it from the text by placing it on the right:

Answer 3

The concepts

• You are here ( 'this is selected' )
• This has deeper navigation ( 'this will take you somewhere else' )

Are quite closely associated concepts in the users "website navigation domain". So having 'arrow based' symbols for both is not conflicting, and may even be beneficial (lower the cognitive load) - providing the styling and contextual visual clues are strong enough.