Skip to main content
183 votes
Accepted

Why do dialogs have grey backgrounds?

There is not really a "UX" reason for this—or if there is, it is a very limited one. The actual reason why dialog backgrounds are (by default) some shade of grey is because some designers thought that ...
Cody Gray - on strike's user avatar
127 votes

Is OK/NOK better than "fail/success"

If the output is binary (success/fail, OK/NOK, whatever), why not only show a status on the failure state? timestamp | action name | description timestamp | action name | ...
Harrison Paine's user avatar
106 votes

Best user friendly phone number format

Libraries exist to do this. For spacing, I feel very strongly that the spacing expected by the user is the spacing you should use. Most people remember phone numbers (especially their own) with a ...
Muzer's user avatar
  • 1,370
42 votes

Ways to improve readability of recipe ingredients?

First of all, if you are just looking at a text list of ingredients then I would say that it probably isn't going to matter too much which option you go for. Out of the 3 options I would personally ...
musefan's user avatar
  • 7,111
41 votes

"Realistic" Thermostat Interface vs Minimalist

For the first skeuomorphic example, until I read your description, I had no idea how I was supposed to change the set point. I happened to notice the little edit icon and was worried that was the only ...
maxathousand's user avatar
  • 19.5k
38 votes
Accepted

What is the best number of paragraph width for readability?

According to studies, the line length should not exceed 70 characters. So keep your paragraph width between 50 and 70 characters. So actually you should not care about the width in pixels, but rather ...
Roland Studer's user avatar
36 votes

Is OK/NOK better than "fail/success"

What you need to examine is the use-case for these terms within the context of the project logbook. I have to guess here but I'd say the logbook is a project management tool - an aid to charting ...
Roux Martin's user avatar
  • 14.2k
35 votes

Why do dialogs have grey backgrounds?

Too much white can cause eye strain, so tints of grey reduce this. There is another ux.se topic which discusses white vs grey backgrounds: Grey versus white background for ease of use and ...
SteveD's user avatar
  • 8,934
31 votes

Best user friendly phone number format

Use non-breaking spaces Other answers have talked about the pros and cons of spacing and where to place the spacing. I would like to mention one more issue. If your interface is ever going to be ...
Flimm's user avatar
  • 416
25 votes
Accepted

Is OK/NOK better than "fail/success"

It appears that the biggest problem is being able to find the status indicators within a large group of text. Barring some significant technical limitation, I would say your solution should be to ...
maxathousand's user avatar
  • 19.5k
24 votes
Accepted

When to use white text on top of a color for readability?

This is standardised by W3C's Web Content Accessibility Guidelines (WCAG) and decided based on the contrast ratio between colors, which you can calculate programmatically. In your case, you would want ...
Izquierdo's user avatar
  • 12.7k
18 votes

Is OK/NOK better than "fail/success"

Two things to think about: In computing, it's common to use failure instead of just fail, because it happens to be the same number of characters as 'success', so in mono-spaced fonts they end up ...
Shaz's user avatar
  • 1,041
17 votes
Accepted

How do cards improve readability?

Some of the benefits of Cards based UI include: Improved Scannability - Cards are neat little containers for information. They divide content into meaningful sections and thus the information is ...
Akhil Ashok's user avatar
  • 1,201
16 votes

Why do dialogs have grey backgrounds?

Because the difference between the font-color and the background-color can cause eye strain and is not optimal. Having black or dark-grey text on a lighter grey background is the easiest for the ...
MJB's user avatar
  • 2,204
13 votes
Accepted

Best user friendly phone number format

I agree that this is not only country dependent, but also region dependant. Local numbers can have different lengths. And this separation should make clear where the local number starts. So the ...
Rafael's user avatar
  • 768
13 votes
Accepted

What are the best practices to design user interfaces that are going to be used under direct sunlight?

Without having previous experience in this regard, if this were a personal project I would consider some logical aspects in terms of graphic elements. Regarding colors it's obvious there must be a ...
Danielillo's user avatar
  • 19.2k
12 votes
Accepted

Images look bad with perfect paragraph width

It's not easy to propose an answer without seeing all the visual page content. These are some general concepts. The design problem is not the text, in fact the statement of the question says that it ...
Danielillo's user avatar
  • 19.2k
12 votes
Accepted

Does Material Design 3 recommend an incorrect icon style?

Material Design has generated a lot of controversy in its history, and each version has some "controversial" decisions (to say the least), although it gets better with each version. But you'...
Devin's user avatar
  • 38.1k
11 votes

What is the best number of paragraph width for readability?

The ideal paragraph width is not based on pixels per se, but on characters per line. This of course depends on the size and spacing of your font type. The project I'm working on has a paragraph width ...
Nick Groeneveld's user avatar
11 votes

What is the best number of paragraph width for readability?

tl;dr An average of 60-70 characters is ideal for desktop viewing. 40-50 is more realistic on mobile. Line length (measure in typographer speak) is an important factor for comfortable ...
plainclothes's user avatar
  • 21.3k
10 votes

Best user friendly phone number format

According to Miller’s Law The number of objects an average person can hold in working memory is about 7 +/- 2. Considering to his research we can have: 10 digit format: (+1) 12345-67890 ...
Dipak's user avatar
  • 16.2k
9 votes
Accepted

Grey versus white background for ease of use and readability/legibility

The only benefit of choosing a white background over a light grey background is that it arguably gives you a broader range of text colours that you can use, and still remain within accepted usability ...
Joseph C Lawrence's user avatar
9 votes
Accepted

Most readable way to display key value pairs

Option A (right aligned keys and left aligned values) makes the most sense in most situations (as always there may be some cases eg RTL languages where you need to adjust) Depending on the data you ...
scunliffe's user avatar
  • 3,722
8 votes

Why do we always append messages at the bottom rather than the top?

Because it messes up the order in which people normally read text. Why is top-posting such a bad thing? Top-posting. What is the most annoying thing in e-mail? or ...
sjb-2812's user avatar
8 votes

Best user friendly phone number format

There is an ITU-T Recommendation E.123 for the presentation of telephone numbers. This Recommendation applies specifically to the printing of national and international telephone numbers, ...
Alnitak's user avatar
  • 197
8 votes

Ways to improve readability of recipe ingredients?

additionally to @musefan's idea with a table: using a monospace font for the numbers (or everything) can help parse the entries faster visually. it also adds some "wrote that recipe on my ...
gerald's user avatar
  • 81
7 votes
Accepted

Why WCAG 2.0 doesn't comply with its own line length criterion of 1.4.8?

The recommended way to implement this is using relative units in em. If you check the page you have mentioned above, the <body> max-width is set at 50em, very easily within AAA conformation. ...
Ren's user avatar
  • 3,196
7 votes

Does Material Design 3 recommend an incorrect icon style?

Thin icons can be less perceivable The guideline likely conforms to an accessibility requirement on Minimum Informational Graphic Contrast: If a graphic is needed to understand the content or ...
Izquierdo's user avatar
  • 12.7k
6 votes
Accepted

Suggestion required for max width of a form

First, you should consider that optimal legibility principles applies to everything. A 45 to 75 characters width is considered as good, with 66 characters being optimal. However, some research has ...
Devin's user avatar
  • 38.1k
6 votes

Best user friendly phone number format

I believe there cannot be a single format here, since it may vary depending on the country. For example, in India, mobile phone numbers are 10 digit. It may be represented as 3-3-4. A good format, in ...
Nakul Saxena's user avatar

Only top scored, non community-wiki answers of a minimum length are eligible