67

I've seen some websites that make their text unselectable. And I believe that this can break up user experience, as "selectable text" is a well established ui pattern on web and computer in general.

What is your opinion about disabling the functionality of selectable text? Is there any reason or example, proving that we should do that?

Edit: As was nicely mentioned in a comment, the above question seems to be targeted only for selectable text. But what I'd like to understand has mainly to do with cases where we should force text to be non selectable.

  • 46
    Making paragraphs which you expect to be selectable, non-selectable irritates me to no end. Because when I read a text online I use selecting the text to guide my eyes. – Pieter B May 20 '15 at 11:28
  • Sometimes the non-selectability is just the default of a used framework – a developer has to enable selection explicitly, and if it is forgotten, it stays non-selectable. (This is a bad decision from the framework, of course.) – Paŭlo Ebermann May 20 '15 at 20:13
  • 2
    The question asks, "what is your opinion", but aren't opinion-based questions not allowed? – Superbest May 20 '15 at 23:50
  • 2
    Is it an established UI pattern because it's good UI, or because the web was originally designed for documents? – immibis May 21 '15 at 0:45
  • @immibis Maybe has to do with web for documents, but I think it was a general user need, not just a good UI. Selectable text serves satisfaction when for example you keep track of what you are reading. Also boosts efficiency and reduce errors on Human Computer Interaction as it can help users to complete operations faster and without worrying about type errors (eg. copy/paste operations). So even if it was developed for or by web, it become something useful and in my head a well defined design pattern – gpelelis May 21 '15 at 22:35
47

It's a myth that selectable text is "costless"

As a general principle you are right that text should be selectable. That said, since you're asking about non-selectable text, here are some cases to be aware of for disabling text selection.

There are visual elements containing text that users don't expect to be selectable. For example:

logos, controls and window titles are examples of text elements which can reasonably be non-selectable

Let's walk through why:

  • Logos: some logos are based on text fonts and are even rendered as text. For most companies, it's important that logos are rendered faithfully so the idea of a user cutting and pasting half a logo text, or copying the text of a logo without the font, size, etc is unacceptable. This is a perfectly reasonable business decision for a company, so they may disallow selection on text logos.

  • Controls: it would be an odd experience for a user to be able to select text inside a pressable button or inside a dropdown menu. Sure, it may not do much harm but (a) it can confuse the intent of a widget; and (b) it's inconsistent with behavior found in most user interfaces so it breaks behavioral convention for users.

  • Draggable window titles. It's common for draggable windows to be grasped and dragged via the title bar. It would be weird if the user clicked and dragged a title only to find that she was selecting text instead of moving the window. For this reason, even static modal windows commonly have non-selectable titles.

