i'm looking for a suitable way to indicate that the user is on the cart page on an ecommmerce app by differentiating the cart icon from the rest of the icons on the navigation bar. there's obviously many way to do this (highlight, underline, darken the rest of the icon) but after checking out a few other apps noticed that except for a few most ecommerce apps don't do this. Any idea why?

4 Answers 4


If I have to look up at the shopping cart icon to know that I'm in the shopping cart, that's the design problem.

A user's attention is on the contents of the page. The contents of that page should make it clear where the user is and, in the case of a shopping cart, where the user goes next. It is of absolutely no cognitive benefit to the user to highlight a navigational link when their location is already plainly apparent.

Alerting the visual state of a navigational bar potentially draws the user attention. Why do you highlight items in general? To draw attention! The navigational bar is not something you should be trying to attention to, from the main content. If the user needs to navigate, they'll go there. If they need to focus on the main content, make it as easy for them as possible.

Users want to be where they need to be to complete their task. If the page they are on does what they need they are not going to try to leave it, nor do they need to be reminded that they are on it. They know they're on the page they need, because they're getting their job done!

If the page is not fulfilling their needs, they'll attempt to find the one that does. Their attention will shift up to the navigational bar as a result.

But what of situations where the user doesn't realize where they are and clicks on the same navigational link, only to feel slightly silly for ending up exactly where they just were?

Putting aside the issue that your content should be more clear... What harm has just happened by the user clicking on the navigational link to the page they are already on? The page reloaded. Big deal.

The obvious counter argument to the above is if the user loses a bunch of information they are entering. Again... if the page fulfills the user's needs, they will not navigate away from it thinking they're in the wrong place. The fact that the page is fulfilling their needs indicates the user is in the right place.


Could it be because the basket / cart/ trolley is a standard and widely recognised UI design pattern, so it is kind of obvious to the user that they are on the basket / cart/ trolley page? Plus there is a heading at the top that says 'Shopping Basket' (on amazon.co.uk).

It could also be because of where the user's eyes are drawn to on a web page (the F-pattern). As the basket icon on Amazon is on the top right, which would be in the F-pattern, the user can see that it changes when they add new items to their basket / cart. So perhaps it doesn't need to be highlighted because it is already fairly obvious.


I think apps don't highlight the active page just because is an icon less to add in the code or the designer think that a different color for the active page is distracting.

I think isn't a difference between the case you change the color or not for the text or the background of the link.

For the cart, indicate the user is in that page can be not a necessity, but in the other pages I think it can be find a sollution to use some less distracting colors/ variations of color which will indicate where the user is but not draw too much attention.

You can see some examples in "Patterns– Navigation drawer | Google"

Patterns Navigation drawer behavior


Because it's easier and because it looks better.

Making a button costs effort. making two buttons costs more effort. Effort costs money and you want to spend as little as possible. So if you interface works 'acceptably' why spend more money and effort?

Sure some big companies or some that care about usability will spend the effort, it might even be profitable because of a fraction more usage... but in most cases the ROI isn't good enough.

As for looks, this is very debatable, but one can certainly argue that having just 1 style of button makes the whole more coherent. But having mostly the same and one different, that one would stick out. If you're going for a DTP-inspired look (which has no hyperlinks or interactivity) this'll break the effect.

Heck, from there you could even argue that perhaps having the button highlighted might distract from the actual content. You'd be drawn to the menu instead of things thay let you buy stuff (e.g. payment methods, address boxes) so it would work counterproductive.

  • 1
    Pretty sure buttons don't even go into project's cost calculation. Sep 6, 2016 at 3:08
  • @EshwarenManoharen If you don't budget for something, you won't have the budget for it. So generally, a project doesn't have the time/money for unique button states and code, because it doesn't even cross their minds. Sep 9, 2016 at 21:53

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.