9

I'm working on a web platform where users can select/highlight text and perform selection-specific actions on the highlighted text. The current implementation shows a custom context menu on selection (immediately - no right click required).

However, given that right-clicking is commonly associated with performing an action, could it be more appropriate to replace the default (OS-specific) context menu?

I understand that disabling standard shortcuts (e.g. copy/paste) will invariably lead to user frustration and is bad practice. I also found an answer stating that it depends on whether a feature is removed in the user's best interests - which I find rather vague. Thus, let me specify the question:

  • Is it bad practice to change default UI behaviour, in casu to replace the browser context menu?
    • If so, what could be an acceptable alternative? Showing both menus simultaneously seems a bit crass.
    • If not, should the replacement menu mimic default behaviour (e.g. contain a "copy" button)?
  • Is it important whether the replacement menu looks substantially different from the (expected) default menu?
  • What about replacing the -webkit-touch-callout menu on iOS/Android? Do the same conclusions apply?

3 Answers 3

4
+100

No, disabling the context menu does not constitute bad practice. This is a common behavior.

Real world references: Try right-clicking in Gmail or Google Docs. Obviously, these are highly successful services that have been thoroughly user tested.

In general, I would venture to say that if what you are building resembles an application (a utility that solves a work related task for a targeted set of users) then a context menu can be highly productive. Obviously, this will make some things harder for a subset of users, but as you say, you can support some use cases by mimicking default behaviour.

Having said that, if the default options are assumed to be used often, and the new, contextual options are less frequently used, then you can look at e.g. the Atlassian Confluence wiki, which presents a small action icon above selected text.

Menu on right click in Google Sheets:

enter image description here

Action icon on selection (not right click) in Atlassian Confluence:

enter image description here

3
  • I'd say "does not constitute bad practice. This is a common behavior." is not one of the best arguments, generally spoken. There are countless behaviors in life in general which are both common and bad practice. There's an (ironic) saying in my mother tongue which translates to: "Eat sh**! Billions of flies can't be wrong!" :) Agreed, most of the time I belong to the "harder subset of users". In the webapp I use daily a drop-down menu via ⯆ would be sufficient in all cases. A bad side effect there is that links look but don't act like such: left-click works, middle-click doesn't, nowhere. Feb 27 at 20:30
  • 2
    I'd like to point out that google docs allows you to access the browser's context menu by holding shift, and atlassian by holding ctrl. I think it can be good practice to avail the user a more useful context menu based on the context, but by using modifier + right click, the user can still access their browser's context menu.
    – jgawrych
    May 25 at 20:26
  • @jgawrych, that's an excellent find!
    – bjornte
    May 29 at 16:45
1

Disabling the context menu would depend on the main goal or objective. If you are building a testing app that would disallow cheating like copy and pasting then its valid and sensible. Now if there is no true business value it will be nightmare to be consistent across all platforms and would require high maintenance and that's bad practice so to speak.

1

I consider replacing the browser's context menu a very bad practice if other well-known standard features are unavailable as a side effect. And they are, every time! Since no webapp designer/developer re-designs/re-codes the summary of all context menu items of all of the browsers out there – let alone the countless add-ons for all these browsers which add to the context menu.

From my comment to bjornte's answer: In the webapp I use daily a drop-down menu via ⯆ would be sufficient in all cases. A bad side effect there is that links look but don't act like such: left-click works, middle-click doesn't, nowhere (on links with overridden context menu). And all the other useful functions usually in a link's context menu (e.g. 10[!] in number in FF 102) aren't available either.

Long story short: Replacing the browser's context menu is very bad practice in general. If you do it nevertheless the beast is there to break out. And it will...one day...when you least expect it...

NB: I don't use Gmail or Google Docs.

Re your use case "users can select/highlight text and perform selection-specific actions on the highlighted text.": See the TWP - Translate Web Pages FF add-on. It shows near the selected text which in turn shows more on click. That's much less intrusive:

Selected
TWP
After click on
TWP

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.