Single Column Lists Take More Pages, But Achieve Better Results

• by Jack Loechner , Staff Writer @mp_research, May 26, 2009

Though this Research Brief certainly qualifies as reporting on a study, it is attuned to effective design techniques that have a significant impact on reader usability rather than media selection. It does, however, speak to yet another, somewhat obscure, measurement metric in achieving and evaluating advertising performance.

A new study by the Catalyst Group, using Eye Tracking and Usability techniques to compare two popular types of list layouts, determined that one was clearly more effective than the other. Although a 1-Column layout is a simpler design that requires more scrolling, and in generally took more time to review, the Eye Tracking study indicates that this is a much more effective layout for accurately accomplishing the key networking goals of scanning a list from which to select people, or, by extension, make a selection.

In order to isolate the specific function to better facilitate scanning, and create a more fluid and comfortable user experience, two "people" list layouts that did not contain any other navigation or design elements, inspired by the two leading social networking sites: Facebook and LinkedIn, were selected. The content of each selection was identical in terms of the number of names and descriptions listed, except that the Facebook-inspired interface included pictures of the individuals and the LinkedIn-inspired design only listed name and title.

The LinkedIn and Facebook designs are referred to as the 3-Column Layout and the 1-Column Layout, respectively, throughout the report.

Three presumptions galvanized the study design:

• The page that provides the list of friends or connections is a crucial step in the usage of these sites
• From the user's perspective, one must be able to easily use the list to identify new connections to find the service useful and appealing
• The site owner will be interested in doing everything possible to facilitate the expansion of each user's network, making them more likely to rely on the site to communicate with their network 

In order to simulate "real world" use of the two tested interfaces, tasks were created that would mimic the act of scanning a list for someone recognizable without knowing specifically who they are. And, more specifically, scanning for a recognizable name. Each participant was presented simulated tasks in both layouts.

Overall, the 1-Column layout was a much more effective and enjoyable way of presenting the tested information. This preference was clearly articulated by users during follow-up qualitative sessions, and was also supported by heatmaps and gaze plots during Eye Tracking.  The single column of names was easy to read straight down during the Name Recognition Task, and users were able to "ignore" the adjacent column which contained information that wasn't relevant to the current task. Similarly, users scanned vertically down the title/description column when searching.

All participants scanned the 1-Column layout the same way and there was very little hesitation or exploration at the start of the task. Users were able to dive right into scanning without having to experiment with different scanning strategies.

The 3-Column layout was thought by most participants to be more cumbersome and overwhelming in its design. And participants felt much less confident that they had successfully completed the tasks with the 3-Column layout... they did not feel sure that they had seen all the names.

Eye Tracking of the 3-Column layout revealed that the participants did not adopt a consistent scanning strategy for this design. Moreover, most participants had to begin by experimenting with different scanning strategies before "deciding" which one to use.

Of importance in gaining a comfort level in internalizing the results of this study, it is suggested that our readers review the more complete data including "Gaze Plots," indicate the progression of each user's attention on the page, while showing places where users paused, or "fixated," on a particular spot. In addition, Eye Tracking "Heatmaps" show the attention "hotspots" on a page for all the tested participants combined. Areas are shown in selected colors for the greatest relative attention, medium attention and low attention.

3-Column Layout findings included such things as:

• Overall, the test participants did not agree on a consistent strategy for scanning the names on the list in the 3-Column layout
• The gaze plots also indicate that many of the names on the list escaped the users' attention
• Of those users who read the information horizontally, some followed an S-shaped pattern ,while others read from left to right as if reading a book
• Some users opted to scan everything in view first, before scrolling to view the rest of the page. Notably, some users were observed to change their reading strategy once they started to scroll
• If users felt overwhelmed by the amount of information displayed, it became difficult for them to focus on the information necessary to complete a task
• Many users said it was difficult to parse out the names from the descriptions (and vice versa) since they were arranged in such close proximity to each other
• Though most users were able to correctly identify the recognizable names, many said they weren't 100% sure they had seen all possible names

1-Column Layout findings included:

• All users scanned the information vertically. While there were occasional glances at pictures or names (depending on the task ) users followed the same general pattern of reading down the page as they scrolled
• It was not necessary for users to spend time "figuring out" how to scan the information so they immediately went about finding names or descriptions
• Since the page required users to scroll multiple times, users frequently "backtracked" up the page with their eyes as they scrolled
• Users commented that they enjoyed looking at pictures occasionally out of curiosity or to gain a bit more information about the person. While they admitted pictures were not always necessary to complete a task, they preferred to see them because it bolstered the overall appeal of the page
• Users found it easier to focus only on the information relevant to each task
• Since they were able to segregate the names, pictures, and job titles from each other, users were able to easily find the information they needed to look at given the particular task
• On average, users spent more time in the 1-Column layout to complete each task, but said they more confident they had seen all possible names and relevant descriptions

Follow-up discussions reinforced the Eye Tracking findings indicating that the 1-column design is a much more effective layout for accurately accomplishing the key networking goals of scanning. Participants unanimously preferred the 1-column format, saying they were more confident in their success after using this layout as compared to the 3-Column version, and reported feeling more at ease while performing the tasks.

To view the complete study in a PDF file with colored scanning charts, please visit here.

 In addition, the CEO of the Catalyst Group prefaces the study at this link.