5

After using Query SO couldn't stop but to notice how hard it is to understand we can change the width of columns.

Table in SO

How can we inform the user that the columns can be made wider?

2 Answers 2

5

You need no invent something new, just look how the widely used apps behave. In this way you can exploit users' previous experience, so they'll find this feature is "intuitive" ;).

Google Sheets
enter image description here

Airtable
enter image description here

Some points to consider:

  1. Use clear visual cues for users: change cursor type and show the border between rows (as on the pictures)
  2. Increase the width of the handling area to make it easier to resize (Fitts's Law in action!)
  3. Set default columns width according to their content, so as to minimize resizing operations
1
  • 1
    For that one needs to touch the column header though... Mar 17, 2020 at 22:28
3

There are ways to indicate the possibility to resize without hovering, but they aren't commonly used and therefore act as an indicator for the affordance only. Don't expect any signifier to be understood directly when it is seen for the first time. A few examples of possible signifiers:

enter image description here

enter image description here

enter image description here

While they are clearly indicators (the lack of contrast put aside) they aren't commonly used and maybe a mystery for the user. But it could trigger people's attention and make them find out what it is for and how it works. It also adds clutter.

My second thought would be, if users don't try to resize the column, are they familiar with the concept at all? If they don't, will they possibly ever think about resizing columns or even want to do that? Even if they find out what the indicator is for and how it works, it is possible they don't care about it and never use it. In that case you probably are (or actually the use is) better served with proper column sizing. Columns with large texts can have a fixed width and wrap the text to new lines. Text that is short and should be visible on one line should expand the width of the column.

1
  • That's clever. As an avid mobile user (no hover) I like this version in particular. Sep 2, 2020 at 22:06

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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