Hiding excessive elements

20 January 2024

When there is a need to show many similar elements, at certain point there are too much of them. One of the common solutions is to hide part of them behind small 'Expand' button or something similar. Most of the time it works, but in some cases it reduces interface efficiency.

Typical situation – we have five elements, but we also set the limit after which we hide excessive elements to four. Four looks just right on our page, not too little, not too much.

So here we are with a list of four elements, let them be tags and a 'more' button after them. If one clicks on 'more' another single tag gets revealed. Congratulations, we now got one of the dumbest interfaces in the world!

Do not hide just one element

To avoid such disgrace, we can design this block in a smarter way.

If the total number of elements exceeds our limit (say, four) by more than two, then we will show 'more' button. If not, we will just show all of them, six at max. This is much better than hiding just two elements behind an extra click.