Guideline-Based Evaluation of Web Readability

Effortless reading remains an issue for many Web users, despite a large number of readability guidelines available to designers. This paper presents a study of manual and automatic use of 39 readability guidelines in webpage evaluation. The study collected the ground-truth readability for a set of 50 webpages using eye-tracking with average and dyslexic readers (n = 79). It then matched the ground truth against human-based (n = 35) and automatic evaluations. The results validated 22 guidelines as being connected to readability. The comparison between human-based and automatic results also revealed a complex framework: algorithms were better or as good as human experts at evaluating webpages on specific guidelines - particularly those about low-level features of webpage legibility and text formatting. However, multiple guidelines still required a human judgment related to understanding and interpreting webpage content. These results contribute a guideline categorization laying the ground for future design evaluation methods.

[1]  Shawn Lawton Henry,et al.  Developing Text Customisation Functionality Requirements of PDF Reader and Other User Agents , 2012, ICCHP.

[2]  Konstantinos Chorianopoulos,et al.  User Interface Design Principles for Interactive Television Applications , 2008, Int. J. Hum. Comput. Interact..

[3]  Husniza Husni,et al.  Interaction design for dyslexic children reading application: A guideline , 2012 .

[4]  Stephanie Rosenbaum,et al.  The Future of Usability Evaluation: Increasing Impact on Value , 2008, Maturing Usability.

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

[6]  Cheol Lee,et al.  A Usability Checklist for the Usability Evaluation of Mobile Phone User Interface , 2006, Int. J. Hum. Comput. Interact..

[7]  Alexandre N. Tuch,et al.  The role of visual complexity and prototypicality regarding first impression of websites: Working towards understanding aesthetic judgments , 2012, Int. J. Hum. Comput. Stud..

[8]  Antonella De Angeli,et al.  Pick me!: Getting Noticed on Google Play , 2016, CHI.

[9]  Scott Henninger,et al.  A methodology and tools for applying context-specific usability guidelines to interface design , 2000, Interact. Comput..

[10]  Rob Miller,et al.  Enhancing web page readability for non-native readers , 2010, CHI.

[11]  Tonya L. Smith-Jackson,et al.  A heuristic checklist for an accessible smartphone interface design , 2013, Universal Access in the Information Society.

[12]  John M. Carroll,et al.  Designing claims for reuse in interactive systems design , 1999, Int. J. Hum. Comput. Stud..

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

[14]  Panayiotis Zaphiris,et al.  Research-derived web design guidelines for older people , 2005, Assets '05.

[15]  Zhong-Lin Lu,et al.  Motion-Perception Deficits and Reading Impairment , 2006, Psychological science.

[16]  D. Bates,et al.  Fitting Linear Mixed-Effects Models Using lme4 , 2014, 1406.5823.

[17]  Antonella De Angeli,et al.  Do patterns help novice evaluators? A comparative study , 2011, Int. J. Hum. Comput. Stud..

[18]  Stefan Winkler,et al.  Image complexity and spatial information , 2013, 2013 Fifth International Workshop on Quality of Multimedia Experience (QoMEX).

[19]  Helen Petrie,et al.  The relationship between accessibility and usability of websites , 2007, CHI.

[20]  R. Flesch A new readability yardstick. , 1948, The Journal of applied psychology.

[21]  T. Slattery Eye movements: from psycholinguistics to font design. , 2016 .

[22]  Ulrich Schiefele,et al.  Topic interest and free recall of expository text. , 1996 .

[23]  Robin Jeffries,et al.  Usability testing vs. heuristic evaluation: was there a contest? , 1992, SGCH.

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

[25]  Vagner Figuerêdo de Santana,et al.  Firefixia: an accessibility web browser customization toolbar for people with dyslexia , 2013, W4A.

[26]  Diane Nelson Bryen,et al.  Web accessibility design recommendations for people with cognitive disabilities , 2008 .

[27]  J. Talcott,et al.  Adults with Dyslexia Demonstrate Large Effects of Crowding and Detrimental Effects of Distractors in a Visual Tilt Discrimination Task , 2014, PloS one.

