Skip to main content
67 votes

Mobile friendly way for explanation why button is disabled

Add the same text as a small label near the disabled button. This won't rely on any on any additional user action in order to show this additional information, which is good, because users tend only ...
maxathousand's user avatar
  • 19.5k
51 votes

What is the smallest screen size you design for

What is the smallest screen size you design for 320px But, as others have answered it, for best results you actually need to measure your audience and consider how much resources you want to pour ...
John Weisz's user avatar
16 votes

How to deal with an excess of white-space in a CRM UI?

Visualize hierarchy You have an opportunity here to maintain flexibility while emphasizing the known priority of data elements and adding some scan-ability and visual interest. The nice thing about ...
plainclothes's user avatar
  • 21.3k
16 votes

Is 320px wide designs still relevant? (responsive web)

I believe 320 points wide is not an unreasonable width in 2019 because: iPad apps in split view (including Safari) can be 320 points wide. iPhone SE^ (which was sold new within the last year) has a ...
Barnyard's user avatar
  • 614
16 votes

Mobile friendly way for explanation why button is disabled

Do not disable buttons. Disabled buttons predate modern touch screen usage and don't work in this environment. Solution 1 For the 'I agree' or 'I have read' required checkboxes, when there is only one:...
knallfrosch's user avatar
  • 2,088
14 votes

Revisiting user-scalable=no

Stop using "user-scalable=no". Period. In the last 6 years, I cannot count the times that I've had to put away the iPhone and go to a desktop computer to examine something on a website because it ...
Mike's user avatar
  • 141
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 ...
Tim Grant's user avatar
  • 3,941
11 votes
Accepted

Why Browsers load Websites gradually?

Technically this is caused by the fact that images and other assets are generally hosted separately, and the browser only knows to go fetch them when the document uses them. It would be technically ...
Kit Grose's user avatar
  • 15.5k
11 votes
Accepted

How to avoid the use of scroll bars in dashboard UI?

There's a couple of things going on here: The scroll bars are too close to each other on the right hand side - there needs to be some separation between them so that the ones associated with tables ...
Roger Attrill's user avatar
11 votes

How to deal with an excess of white-space in a CRM UI?

I don't see an issue with the white space. Card-type interfaces are prone to having white space. Maybe you can condense the details into the global components, like the header, and dedicate the body ...
Nicolas's user avatar
  • 5,608
9 votes
Accepted

How to present a wide chart on mobile devices?

Your best bet in this case is to make the left column fixed and allow scroll on the remaining columns. You can see an example (and script to do it) at DataTables Fixed Columns. On top of this, since ...
Devin's user avatar
  • 38.1k
9 votes

Revisiting user-scalable=no

Do not prevent the user from zooming using user-scalable=no or maximum-width=1, minimum-width=1, unless your entire page is an interactive app with its own zoom mechanic overriding default pinch-zoom ...
user56reinstatemonica8's user avatar
9 votes

Font-sizes smaller on mobile, yes or no?

Sounds like your coworker is using Material Design guidelines; they recommend not going smaller than 12sp (scalable pixels) for mobile. Whether this is a good practise to follow depends on two factors:...
Wendy Wojenka's user avatar
8 votes
Accepted

Should a UX Designer design in Pixels, Ems, or another unit of measurement?

I hope this answer this question, but this is my personal process: I use the font sizes in my PSD mockups for reference purposes only, almost as a 'relative' size. Then after Design is approved, along ...
Ana Santos's user avatar
8 votes

Why is responsive web development primarily portrait based?

There simply aren't that many people using their mobile in landscape (or narrow their browser screen). Also, once you're logged in, you don't see that screen anymore, so I guess they focus their ...
Glorfindel's user avatar
  • 3,320
7 votes

Responsive design - Most common resolution steps

Rather than thinking about screen widths, think about the content. New devices are released all the time so the best strategy is one that's based on your content rather than targeting specific devices....
Matt O'Keefe's user avatar
  • 1,860
5 votes

What is the smallest screen size you design for

On this website it gives some info about screen resolutions http://www.websitedimensions.com/ According to that stats the smallest mobile resolution is 320px - however as mentioned in the third ...
dav's user avatar
  • 151
5 votes

How to display two sidebars on mobile?

Two usable options come to mind. 1. Accordion menus 2. Sliding panels
plainclothes's user avatar
  • 21.3k
5 votes

Full-screen "loading" overlay in desktop browsers

"Loading" screens, progress bars, spinners, or the like are necessary for operations which take enough time that the user needs reassurance that the program hasn't crashed or become ...
Daniel Beck's user avatar
  • 4,592
5 votes

Font-sizes smaller on mobile, yes or no?

Yes, it is a good idea to decrease the font size on mobile compared to on desktop. Generally, you sit further away from the screen when you're viewing a larger desktop / laptop than you do when ...
JonW's user avatar
  • 37.4k
5 votes

Is it a good practice to extract some menu items from the main navigation on medium sized screens?

Hamburger menus aren't typically used as overflows for existing navigation - they're usually either used to contain the entire navigation (or sometimes to contain non-navigation actions). I think how ...
Warren Payne's user avatar
5 votes

In Responsive Design, how do you trigger Tooltips? mouse hover isn't there anymore

Both Android and iOS have long press handlers, which can be used to simulate the hover-tooltip effect. The Material Guidelines's mobile section give an example of usage.
mrchaarlie's user avatar
5 votes

Which mobile devices do you NOT optimize mobile responsive for?

I think this is missing the point. The idea of being responsive means that the site/app adapts to clearly display its contents at any reasonable size. Designing for each individual device vastly ...
maxathousand's user avatar
  • 19.5k
5 votes

Is 320px wide designs still relevant? (responsive web)

I can only speak from personal project experience for a multi million pound website re design. We're designing with 320 mobile in mind as a worse case scenario for mobile screen sizes. It may be a ...
colmcq's user avatar
  • 8,250
5 votes

What's the point of responsive/adaptive design in doing UI?

The problem with "desktop" and "mobile" is that there's no standard size for either one. Is it a small laptop screen? A huge retina monitor? Landscape tablet? Portrait phone? ...
Elliot's user avatar
  • 832
5 votes
Accepted

Too many expanding panels, not enough room

The correct layout depends on your user needs in context (what is exactly the scenario ?). Do they need both the information in side panel and data table at the same time ? Do they need all the ...
Funkit's user avatar
  • 331
4 votes

Pane vs Modal vs ?: Across all screen sizes

I have faced the debate, this is my conclusion thus far. Slide Out vs Modal In an application, it is important to make the distinction between information that requires immediate attention/action ...
Luis Martinez's user avatar
4 votes

Why Browsers load Websites gradually?

If I'm understanding correctly, I think the question should be "Why sites loads websites gradually?" . See to answer your strict question, browsers do whatever you (where you is the developer, site ...
Devin's user avatar
  • 38.1k
4 votes

Responsive design - Most common resolution steps

First, understand what tasks each user engages in with each device It really does depend a lot on that. The way they use your website should determine your design. If you solely base your assumptions ...
asiegf's user avatar
  • 1,165
4 votes
Accepted

Best way to make a menu responsive

I think your best option is to throw away the current design and start over, I can't see how the UX can ever be anything other than terrible. Sorry. This is not a user-friendly solution and makes it ...
Seth Warburton's user avatar

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