Hot answers tagged

107 votes

When your page has no results, what do you show?

For this situation you can use an empty state which can be just text or a graphic with text and an action button. Example of an empty state from Product Hunt: Good empty states will give the users ...
RobbyReindeer's user avatar
43 votes

When your page has no results, what do you show?

I would hide Showing "0 results from 0 results". Instead I would add in place a Blank State image with a button for the user to add data. ( If the user adds the data ). Displaying a pagination where ...
Chris's user avatar
  • 4,538
33 votes

Where should a newly added item go in table?

The system should add the newly added user to the corresponding page based on the sorting and jump from the current page to the page of the newly added user. a. for extra affirmation, popup a ...
aly.i.ux's user avatar
  • 1,143
32 votes

Grid/table with lots of buttons

There's a similar situation at the Youtube Studio Video Editor that can help you getting ideas, a mix of icons, drop down options menus and interactivity. Each row has two icons: the select icon on ...
Danielillo's user avatar
  • 18.9k
31 votes

What should the sequence be for Download and Delete buttons?

Placing those icons upfront will create confusion and users might take wrong action (clicking on unintended row) because of the repetition. Think of using the vertical three dots approach and place ...
Dipak's user avatar
  • 16.2k
28 votes

How do you indicate that an item is not selectable?

Keeping the checkbox disabled should be alright, if you are concerned about it you can make use of tooltips to explain the user why it is not selectable when he hovers over the field. Some thoughts ...
Alvaro's user avatar
  • 16.8k
27 votes

In a large list, should the filter and search be combined or separated?

When users are filtering a data set (especially large sets), they expect the filter to do its job at all times: the promise of just showing me what fits a specific criteria that I've defined. Keep ...
Mike M's user avatar
  • 24.6k
26 votes

Right way to show hours spent on project - with or without h:m

The suggested format of 8:30 can be confusing for durations, especially because it is also used for the start and end time. The h is not a common addition for that format and can confuse people as ...
jazZRo's user avatar
  • 11.7k
25 votes

To use or not to use "Zebra Stripes", or Alternating Row Colors for Tables

Don't. Don't use zebra stripes. Let me quote Edward Tufte: Again, this is a solved problem, with examples in Envisioning Information, chapter 3. Strips are merely bureaucratic or designer chartjunk; ...
Felipe Hoffa's user avatar
25 votes

Is right click on tables bad UX

I think it is a great idea to use right click to context menu. It is a norm in desktop application and I see no reason for it not to be the case in web interfaces. And many if not all tools from ...
Jurijs Kovzels's user avatar
23 votes

How should "Select All" work in a "LOAD MORE" table?

I think of 2 possible solutions. First solution: The newly show entries are also selected. Since the user selected "SELECT ALL" it would be good to the program to... select all, since thats what ...
Gilberto De la Garza's user avatar
22 votes

How do you make it clear to the user when the data in a table is updating live (or not)?

You could include an update button that the user has to click. The button shows the number of new elements and live-updates that number. This way you can make the user aware of possible new rows in ...
Alvaro's user avatar
  • 16.8k
21 votes

Multiple values in one cell in table

Maybe a traditional tabular layout is not right UI approach? You could consider variable height rows so that multiple values appear vertically in a cell, i.e.
SteveD's user avatar
  • 8,924
21 votes

What should the sequence be for Download and Delete buttons?

I would recommend not to put them directly next to each other at all to prevent mistakes. Downloading and deleting are two very different actions, happening with different frequency. I would make the ...
Bergi's user avatar
  • 1,636
20 votes

When your page has no results, what do you show?

For completeness, there's a canonical bad solution to this that is extremely common: quietly (maybe even silently) generalize the user's query until the set of results is non-empty, and show them ...
R.. GitHub STOP HELPING ICE's user avatar
20 votes

How do I make a large table from desktop/web look good on mobile?

The natural orientation of a smartphone is portrait, and the natural scroll direction is down, creating a view which is very narrow compared to its possible length. If your table doesn't fit, you ...
Glorfindel's user avatar
  • 3,320
19 votes

How do you make it clear to the user when the data in a table is updating live (or not)?

To make my users aware of the data updates I usually put the last update date time on screen like that: updated at: 01/03/2017 19:24:55 (2 mins ago) --------------------------------------...
Lucas's user avatar
  • 395
17 votes

What should the sequence be for Download and Delete buttons?

There is no hard rule for this and it would be different in every case but I would recommend putting the task that you want your users to perform, or the task they they are likely to perform most, at ...
Roux Martin's user avatar
  • 14.2k
16 votes

Tabular vs Card-based presentation, which is better for lots of data?

Adding to @DesignerAnalyst's answer. Here are some parameters you may want to consider before selecting the metaphor, Amount of data for each record: If the data includes text, images, actions then a ...
Harshal's user avatar
  • 3,105
15 votes

Right way to show hours spent on project - with or without h:m

I think this is going to be opinion-based no matter what, so here's my standard way of doing it: 1d 2h 3m 4s One day, two hours, three minutes, four seconds. Omit some components as appropriate for ...
Keiji's user avatar
  • 251
14 votes

Is right click on tables bad UX

It would be good UX for a general UI, but it is bad UX on the web. Your custom right click menu will block the regular one, what is against the principle of least surprise and possibly against what ...
allo's user avatar
  • 378
13 votes

Multiple values in one cell in table

You can try something like this, the most common and familiar with user way.
Fasih's user avatar
  • 864
13 votes

When should an 'archived' or deleted row disappear from a table?

I would lean towards suggesting that it should remain until the user leaves the page, or refreshes. It feels like it doesn't detract by having it there after the user performs the 'archive' action. I'...
Rhys Merritt's user avatar
12 votes

What is the best practice for data table cell content alignment

If the column is a text, left-align it If the column is a number or number + unit, right-align it (like excel) If it's a multi-part value separated by a common separator (like 1024 x 768 is multi-part ...
Nitin Jadhav's user avatar
11 votes

What some alternative ways to present tabular data instead of the standard table in the UI?

Have you considered using cards to display your data? They're becoming very common with Google's Material Design and can be quite appealing to the eye if styled correctly. Ofcourse placing too much ...
Gareth's user avatar
  • 111
11 votes

How do you keep your data tables simple?

Minimizing Table Real Estate You say you want to “simplify” the tables, but it sounds like what you’re really after is reducing the space they require. That can help the user by making more ...
Michael Zuschlag's user avatar
11 votes

What should the sequence be for Download and Delete buttons?

Make deletion possible only on a selection basis I would suggest adding a checkbox for each row and an Action Bar on the top with the Delete button. This makes deletion possible on a per-selection ...
Pabru's user avatar
  • 215
10 votes

Should searching a table include hidden columns?

Avoiding the dilemma There's a possible solution without falling into this dilemma: Give users the choice, just by adding a checkbox below the search/filter input which specifies "Search in ...
Alejandro Veltri's user avatar
10 votes

How do you make it clear to the user when the data in a table is updating live (or not)?

If you have a complex information for the user, in most cases the best solution is to simply spell it out. Display a gray information box directly above the table if the user is viewing search results:...
Falco's user avatar
  • 2,118
10 votes

The first zebra striping should be dark or not

I've always gone with white first for a few reasons. It tends to stand out better against the typically darker header If there is only a single result it doesn't look "grayed out" and thus ...
scunliffe's user avatar
  • 3,712

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