Web interaction design optimizing List information structure eye movement research


List information structure is commonly used in web pages, a form like top-down distribution of information. For example, Facebook and other social networking sites in the usual flow of information, a lot of electricity supplier web site in the list of commonly used products, which belong to the List type information structure.

There are a lot of research about the structure of List

, its advantages is that it is in line with the top-down two basic rule – at present human nature of reading, from left to right. But after the eye movement research in recent years, its disadvantages are also more and more attention is found, the distribution is not uniform, at a top of the elements obtained 90% degree of concern, and the middle part of the element is difficult to be noticed, the specific details please refer to the blog.

Li, a professor at the Hong Kong Baptist University in Chen, published a paper last year that conducted eye movement studies on three List style information structures. Figure



as above, except in the general structure of list (a) based on Li Chen and tested to two after optimization of the structure of (B, c), is the original list is separated into several small parts, and give them with a small title. The hot chart and the browse sequence diagram are as follows:



can see from the figure that the distribution of user attention is more average in the latter two list structures, unlike the first list structure, which is rarely noticed in the middle. The experiment also proved that users in the latter two kinds of list structure in the purchase rate is higher. Look closely, you can find that in the latter two structures, the key role is the various "small title", it will be scattered around the user’s attention in tandem, so that the whole page as a whole. This concept may be instructive for the design of more rational list structure information flows.

source: http://s.nickinteractiondesign.com