Design Guidelines for Web Readability

Reading is fundamental to interactive-system use, but around 800 million of people might struggle with it due to literacy difficulties. Few websites are designed for high readability, as readability remains an underinvestigated facet of User Experience. Existing readability guidelines have multiple issues: they are too many or too generic, poorly worded, and often lack cognitive grounding. This paper developed a set of 61 readability guidelines in a series of workshops with design and dyslexia experts. A user study with dyslexic and average readers further narrowed the 61-guideline set down to a core set of 12 guidelines -- an acceptably small set to keep in mind while designing. The core-set guidelines address reformatting -- such as using larger fonts and narrower content columns, or avoiding underlining and italics -- and may well aply to the interactive system other than websites.

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

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

[3]  Trichur Raman Vidyasagar,et al.  Dyslexia: a deficit in visuo-spatial attention, not in phonological processing , 2010, Trends in Cognitive Sciences.

[4]  Ani Nenkova,et al.  Revisiting Readability: A Unified Framework for Predicting Text Quality , 2008, EMNLP.

[5]  P. Cavanagh,et al.  Attentional resolution and the locus of visual awareness , 1996, Nature.

[6]  J. Rabe-Jabłońska,et al.  [Affective disorders in the fourth edition of the classification of mental disorders prepared by the American Psychiatric Association -- diagnostic and statistical manual of mental disorders]. , 1993, Psychiatria polska.

[7]  D. Spinelli,et al.  Crowding Effects on Word Identification in Developmental Dyslexia , 2002, Cortex.

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

[9]  D. Levi,et al.  Visual crowding: a fundamental limit on conscious perception and object recognition , 2011, Trends in Cognitive Sciences.

[10]  Gordon Rugg,et al.  The sorting techniques: a tutorial paper on card sorts, picture sorts and item sorts , 1997, Expert Syst. J. Knowl. Eng..

[11]  Chen Chen,et al.  Shorter Lines Facilitate Reading in Those Who Struggle , 2013, PloS one.

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

[13]  Curt C. Braun,et al.  The influence of color on warning label perceptions , 1995 .

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

[15]  Manuel Perea,et al.  Does viotin activate violin more than viocin? On the use of visual cues during visual-word recognition. , 2014, Experimental psychology.

[16]  D. Spinelli,et al.  Crowding, reading, and developmental dyslexia. , 2009, Journal of vision.

[17]  Curt C. Braun,et al.  Perceived readability of warning labels with varied font sizes and styles , 1993 .

[18]  P. H. Seymour,et al.  Foundation literacy acquisition in European orthographies. , 2003, British journal of psychology.

[19]  Chwen Jen Chen,et al.  Web text reading: what satisfy both dyslexic and normal learners? , 2015, Journal of Computers in Education.

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

[21]  F. Fazio,et al.  Dyslexia: Cultural Diversity and Biological Unity , 2001, Science.

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

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

[24]  Y. Yeshurun,et al.  Precueing attention to the target location diminishes crowding and reduces the critical distance. , 2010, Journal of vision.

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

[26]  Martin Pielot,et al.  Size matters (spacing not): 18 points for a dyslexic-friendly Wikipedia , 2013, W4A.

[27]  Ricardo Baeza-Yates,et al.  Good fonts for dyslexia , 2013, ASSETS.

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

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

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

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

[32]  James E. Jackson Towards Universally Accessible Typography: A Review of Research on Dyslexia , 2014 .

[33]  Panayiotis Zaphiris,et al.  Web Navigation for Individuals with Dyslexia: An Exploratory Study , 2007, HCI.