0

Is there any resource available online, explaining why is it a good practice? Do you know any good example of digital product, which doesn't provide option to open link in new tab by clicking a middle mouse wheel? Any reasons why/when it shouldn't be a default option?

I could not find any information related to this functionality, just brief explanation that this is the "expected behaviour".

click scroll wheel to open in new tab

2
  • It's not obvious exactly what you are asking here. Are you asking if you should remove it from standard links? Or are you asking if you should also implement it for other buttons, that the browser would not handle this feature by default?
    – musefan
    Commented Apr 20, 2021 at 14:15
  • I updated main question, I hope it's more clear now. I'm looking for any materials, that would state anything about this functionality. Maybe this is just no-brainer and I'm looking for something what doesn't even exist...
    – Iga
    Commented Apr 20, 2021 at 15:11

2 Answers 2

1

Middle button (or other ways) of opening page in new tab

Stick with the browser's/user's default when possible. The user can configure the browser to fit user's specific needs (that is also sometimes considered as part of accessibility). Do not reinvent the wheel (or repurpose the wheel) and use links wherever you have something that behaves as link. If something looks like real link it also should quack like real link in all cases.

The user can also have some weird pointing device. The same is true for keyboards. For example, I use custom key mapping just because it is easier to use that the standardized one.

When you have some button or link that changes location in the application (going from one page to another), use links that target to address of the page if it does not use JavaScript for interaction. When JavaScript is used, prefer addresses with # (or #!) to denote location in the application/site so the link does not cause page reload but provides address of page that can be bookmarked. That also makes back button work.

Make sure that closing the page and opening the page with specified address (or refreshing) moves the user back to the same place, even in JavaScript application. Make sure that pressing back button really moves the user to previous activity in the application.

Examples involving application workflow

Example 1: The user opens the JavaScript-based application main page. It is some dashboard with links to various other activities. The user knows that action on two places will be performed, so the user opens the linked pages in new window (or tab). Then the application UI becomes splitted into two separate user interfaces and the user does not have to go back and forth in the application UI to perform two actions.

Example 2: Suppose we have some application that does something with text processor documents. The user wants to open two documents. The user will middle-click both documents to open them. When left click is used, the user cannot be sure whether they will be opened in the same window or in new.

Example 3: The user is filling form that contains link to documentation. The user middle-clicks documentation links to be sure that they will open in new window.

Examples involving technical limitations

Example 4: The user has very slow connection.1 When the user wants to open something, middle-click will open it in new window/tab and the user can continue doing something else on the first page.

Example 5: The user has very slow connection.1 Going back can take even tens of minutes so the user prefers opening pages in new window.


Other uses of the middle button

Some browsers provide a way of scrolling when the middle-button is clicked on empty place in the page and mouse position sets speed of automatic scrolling.

Middle button (or right button) is also used to move in two/three dimension views (3-D scene, big image, maps) when other buttons do something else.


1 I live in Europe and there are few places where mobile connection very bad just because of terrain morphology. There is place where the connection speed varies from few kbps to tens of Mbps.

2
  • "When JavaScript is used, prefer addresses with # (or #!) to denote location in the application/site so the link does not cause page reload but provides address of page that can be bookmarked. That also makes back button work." history.pushState has existed for over a decade and is supported in even IE 10. There's no reason to be doing that in 2021.
    – lights0123
    Commented Apr 26, 2021 at 0:00
  • @lights0123, yes, using history.pushState is also good (and often better) solution. I still prefer the #-notation in application for which the server returns the same HTML independently on the URL, because the server does not have to know what will be processed on the client. But, if server uses the information to generate HTML, I use history.pushState with #-less URLs. I use the following rule: When it is processed only at client side, place the information after #, but when it is, or could be, processed on the server and HTML changes with it, place the information before #.
    – jiwopene
    Commented Apr 26, 2021 at 8:13
0

What do you mean by 'using scroll'?

If it's a link, first thing is to make sure that you don't break the web browser's default functionality, and users can still open the link in new window using the normal methods - right clicking, cmd-clicking, ctrl-clicking, long press on touch devices.

Having site-specific ways of opening links in new window need to be learned, but using browser standards taps into existing, learned behaviors.

The behavior is browser, operating system and hardware specific, not some universally consistent standard. It is also a user preference, that they may change from browser / pointer device preferences. What would be the benefit of forcing varied user preferences and habits into one interaction?

1
  • Scroll - scroll wheel; I updated my question, the previous version was unclear.
    – Iga
    Commented Apr 20, 2021 at 13:16

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.