These are just a few examples, but they illustrate a core principle that text selection can create negative user or business impact, and it can make good sense to disable it because it conflicts with primary interaction, impedes effective communication, violates marketing or business objectives, violates UX convention, etc.

  • 17
    I partially disagree with the third point: If the cursor changes to the beam while hovering over the window title text, as a user, I am instantly aware that I am not going to drag the window around if I click right there (or rather, I'd be annoyed if the beam cursor did drag the window). Especially in your example, there is plenty of space left on the title bar for dragging, so there's no reason to take away the useful selection capability (for copying the UI text to a search engine to search for help, or to describe the UI to someone). Contrast that with the button example, which ... – O. R. Mapper May 20 '15 at 9:07
  • 2
    @tohster Well that was a good insight. Personally I am concluding that selectable text has more to do with the content of the text and the way we assume that it is rendered. If the user expect it to be part of the user interface (call it a logo, control, window title, image, whatever) then it should be non selectable. But if the user believes that text is created by a human hand, then let it be selectable. – gpelelis May 20 '15 at 11:50
  • 13
    This answer makes some good points but I wonder why it was accepted since the OP asks specifically about text that he expects to be selectable. – Lilienthal May 20 '15 at 12:48
  • 1
    @Lilienthal Indeed this answer uses some special cases of the text to support its statement, but it also answers the general question about making text non selectable. I think that the question needs a refinement – gpelelis May 20 '15 at 15:12
  • 1
    I think the point here is that sometimes, in specific small cases, there are valid reasons for making text non-selectable. But "valid reasons" should be to enhance user experience, not to prevent them from doing something you don't want them to do like copying lyrics to a song. – Ben May 20 '15 at 15:27
53

I believe the usual justification is to prevent folks from copying and pasting the content so that they don't steal it. I usually roll my eyes at this because if a user really wants that text, you can get it one way or another, even with selection disabled.

I came across another example: a developer wanted to disable selection because double-clicking a table row would open up a separate modal dialog showing details about that row. But, at the same time double-clicking selected the text, which was unwanted. That is at least a better reason than the first, although ideally you would want to work around that problem some other way than making it unselectable.

So to answer your question, I don't really think there are good reasons. If it's because of something like the second scenario, you should re-write the behavior to something more expected (instead of double clicking, maybe open the dialog with a single click). If it's the first scenario, people will find a way around it, if they want it enough.

  • 7
    More generally, disable selection of some text if clicking that text would have a useful meaning which shouldn't disturb any existing selection. – supercat May 19 '15 at 23:35
  • 1
    In that case I would put those elements on a separate area so that you can copy the code (for example) without selecting the line numbers. Here's an example, you can decide whether to select just the code, the line numbers, or both: sitepoint.com/youtube-videos-php-categories-search-suggestions Point is, the choice is left up to the user. Inherently I don't like taking choices away from users without solid, tested reasons. – Rachel9494 May 20 '15 at 15:46
  • 1
    I disagree that the usual justification is that. Windows dialog box are often not selectable, for instance, but there is rarely anything in them that you'd want to protect and often something you would want to select (like error codes). – Superbest May 20 '15 at 23:51
  • 6
    @immibis It is a great mystery of our time why Microsoft in their infinite wisdom decided to make dialog box text non-selectable, and if an oversight, why after 20 years of Windows they still haven't fixed it. But if deliberate, I don't see how the reason could possibly have been to prevent copying. (although granted there's a lot I don't understand about Windows, but that's a different matter) – Superbest May 21 '15 at 1:08
  • 2
    @Superbest you can Ctrl + C to copy the text of a dialog box (at least error or warning dialog boxes), although I agree it's quite stupid not to allow a manual selection of the text to copy (and paste into Google :P) – Hayko Koryun May 21 '15 at 9:59
32

There is a reason when disabling the selection of text makes sense, and that is if selection of text could interfere with functional aspects of the UI. For example, it is frequently used on widgets that are draggable because you want to avoid that the user accidentally selects text when he intends to drag.

  • 2
    Or worst: Selecting the text of the whole page by accident when the user makes a selection from the top of the text to the bottom of the screen, inside a modal. Or when dragging too fast, you may accidentally select the text behind the modal while dragging it. – Ismael Miguel May 21 '15 at 16:49
  • 2
    @IsmaelMiguel I think this is a great example, that could be an answer all alone as it can provide a great accelerator. For example on a blog post, if we can have some user testing, we could allow selecting only the body text . So for example a CTRL+A shortcut would copy only useful stuff! ( bonus, try selecting only the answers of this question and pasting it into a plain text, without button, help, whatever text. ) – gpelelis May 21 '15 at 22:47
14

Disabling selectable text is horrible UX for non-native speakers of the language the text is written in, who may rely on copy-and-paste to automated translation software or website to make sense of the text. This is becoming less of an issue with ubiquitous smartphones with high-quality cameras and OCR translation apps, but I believe it's still relevant.

  • "Disabling selectable text is horrible UX for non-native speakers of the language" not always. It wouldn't be funny when the user has a modal and selects the title AND the content of the whole page. – Ismael Miguel May 24 '15 at 3:51
  • 2
    @IsmaelMiguel: If there's a UI bug that causes selection of text other than the text you intended to select, that's a UI bug and has nothing to do with this question. Disabling selection as a hack to work around your UI bug is just piling on a second bug. – R.. May 24 '15 at 15:51
  • Or a browser who's functionality is broken or something that is actually unavoidable, like dragging a modal and the mouse being outside the draggable area for a brief moment (while you handle the new mouse position) and selecting random stuff. – Ismael Miguel May 24 '15 at 16:14
  • It's easily avoidable by not using modals, which are bad UX for many other reasons already. – R.. May 24 '15 at 17:55
  • Which means, you can use dialog boxes (to confirm that you want to delete)? – Ismael Miguel May 24 '15 at 18:57
6

The simple answer to this question is NEVER. Restricting the ability to select text won't keep competitors from stealing your content but it will make it virtually impossible for customers to easily share it.

  • 31
    I think this statement rests on the assumption that the only reason to disable text selection is to prevent copying. – illuminaut May 19 '15 at 23:48
3

Generally, there are two reasons:

Clarity

It's odd to have the text of a button or dropdown selectable. It'd be confusing for my cursor to turn to a beam, as if the primary interaction I will have is selecting/editing the text that is there. You could have an arrow cursor and still have it selectable, but that's weird too.

Polish

Selectable text is the default on the web, which is written in Hypertext Markup Language. Being a markup language, it is largely text, with some links and formatting and structure directives sprinkled about. Or least it used to be.

In contrast, text in desktop applications is not selectable by default.

Web apps are becoming more like desktop apps and less like plain webpages in appearance and functionality. The default selectability of text is one such transition.


There are also reasons not to do this, but this question only asked "why".

0

One other case I have hit that is at least tolerable--a form that's asking you the same thing twice to reduce the human error factor. It's quite understandable that they might keep you from copying the text from one field to the other.

What gets obnoxious is when they block pasting--what if you are copying the information from a saved location?

  • 2
    The rationale from the first paragraph can hardly work without blocking pasting. Reducing the human error factor is primarily a concern in password boxes, and I'd wager that it is at the same time very often password boxes that are filled by pasting (from a password generator or similar). – O. R. Mapper May 20 '15 at 9:09
  • The human-error aspect is often applied to email addresses as well. I've found that sometimes at least, using noscript has allowed me to copy/paste when the site intends to disallow it, but I've never investigated further and am generally quite -- too -- willing to unblock scripts (typically I've found I could paste on my machine, not on another without noscript) – Chris H May 20 '15 at 13:12
  • 1
    @O.R.Mapper If you simply block ^c they can't type it once and then copy it to the other field. They still could type it in Notepad or the like and copy it into both but I doubt people will normally bother with that. ^v without a previous ^c probably means they copied it out of a file elsewhere--which has a very high probability of being correct. – Loren Pechtel May 20 '15 at 15:41
  • @LorenPechtel: Hmm, personally, I frequently do that for web-based forms, simply because web applications are prone to failing (at any point between client and server - e.g. when my wifi connection breaks after sending a form and before receiving the response) and I don't like re-typing everything I have already typed, but that might only be me. – O. R. Mapper May 20 '15 at 15:47
  • @O.R.Mapper With unstable sites I've been known to do that with large chunks of text but those normally aren't copy-protected. It's usually either e-mail or password that's protected. – Loren Pechtel May 20 '15 at 15:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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