Are tables in your web pages stopping users in their tracks? Here is an example in which users reached the right page, but left before completing their task. The culprit was a table. Tabular data on the page was broken up into several tables, without enough scent for the user to continue from one table to the next.
Since Hoa Loranger reported on “Right-Rail Blindness” in 2013, there have been many reports on the phenomenon that users stop scanning pages when they run into a ‘visual barrier’ like white space, or a box. For example Lisa Fast reported on how white space near the ‘fold’ caused users not to read on, and how putting a box around parts of a design makes it invisible to users.
In a recent Neo Insight study of user behavior on a high-tech vendor’s website, users were asked several questions phrased something like this:
“In this group of products, which product has [a specified parameter] = [value]”
Many users correctly arrived at a very long Product Information page, and began scrolling. The top of that page had dense prose, a table (which was clearly not useful), and a figure – all describing the good characteristics of the product family (i.e. promotional literature). This was followed after some time by Table 2. Table 2 listed products in the columns, and a variety of specification parameters in the rows. The table looked like the right place to find the information, and the users began scanning the rows, looking for the parameter of interest.
After looking through the 17 rows of the table, the users arrived at the table footnotes without having found the parameter they want. Most users immediately reversed direction and rechecked the table to see if they had missed the parameter.
A table break that acts as an invisible barrier to reading
The interesting part is that when they determined that the parameter was not in Table 2, most quit the page entirely – even though they were only about 20% of the way through the Product Information page!
A few went on and discovered Table 3 a few lines down. It had many more parameters (55 rows), but still not the one they needed. The behaviour of the few that scanned Table 3 was the same – they all scanned down to the bottom of the table, then reversed direction. Not one of these users went on to discover that the answer was in Table 4, a little further down the page.
What is happening here? There was no particular visual barrier yet to all intents and purposes the “end-of-the-table” had the same effect as the visual barriers mentioned previously. Users would rather look elsewhere than continue on after being disappointed by a promising table. As Jacob Nielsen observed in Deceivingly Strong Information Scent Costs Sales: ‘If the scent of information is sufficiently strong, people are generally convinced that they’re looking in the right place. If that place doesn’t contain what they want, they’re likely to conclude that the site doesn’t offer it at all’.
Whatever the mechanism, the design recommendation is clear.
- Provide a continuously increasing information scent. Don’t tease the user!
- Avoid breaking up tables. Users will keep scanning a very long table, but are likely to leave if you break what should be one table into separate tables.
For what it is worth, the vendor has since implemented the following solution, in which Expand/Collapse widgets are used to connect what might otherwise be many smaller tables into one manageable unit … time will tell if it works better!
Expand / collapse widgets in a table