[28]  Vagner Figuerêdo de Santana,et al.  Web accessibility and people with dyslexia: a survey on techniques and guidelines , 2012, W4A.

[29]  Martin Pielot,et al.  Make It Big!: The Effect of Font Size and Line Spacing on Online Readability , 2016, CHI.

[30]  K Rayner,et al.  Eye movements and the perceptual span in beginning and skilled readers. , 1986, Journal of experimental child psychology.

[31]  A. Inhoff,et al.  Visual Factors and Eye Movements in Reading. , 1981 .

[32]  J. Ziegler,et al.  Extra-large letter spacing improves reading in dyslexia , 2012, Proceedings of the National Academy of Sciences.

[33]  Alexiei Dingli,et al.  An Intelligent Framework for Website Usability , 2014, Adv. Hum. Comput. Interact..

[34]  Marti A. Hearst,et al.  Improving Web Site Design , 2002, IEEE Internet Comput..

[35]  Leanne Bowler,et al.  Web portal design guidelines as identified by children through the processes of design and evaluation , 2007, ASIST.

[36]  Gustavo Rossi,et al.  Automatic detection of usability smells in web applications , 2017, Int. J. Hum. Comput. Stud..

[37]  Arthur C. Graesser,et al.  Coh-Metrix: Analysis of text on cohesion and language , 2004, Behavior research methods, instruments, & computers : a journal of the Psychonomic Society, Inc.

[38]  Markel Vigo,et al.  Benchmarking web accessibility evaluation tools: measuring the harm of sole reliance on automated tests , 2013, W4A.

[39]  Jinwook Seo,et al.  EyeBookmark: Assisting Recovery from Interruption during Reading , 2015, CHI.

[40]  Antonella De Angeli,et al.  Design Guidelines for Web Readability , 2017, Conference on Designing Interactive Systems.

[41]  Stephen J. Morrissey,et al.  Reviews of Human Factors and Ergonomics , 2008 .

[42]  Mary Frances Theofanos,et al.  Bridging the gap: between accessibility and usability , 2003, INTR.

[43]  P Kember,et al.  The legibility and readability of a visual display unit at threshold. , 1987, Ergonomics.

[44]  David R. Schwartz,et al.  The use of guidelines in interface design , 1991, CHI.

[45]  Rosa Yáñez Gómez,et al.  Heuristic Evaluation on Mobile Interfaces: A New Checklist , 2014, TheScientificWorldJournal.

[46]  Aries Arditi,et al.  Letter case and text legibility in normal and low vision , 2007, Vision Research.

[47]  Kasper Hornbæk,et al.  Must evaluation methods be about usability? Devising and assessing the utility inspection method , 2014, Behav. Inf. Technol..

[48]  Mary Zajicek,et al.  Successful and available: interface design exemplars for older users , 2004, Interact. Comput..

[49]  C. Marlin Brown,et al.  Human-Computer Interface Design Guidelines , 1998 .

[50]  Ricardo Baeza-Yates,et al.  Layout guidelines for web text and a web service to improve accessibility for dyslexics , 2012, W4A.

[51]  Ian G. McKeith,et al.  Foresight Mental Capital and Wellbeing Project , 2014 .

[52]  Kristina Höök,et al.  Strong concepts: Intermediate-level knowledge in interaction design research , 2012, TCHI.

[53]  Jean Vanderdonckt,et al.  Quality Models for Automated Evaluation of Web Sites Usability and Accessibility , 2005 .

[54]  K. Roberts Foresight mental capital and wellbeing project , 2010 .

[55]  Moira C. Norrie,et al.  W3touch: metrics-based web page adaptation for touch , 2013, CHI.

[56]  Joseph S. Dumas,et al.  Usability assessment methods , 2006 .

[57]  Antonella De Angeli,et al.  Visual complexity of graphical user interfaces , 2018, AVI.

[58]  Ricardo Baeza-Yates,et al.  Evaluation of DysWebxia: a reading app designed for people with dyslexia , 2014, W4A.