Automated prediction of visual complexity of web pages: Tools and evaluations

Abstract Understanding visual complexity as it relates to websites has been an emergent area for many years. However, predicting the visual complexity of a website as perceived by users has been a real challenge. Perception is important because it influences user engagement, dictating if they will find it dull, engaging, or too complex. While others have suggested solutions to certain levels of success, here we propose a simple but accurate model that generates a Visual Complexity Score (VCS) based on common aspects of an HTML Document Object Model (DOM). We created our model based on a statistical analysis of 3300 ratings of 55 users on 30 web pages. We then implemented this prediction model in an open source Eclipse framework called ViCRAM that both predicts and visualises the complexity of web pages in the form of a pixelated heat map. Finally, we evaluated this model and the tool prediction with another user study of 6240 ratings of 104 users on 30 web pages. This study shows that our tool can predict the perceived complexity with a strong correlation to users’ perceived complexity.

[1]  Helmut Leder,et al.  Just how stable are stable aesthetic features? Symmetry, complexity, and the jaws of massive familiarization. , 2009, Acta psychologica.

[2]  Armando Barreto,et al.  Visual Impairments , 2008, Web Accessibility.

[3]  Robert Stevens,et al.  How people use presentation to search for a link: expanding the understanding of accessibility on the Web , 2006, W4A '06.

[4]  Thorsten Joachims,et al.  Eye-tracking analysis of user behavior in WWW search , 2004, SIGIR '04.

[5]  Yeliz Yesilada,et al.  “The Best of Both Worlds!” , 2020, ACM Trans. Web.

[6]  Mark A. Hofmann,et al.  Visual Workload of the Copilot/Navigator during Terrain Flight , 1979 .

[7]  C. Heaps,et al.  Similarity and Features of Natural Textures , 1999 .

[8]  Linn Marks Collins.  Integrative multimedia design , 1994, CHI Conference Companion.

[9]  M. Elgin Akpinar,et al.  Discovering Visual Elements of Web Pages and Their Roles: Users' Perception , 2017, Interact. Comput..

[10]  Antonella De Angeli,et al.  Computation of Interface Aesthetics , 2015, CHI.

[11]  D. Hoang.  FLOW: The Psychology of Optimal Experience , 2018 .

[12]  Bing Li,et al.  Multimodal Web Aesthetics Assessment Based on Structural SVM and Multitask Fusion Learning , 2016, IEEE Transactions on Multimedia.

[13]  J. E. Russo,et al.  An Eye-Fixation Analysis of Choice Processes for Consumer Nondurables , 1994 .

[14]  Yeliz Yesilada,et al.  Scanpath Trend Analysis on Web Pages , 2016, ACM Trans. Web.

[15]  Michael L. Bernard,et al.  The effects of font type and size on the legibility and reading time of online text by older adults , 2001, CHI Extended Abstracts.

[16]  Yeliz Yesilada,et al.  “Keep it simple!”: an eye-tracking study for exploring complexity and distinguishability of web pages for people with autism , 2020, Universal Access in the Information Society.

[17]  Jodi Forlizzi,et al.  A study of fonts designed for screen display , 1998, CHI.

[18]  Robert J. K. Jacob,et al.  Eye tracking in advanced interface design , 1995 .

[19]  Caroline Jay,et al.  Analysing the visual complexity of web pages using document structure , 2013, Behav. Inf. Technol..

[20]  Sean Bechhofer,et al.  Visual complexity and aesthetic perception of web pages , 2008, SIGDOC '08.

[21]  Ilze Zigurs,et al.  Causal Factors for Web Site Complexity , 2008 .

[22]  Philip Smith,et al.  CD-I Designers Guide , 1992 .

[23]  Lei Shi,et al.  Measuring the Visual Complexities of Web Pages , 2013, TWEB.

[24]  John Hamer,et al.  Investigating Objective Measures of Web Page Aesthetics and Usability , 2011, AUIC.

[25]  Robert Stevens,et al.  Toward a definition of visual complexity as an implicit measure of cognitive load , 2009, TAP.

[26]  Alistair G. Sutcliffe,et al.  Making contact points between text and images , 1998, MULTIMEDIA '98.

[27]  Katharina Reinecke,et al.  Predicting users' first impressions of website aesthetics with a quantification of perceived visual complexity and colorfulness , 2013, CHI.

[28]  Antonella De Angeli,et al.  Quantification of interface visual complexity , 2014, AVI.

[29]  Melody Y. Ivory,et al.  Evolution of web site design patterns , 2005, TOIS.

[30]  Yuanzhen Li,et al.  Measuring visual clutter. , 2007, Journal of vision.

[31]  J. Henderson,et al.  The effects of semantic consistency on eye movements during complex scene viewing , 1999 .

[32]  Andy P. Field,et al.  Discovering Statistics Using SPSS , 2000 .

[33]  Caroline Jay,et al.  Validating the use and role of visual elements of web pages in navigation with an eye-tracking study , 2008, WWW.

[34]  Antonino Santos,et al.  Computerized measures of visual complexity. , 2015, Acta psychologica.

[35]  Junji Maeda,et al.  Accessibility designer: visualizing usability for the blind , 2004, Assets '04.

[36]  K. Rayner.  Eye movements in reading and information processing: 20 years of research. , 1998, Psychological bulletin.

[37]  Michael L. Mack,et al.  Identifying the Perceptual Dimensions of Visual Complexity of Scenes , 2004 .

[38]  Alexandre N. Tuch,et al.  Symmetry and aesthetics in website design: It's a man's business , 2010, Comput. Hum. Behav..

[39]  Ruth Rosenholtz,et al.  Do predictions of visual perception aid design? , 2011, TAP.

[40]  Gerald L. Lohse,et al.  A Comparison of Two Process Tracing Methods for Choice Tasks , 1996 .

[41]  Antti Oulasvirta,et al.  Adaptive feature guidance: Modelling visual search with graphical layouts , 2020, Int. J. Hum. Comput. Stud..

[42]  Marti A. Hearst,et al.  Empirically validated web page design metrics , 2001, CHI.

[43]  David Carmel,et al.  The connectivity sonar: detecting site functionality by structural patterns , 2003, HYPERTEXT '03.

[44]  Noam Tractinsky,et al.  Assessing dimensions of perceived visual aesthetics of web sites , 2004 .

[45]  Richard H. Hall,et al.  The impact of web page text-background colour combinations on readability, retention, aesthetics and behavioural intention , 2004, Behav. Inf. Technol..

[46]  Clemens Holzmann,et al.  Measuring Visual User Interface Complexity of Mobile Applications With Metrics , 2018, Interact. Comput..

[47]  Nadine B. Sarter,et al.  Display Clutter , 2015, Hum. Factors.

[48]  Jens Riegelsberger,et al.  Could I have the Menu Please? An Eye Tracking Study of Design Conventions , 2004 .