This paper examines the effect of menu items placed around a slide, in the center of a webpage, on searching for information; the goal is to improve website page design. First, we show that most visitors direct their gaze away from the center slide and that when visitors move their eyes in the direction opposite to the side on which the target information is, the search time increases. Second, a probabilistic model is developed according to each initial gaze direction such that the search time can be inferred from each visitor's eye movement. From this model, we study behavioral properties of visitors whose search times are either long or short. Finally, we suggest that menu items should not be placed on both sides of a slide.
The Japanese style [
WII’18, March 11, 2018, Tokyo, Japan (a) Mixed-type
(b) Slide-independence type The ratios of landing pages of a slide-independence type to all landing pages of clubs in the J1 and J2 Leagues are 66.7% and 54.5%, respectively. Large clubs, having many supporters, seem to reflect the recent trend. However, since many clubs still adopt mixed-type landing pages, it is worthwhile clarifying issues on information search. Our pilot study showed that the search time increased when the target information was placed at a particular position around a slideshow. This indicates that slideshows might cause visitors trouble in searching for information in a mixed-type landing page. The aim of this paper is to clarify the effect of slideshows on an information search and propose a landing page design reflecting our findings. We will use gaze data to achieve this aim.
Recently, many studies utilizing gaze data to improve
website design have appeared. Indeed, important
information [
In this experiment, we recorded gaze data in a situation where visitors would search for desired information on the landing page of a website. The experiment stimulus was created based on the landing page (of the mixed-type) on
Slide the web site of a football club belonging to the J2 League. As shown in Figure 2, a slideshow moving from the right to the left direction at two second intervals was placed in the center, and menu items were laid out on both sides and at the bottom of the slideshow (12 positions). Either information on “mass media” or information on “match ticket” was chosen as the search target. The search target was presented at either the left (L) position or the bottom left (BL) position. The remaining 10 pieces of information placed in the menu items were chosen from information that supporters indicated a high interest in questionnaires. Subjects were asked to search for the target only once by being restricted to one of the search tasks in which the target was presented at the two positions (L and BL). Subjects were not given any information that would aid in the search before the experiment. While subjects were exposed to the stimulus, the coordinates of fixation points were assessed for each subject via an eye tracker (Tobii Pro X2-30). The experiment was conducted as follows: 1. Calibrate the coordinates of fixation points. 2. Present the target (information on mass media or match ticket) in the center of the slide for 0.5 seconds. 3. Have subjects click on the mouse after finding the target. The second step is a means to ensure that subjects gaze at the slide initially. It also prevents subjects from starting to search for the target before eye movement recording begins. A fixation is defined as maintaining the gaze at a single spot for more than 100 msec. The number of fixations is the total number of fixations throughout the experiment. The average duration of fixation is the sum of the durations divided by the number of fixations. The average eye movement velocity means the average of eye movement velocities through the experiment.
All the subjects were students in Kanazawa Institute of Technology. The total number was eighty-seven.
Figure 3 shows the average search time according to the target position (L or BL). The vertical axis indicates the search time, and the horizontal axis denotes the position. Analysis of variance shows that there was no significant difference in search times between the L and BL positions. Initial eye movements tell us that there were four gaze patterns. First, many subjects fell into one of two groups, those who moved their eyes to the right in order to avoid the movement of the slideshow, and those who moved their 8 7 ) ec 6 s ( e 5 m iT4 h rc 3 a eS 2 1 0 8 )7 c6 e (se5 im4 ch3 T ra2 e S1 0
L
BL eyes to the left. The number of subjects belonging to the former or latter group was 24 or 42, respectively. Second, the subjects in each group were further divided into two subgroups: one group consisting of subjects who moved their eyes directly to the right or left direction (dR or dL), and the other group consisting of subjects who moved their eyes first below and then to the right or left direction (bR or bL). Table 1 shows the number of subjects belonging to each subgroup (case). Twenty-one subjects were excluded because their eye movements were inconclusive. The eye movements of the excluded subjects were as follows: ten subjects moved their eyes to both sides repeatedly, five subjects kept their eyes on the center screen, and six subjects moved their eyes irregularly.
Figure 4 shows the average search time according to the initial eye movement direction (right or left). The vertical axis indicates the search time, and the horizontal axis denotes the eye movement direction. Analysis of variance shows that the difference was significant at a level of 1%; the search time is faster when moving to the left than to the right. This is an intuitive result because if the eyes move initially to the right, the gaze moves away from the target, thereby lengthening the distance of gaze movement. Hence, it is very important to prevent the eyes from moving initially to the right when the target is on the left. This suggests that menu items should not be laid out to the right of the slide. We consider the case where the eyes moved initially to the right. Table 2 shows the difference in search time between the L and BL positions in each of the dR and bR cases. It is seen from the table that in the dR case, the search time was a little longer in the L position than in the BL position. It is likely that in this case, after the initial gaze, the subsequent gaze advanced below along the right menu items and then moved from the right to left in the bottom menu items. Conversely, Table 2 shows that in the bR case, the search time was longer in the BL position than in the L position. Hence, it is inferred that in this case, the subsequent gaze advanced from the center to the right, rose over the right menu items, and crossed the slide to reach the target. From the above discussion, the conclusion might be that only the left menu items should remain in the layout. We will now consider the validity of this conclusion. Assume that the target is placed at the bottom right. It will be seen from symmetry of the experiment that if gaze moves initially to the left direction, then the result can be similar to the BL case in which the eyes moved initially to the right. Hence, the above-mentioned conclusion is incorrect, and it turns out that the menu items should be removed from both sides completely, i.e., not only from the right side but also from the left side.
Using a Bayesian network, we develop a probabilistic model that can infer the search time from eye movement data according to each initial eye movement. For this purpose, it is crucial to choose appropriate quantities among the eye movement data. Candidates for explanatory variables was decided based on the condition that they were not properties (e.g., the total duration of fixation) that were directly related to the search time but were average properties per one eye movement. Note that these data were continuous except for the gaze direction, which were of two levels: dR vs. bR or dL vs. bL. Hence, they had to be discretized to evaluate probability values in a discrete form. Each of the data sets was divided into three categories: S (small), M (medium), and L (large), such that the frequencies were similar. Using the eye movement data (transformed into discrete data) as explanatory variables, and the search time (also transformed into discrete data) as objective variables, we chose a set of optimal explanatory variables through the use of the analytical software Bayonet. An optimal graph structure was selected on the basis of the Akaike Information Criterion (AIC) and the accuracy rate. AIC is expressed as AIC = −2×MLL+2×(the number of probability parameters), where MLL refers to a maximum log-likelihood and the number of probability parameters denotes the total number of probability values running freely through the inference model. An inferred result is deemed a correct answer if it proves compatible with the observation. The accuracy rate is defined as the division of the number of correct answers
direction
velocity
velocity
(a) Right direction
(b) Left direction
by that of all samples. Given the requirement that the
accuracy rate of all three categories (S, M, L) of the search
time be greater than or equal to 0.5, the optimal model was
structured as a graph satisfying the requirement and
possessing the smallest AIC. Figure 5 shows the optimal
model regarding each case of the right (Figure 5(a)) and left
(Figure 5(b)) directions (for the initial gaze movement).
The numbers of parameters of the nodes in the right and left
direction models were 45 and 121, respectively. From the
figure, it is seen that the gaze direction (i.e., dR vs. bR or
dL vs. bL), the average eye movement velocity (movement
velocity), the average duration of fixation (duration of
fixation), and the maximum distance of eye movement
(maximum movement distance) were essential variables to
the search time. We examined the predictive capability of
the model for each of the initial gaze movement directions
by leave-one-out cross-validation [
Under the graph structure of Figure 5(a), we calculated a
conditional probability in the case where the eyes moved to
the right. Figures 6 and 7 show the conditional probabilities
that the search time was equal to L given the movement
velocity and the duration of fixation, for the dR and bR
cases, respectively. The vertical axis indicates the
conditional probability that the search time was equal to L,
and the horizontal axis denotes the duration of fixation.
Three types of lines correspond to the three category values
of the movement velocity. In the following consideration,
we will utilize the conclusion of Toda et al. [
From Figure 6, the probability that the search time was equal to L increased monotonically as the duration of fixation became longer, independently of the value of the movement velocity. Since, in the dR case, subjects had to review many menu items, according to the conclusion of Toda et al., it is seen that the search time was longer if they tried to take in the information accurately. Meanwhile, from Figure 7, in the bR case, the probability that the search time was equal to L was small if the duration of fixation was less than or equal to M accompanied by a fast movement velocity or if the duration of fixation was L together with a slow movement velocity. The conclusion of Toda et al. implies that in the bR case, if subjects could skim through each menu item or judge the compatibility of information with certainty, they had reached the target comparatively quickly; otherwise, they reached the target slowly. We also calculated the conditional probability from the graph structure of Figure 5(b) in the case where the eyes moved to the left. Figures 8 and 9 show the conditional probabilities that the search time was equal to S given the movement velocity and maximum movement distance, for the dL and bL cases, respectively. The vertical axis indicates the conditional probability that the search time equaled S, and the horizontal axis denotes the maximum movement distance. Three types of lines correspond to the three category values of the movement velocity.
Figure 8 implies that in the dL case, the probability that the search time was equal to S became large if the maximum movement distance was M and the movement velocity was more than or equal to M. Since the distance between the target and the center of the slide belongs to the category M, it follows that if subjects moved their eyes quickly over this distance, then the search time would be short. It can therefore be expected that this happened entirely by chance. However, Figure 9 suggests that in the bL case, the probability that the search time was equal to S was always below 0.5 regardless of the values of the maximum movement distance and movement velocity. Hence, in this case, there is no single way of browsing to make the search time short.
This study considered the effect of a slideshow on the search time for information based on gaze data. In particular, using a probabilistic inference model based on a Bayesian network, behavioral properties were analyzed in each of the cases where subjects moved their eyes initially to the right and to the left. We found that menu items laid out at both sides of the slide drew the subjects' gaze to judge the compatibility and caused them to scan for the target information, leading to increased information search time. We concluded that there should be no menu items on either side of the slide, i.e., neither the right nor the left side.
This work was supported by JSPS KAKENHI Grant Number 17K00392.
S
M Duration of fixation
L 0.8 y ilit0.6 b a ob0.4 r P 0.2
0 1 0.8 y t ili0.6 b a ob0.4 r P 0.2 0 1 0.8 y t ili0.6 b a ob0.4 r P 0.2 0 1 0.8 y t ili0.6 b a ob0.4 r P 0.2 0
S S
S
L L L