120
votes
Accepted
Is "user-select: none" bad UX?
There's an easy way to approach user-select: none, and that is to ask a single question:
Would selecting the text be the primary/secondary interaction a user would intend if touching the screen there,...
- 3,057
109
votes
89
votes
Why don't <button> HTML elements have a CSS cursor pointer by default?
Here's why:
Microsoft’s design guides talk about weak affordance:
Text and graphics links use a hand […] pointer […] because of their
weak affordance. While links may have other visual ...
- 16.1k
74
votes
Is "user-select: none" bad UX?
In general, you shouldn't use it globally.
Oftentimes, users select some text, maybe to highlight something to show a part of the text to a friend, to copy text or to mark the text just to be able to ...
- 2,191
64
votes
Accepted
Is Helvetica considered a "web safe" font?
Not only is Helvetica not safe, but it is also a copyrighted font, so you need a license to use it if you load it as webfont.
As a matter of fact, there are no 100% safe web fonts, since it will ...
- 33.9k
41
votes
Accepted
Why don't <button> HTML elements have a CSS cursor pointer by default?
It's worth considering the historical order in which these things came into being.
Buttons existed from very early in the days of GUI computing. They had a shadowing effect to give a skeuomorphic ...
- 701
35
votes
Is "user-select: none" bad UX?
There are such people as "selection readers". I am one of them. I (for some reason consciously unknown to me) have a tendency to select text while I'm reading it. Sites that stop me from ...
- 1,368
33
votes
Make Optional Buttons More Clickable
The design makes it look like a checklist and the buttons look like they are disabled. May I suggest something like this:
- 10.8k
30
votes
Why don't <button> HTML elements have a CSS cursor pointer by default?
According to W3C cursor:
pointer The cursor is a pointer that indicates a link.
The specification only indicates that links are meant to have the pointer cursor. Buttons are not meant to have the ...
- 16.7k
28
votes
Accepted
When to use grab vs move cursor?
Move objects to rearrange them, grab objects to perform operations on them
The move cursor should be used when objects are just being rearranged (translated) without any alteration to their properties ...
- 40.7k
26
votes
Make Optional Buttons More Clickable
First of all, lowering the opacity makes them look disabled. So I would suggest you don't do that, as users might think that they can't complete those sections, even if they wanted to.
Using a tick/...
- 7,011
23
votes
Why rounding odd font sizes to even?
I think your fellow developer is somehow correct. To be honest, as far as I know there's no "set in stone" rule for this, so nobody is right or wrong as an absolute. However, depending on ...
- 33.9k
19
votes
Should :focus and :hover styles be the same or distinct?
The focus state should be more obvious than the hover state
A mouse over or :hover state is a more direct interaction (i.e. the user is controlling the mouse cursor directly over the button they want ...
- 15.8k
18
votes
Why are CSS cursor types so rare on the web?
I think you've answered your own question.
The special cursors demonstrated on that web site are rarely needed, whether in a browser or outside of one. Of the 31 cursors, 14 of them are for resizing ...
- 3,326
17
votes
Can text shadow enhance readability?
Apart from the answer given, I would like to mention one very important Use Case where the solution is nothing BUT shadows.
Text on an image
When you don't have control over the image on top of which ...
- 570
17
votes
Is "user-select: none" bad UX?
Not being able to select text is the most annoying anti user-friendly CSS property there is right now in modern websites.
Reasons:
Let's not try to act as if our website is something it isn't. It's ...
- 952
17
votes
Accepted
Marking box as expandable box intuitivly
There are different ways that you could design this.
1st option has a drawback: The user might think that they are directed to another page
2nd option more intuitive than the others. The icon could ...
- 3,719
15
votes
Why are CSS cursor types so rare on the web?
I see Progress and Help used fairly regularly.
Other than that, the rest of them are mostly situational... there's no need to use them out of specific tasks and environments.
Using cursors where ...
- 1,245
15
votes
Why rounding odd font sizes to even?
Sans fonts, which are commonly used on screens, are mostly designed to have the same thickness of stems and bars.
When the font size is quite small and is odd, like 17px, the font renders in a way ...
- 678
14
votes
Accepted
Can text shadow enhance readability?
In some situations a drop shadow or stroke can be used to maximise accessibility and maintain the contrast ratio between text and the background. I have used this method once or twice when dealing ...
- 14.4k
14
votes
Accepted
Why is the Google Search Results page not responsive?
Responsive design is best practice, except for the most high-end websites
Responsive, mobile-first design gets you the most “bang for the buck” for most web sites or applications. Effectively you can ...
- 3,901
14
votes
Tooltip CSS cursor
The cursor should change depending on the interaction the user can do with the element, not on the tooltip. A tooltip appears to explain what the element is or what it does.
For example when we hover ...
- 16.7k
12
votes
Is Helvetica considered a "web safe" font?
As mentioned there is no such thing as a safe web font. But there is a way to load in missing fonts from your server through the use of @font-face. @font-face was first introduced in CSS2, includes ...
- 220
12
votes
How to enable users to insert an infinity number
This seems very close to a very common pattern for pagination by limiting searches per page, e.g. datatables:
In your case you only want to display the first page, but it's still pretty much the same ...
- 7,228
11
votes
Can text shadow enhance readability?
To me, the answer is yes, especially for dark themed sites.
Here are some images from a site that I designed for my brother's roofing company. He wanted an all dark theme. So I gave him a dark gray ...
- 10k
11
votes
Why are CSS cursor types so rare on the web?
"Default", "Pointer" and "Text" are defaults in browsers.
Others we forget to specify for developer — because we paint static images. But if we work with interaction our-self, we will remember to ...
- 155
10
votes
Is Helvetica considered a "web safe" font?
be accessible on any device
Really no such thing as 'available on any device'.
If you're not using embedded fonts, then you need to use a font-stack, so you have some back up options in case the ...
- 41.7k
10
votes
Marking box as expandable box intuitivly
Consider displaying the first line of "content" text in the display, along with a link to read more.
This will give the user extra context to decide whether they actually want to read more, and ...
- 1,924
10
votes
How to enable users to insert an infinity number
In scenarios where a setting of zero does not make sense, zero is sometimes used for infinity. It does not really make sense but I think I've seen it in more than one application so as a user I'd see ...
- 217
Only top scored, non community-wiki answers of a minimum length are eligible