Zappos Breadcrumb

Zappos breadcrumb has a unique behavior. It does leave trails as you filter and navigate to a page , but these trails are not back links. The trail is removed when users click on it, creating a new path (search). For example, look at the image below

The current navigation in the breadcrumb is Shoes-Men-Sneakers and Athletic shoes-Shoes-Adidas. When I click on Men, it removes Men from the breadcrumb. The new navigation is  Shoes-Sneakers and Athletic shoes-Shoes-Adidas. The resulting page displays Sneakers for both Men and Women, when I intended to search for all types of shoes for Men.

This new behavior is fine. What bothers me is the interaction design. Yes, there is a ‘cross icon’, and the proximity between the text and the icon forms a group. But the text itself looks and acts like a link. A user does not expect a negative removal action on clicking a text link, unless the text is negative. So one solution would be to add the prefix ‘remove’ before each text, which creates lot of visual load. A better solution is to remove the link treatment from the text and keep only the ‘cross icon’ interactive.

About umanka

Interaction Designer @meebo
This entry was posted in Interaction Design and tagged , , . Bookmark the permalink.

Leave a comment