Nested: Extended Breadcrumb

Last modified by Vincent Massol on 2024/11/19 16:14

 XWiki
 Design
 Completed
 
 

Description

Extended-Breadcrumb's purpose is to provide a solution to combine the global-menu functionality with the current breadcrumb functionality, while supporting nested spaces concept and being backwards compatible with parent/child relationship. 

Current

current.png

Purpose

  • Represent the following hierarchy: Europe - Eastern Europe - Romania - Moldavia
    - Southern Bucovina - Suceava - Vatra Dornei
  • Combine global-menu functionality (actions) with the breadcrumbs (navigation)
  • This is an usage example. There are other possibilities to achieve this kind of hierarchy (in the main wiki, only with space, only with pages, etc.)

Entity Icons

UC: Displaying the breadcrumb item entity type (wiki, space, page) by using an appropriate icon

icons.png

SuccessPros Combined functionalityErrorCons Increased complexity
SuccessPros Clear entity type displayedErrorCons Display is crowded by the icon usage, making it harder to read the label, thus slowing navigation
SuccessPros User can anticipate the available actions for a specific type ErrorCons If the available actions are identical, the type doesn't offer any additional hint 
InformationRecommended Don't display entity icons

Home Icon

UC: Displaying the main-wiki link, currently called 'Wiki Home' with a house icon

home.png

SuccessPros

Being one of a kind (only one main wiki) can be represented in a special manner.

Also it should be outside of the hierarchy (since its purpose is navigational), thus does not need a label.

ErrorLimitation

Currently, at sub-wiki level we don't display the main-wiki link for breadcrumbs (but only in the global-menu). We should display the main-wiki link also in the extended-breadcrumb (except for the 'farm' case). 

With this change we should also change the logo behavior, by redirecting to main-wiki, instead of sub-wiki homepage (or make this customizable since there are cases when we might want isolated sub-wikis).

InformationRecommended Display home icon

Entity Actions

UC: Displaying the breadcrumb item entity actions

actions.png

actions1.png

SuccessPros

Easy access to entity actions

ErrorCons Crowding the display. Alternative is to display the actions in content-menu
SuccessPros Consistent actions across entitiesErrorCons

Hard to differentiate between entity types in the absence of entity icons: 

- Different actions per type will produce confusion;

- If the actions are symmetric than they can be displayed somewhere else (content-menu)

InformationRecommended Don't display entity actions, rely on content-menu (see MacawSkin)

Limit items

UC: Displaying a limited number of items

Limit by type

UC: Limit display to following types: parent wiki, parent space and current page

limit_type.png

SuccessPros Similar to current display mode of global-menuErrorCons Not backwards compatible with parent/child relation
SuccessPros Compatible with display of entity actions since there is a limited number of entries and the type is displayedErrorCons Limited navigation because of displaying only 3 entries

Limit by count

UC: Limit display for a specified length (currently is 5). Alternatively, use container's width instead of a fix number.

limit_count2.png

SuccessPros More inclusive navigationErrorCons Hard to know which is the more relevant navigation (left part, right part, symmetric) since this depends on the user's structure
InformationRecommended Limit the displayed items depending on the breadcrumbs container's width

Expand

Linear expansion

UC: When the items are limited, expand structure on user's click/hover interaction

linear_collapse.png

linear_expand.png

SuccessPros Familiar breadcrumb interaction ErrorCons

Container needs to be able to expand horizontally and vertically when items are expanded

InformationRecommended

Tree expansion

UC: When navigation is limited, use a tree displayer in order to show the whole hierarchy

tree_expand.png

SuccessPros Useful for complex hierarchy structures (5+ items) ErrorCons

Might be an overkill for simple structures, since the linear display could suffice. Also the tree duplicates the breadcrumb functionality. 

The advantage of using a tree would be if we add additional functionality inside the tree displayer, but this increases complexity.


Conclusion

  • Combining the global-menu and breadcrumb functionality increases the navigation complexity. 
  • Currently we have difficulties in understanding the differences between the location hierarchy vs. parent hierarchy.
    When we will combine them, providing different actions for items depending on the item's type will be very confusing for the user, since different users will use different types of entities (wikis.webhome, spaces.webhome, pages) to achieve the same hierarchy

  • The recommendation is to keep separate the navigation (breadcrumb) from entity type actions (menus).

Usage Examples

example_breadcrumb.png

example_linear.png

example_tree.png


 

Get Connected