Professional Writing 101: Readability Design

Foreword

The Professional Writing 101 series aims to educate readers on the best practices applied to various industries that utilize professional writers. This series will dive into several aspects of writing such as professional writing pedagogies, defining and analyzing the audience, and document and readability design.

The Professional Writing 101 series will be divided into 6 main chapters:

1. Professional Writing 101: English as an Industry

2. Professional Writing 101: Writers as Vessels

3. Professional Writing 101: Responsibility of Rhetoric

4. Professional Writing 101: Readability Design

5. Professional Writing 101: Collecting and Utilizing Audience Data

6. Professional Writing 101: Digital Tools for Better Writing

Professional writers spend a notable amount of time perfecting a document's writing composition, such as ensuring appropriate grammar and tone, word choice, and essential information. However, after finishing their text, writers must consider the presentation of the text itself. Today's digital landscape has created an abundance of writing opportunities, thanks to which writers publish a fair amount of content online, and the name content writers become a widespread a career title. Essentially, content writing is the process of publishing, editing, and writing online content. Online content generally consists of blog posts, advertisements for products and services, digital news articles, social media posts, and important public information and announcements made by governmental bodies and organizations. In relation to that, the way writers present content, whether printed or digital, follows specific design guidelines intended to improve communication. Mark Aakhus (2007), Associate Dean for the School of Communication at Rutgers, The State University, states,

What becomes immediately apparent upon seeing communication in terms of design is the broad and deep interest in structuring, shaping, and conditioning discourse. This is evident in the varieties of designs for communication apparent in the institutions, practices, procedures, and technologies present (p. 112).

Visual presentation emphasizes keywords and information for the reader to take away. If the fonts and format of the letters lack readability, frustrated readers will click elsewhere. Therefore, understanding how to apply readability design to content is an essential skill for writers online.

Figure 1: Reading print and reading on technology. - Unknown. Bigstock. (n.d.).

Before discussing the specifics of readability design, writers must understand online reading habits and patterns and how they differ from reading print texts. The context of the formatting influences people’s approaches to reading. Naomi S. Baron (2017), a linguist and Professor Emerita of Linguistics at American University, published a study concerning the reading process for print versus digital content. Baron asked questions to more than 400 students from the U.S., Japan, Germany, Slovakia, and India relating to their attitudes toward reading in print and online. Baron articulates this surprising discovery, “the most dramatic finding for this set of questions came in response to the query about the platform on which students felt they concentrated best. Selecting from print, computer, tablet, e-reader, or mobile phone, 92% said it was easiest to concentrate when reading print” (p. 18). This shockingly high consensus proves the easy distractibility induced by digital print. Some may argue that the display (screen versus paper) plays a role, but the above-mentioned study found that in general, readers' attitudes regarding these two mediums set the tone for the reading process. Reading print allows for physical handling of the content material versus the casual passivity of reading on a screen. Baron (2017) defines the challenge of writing online by stating,

The biggest challenge to reading attentively on digital platforms is that we largely use digital devices for quick action […] our now-habitualized instincts tell us to move things along (p. 18).

These findings reflect reality expertly, as one often logs onto social media to witness someone else reposting a news article and reacting solely to the headline and photo. The Internet's abundance of information naturally leads to constant multi-tasking, and many users have several tabs open at once for various reasons, from shopping to research; and while browsing the net, advertisements on websites also impede concentration.

Figure 2: The editing process. - Editorial Illustration. Yu, C. 2015.

Another factor writers must consider is the tendency for online readers not to 'read' but to scan. Iwan Fauzi (2018), a professor in Applied Linguistics and ESL at the Universitas Palangka Raya in Indonesia, researched the effectiveness of skimming and scanning strategies in students. Fauzi defines reading as “a constructive process that can help students to acquire new knowledge” (p. 102). This idea can be used to define the process of communication generally, but Fauzi adds that "readers can convey the meaning through the written symbols and process them into their mind” (p. 102). This second part of his definition underscores the reader's participation in the process. Reading is an active, fully-engaged process without interruption. In contrast, scanning is defined as “[A] more a limited activity, only retrieving information relevant to a purpose…searching for some particular piece of information in the text quickly” (Fauzi, 2018, p. 106). Although scanning is a time-saving benefit for readers, it does not contribute to full comprehension and long-term knowledge.

Figure 3: Reading process. - Man Reading Book While Sitting On Pile. Luadthong, T. 2019.

Scanning is mostly performed for obtaining any last-minute information or a hyper-specific piece of information the reader already knows. However, this rapid reading strategy has become the standard way of gaining new information online. It follows that writers must adjust their writing and design to make their content easy to be looked over.

At first glance, legibility and readability could sound quite synonymous, but they address slightly different ideas. The Cambridge Dictionary (2022) defines readability as, “the quality of being easy and enjoyable to read” (readability, n.), and legibility as “the degree to which writing or text can be read easily because the letters are clear [and] the text is printed well” (legibility, business English). Therefore, constructing a clear layout of individual letters that are easily distinguishable, improves the overall readability of the content. In an analysis of web design textbooks, Heidi L. Everett (2014), a Ph.D. in Technical Communication claims,

We know that cognitive learning and visual communication theory call for consistency, repetition, and similarity for Web users to learn, remember, and recognize information and organization on the Web (p. 253).

Composition in writing is essential for seamless transitions from one idea to another, but the visual structure also matters. The union between quality word choice and visual elements works as a compelling constituent in readability design. In this area, these design elements should remain consistent for the best levels of retention and lessen the possibility of the reader clicking away from the content. Concurrently, readability allows readers to find information quickly and efficiently.

To guarantee better formatting implementations, style guides map out guidelines and rules for writers to follow, streamlining the writing process and creating professional consistency in the organization of online content. These guidelines establish uniformity across a site and as a result, new and returning readers know what to expect and how to navigate the site easily. In truth, while there are key ideas to the successful execution of readability design, there is no ‘single’ way to implement style in writing, because it is subjective to the context and industry. Some online content platforms encourage the Oxford comma, which adds a comma before the word 'and' in a list of three or more words (e.g. red, white, and blue), while others will omit this last comma. Some content uses British English spelling, while others honor American English. Ultimately, there is no ‘right’ standard in style, but there should be consistency in the use of that style. Michelle Corbin Nichols’s (1998) research on technical writers and the use of style guides states, “time [is] saved in preparing information, editing information, and training new people…Writers are constantly negotiating style changes, and style guidelines can help eliminate some of this negotiation by limiting the number of choices” (p. 433). Even when several writers contribute to online content, consistency establishes professionalism and maintains the ‘brand’ of the organization or business's content structure.

Figure 4: Designing process. Design Workspace. - Studio. Tubik Studio. (n.d.).

Since digital content is scanned for essential information, giving readers a site or a content map when visiting a website helps to save precious time. Many sites will open a feedback form or conduct user research to gather preferences from visitors on how to improve their content and design. Nichols (1998) lists the following results taken from a user preference test:

• Make the information scannable.

• Put the information in columns.

• Use lists instead of paragraphs, when possible.

• Use headings to break up text.

• Separate the hypertext links from the text of the paragraph.

• Present general information first and link to the more specific types of information (p. 435).

Not every platform will organize its digital content in this way. Some digital content might be presented in a long-form and highly academic style with an official bibliography, such as this article, and the audience expects this standard. One may also find useful and well-written information on a different platform that adopts a more casual tone and uses the structural tactics from the list above, but still, style guidelines vary based on the platform's target demographic and vision.

Regardless of the platform, readability design elements in style guides are the same and include font size and style, color contrast, white space, line spacing, text width, length, headings, and visual aids. However, some less technical aspects, such as age groups and cultural factors also impact web readability, though some parallels do exist between online readers regardless of the age range. For example, Hussain et. al (2011) conducted a study to find readability factors for various ages, discovering that both teenage-aged and older readers had some similarities in their online reading preferences. Concerning font preferences, Hussain et. al summarized, “decorative font styles do not fascinate youngsters much. Simple styles with communicating features fascinate them much” (p. 975). Similarly, elderly users reported, “do not use decorative font styles, as it is hard to comprehend and appears awkward” (p. 975). This finding suggests that intricate text may be appropriate for titles or logos to catch attention, but falls flat in the bodies of text which contain vital information.

Figure 5: Reading text. - Chronicle of Higher Education. Plunkert, D. 2014.

Moreover, text conveying essential information, such as headings and bodies of text in digital content should have an appropriate font design, otherwise known as typography. Most fonts exist within two groups - Serif and Sans Serif. Serif refers to the small strokes added to the letters such as in Times New Roman, and Sans Serif fonts, such as Arial, lack these extra stroke features. Hojjati and Muniandy’s (2014) research on the impact of fonts and readability determined that Sans Serif is easier to read for online documents because computer screens have much lower dpi (dots per inch) than printed text (Amdur, as cited in Hojjati & Muniandy, 2014). This is the reason why a picture with a lower dpi looks great on a computer screen but has poor resolution if printed. Specifically, Hojjati and Muniandy uncovered a font type best suited for online texts,

Verdana was considered definitely to improve [the] readability of text performing on a computer screen. In theory, text on [the] screen should be quite recognizable (2014, p. 163).

Hojjati and Muniandy's research focused on students who consumed much of their educational content online via online articles and journals. These findings can help online writers in choosing the best typography in order to improve readability for the readers' sake.

Figure 6: Typography art. - The Raven. Antonio. 2007.

Additionally, line spacing and alignment impact readability design too. Jonathan Ling and Paul van Schaik, who have a Ph.D. in research and behavioral science, conducted a study that tested online users’ reactions to digital text presentation and their reading speed. They concluded, “participants performed better with double line spacing than with 1.5 spacing, and better with 1.5 than single spacing. Similarly, where a difference existed, performance was always better with left-aligned than justified text” ( (2007, p. 11). Justified text increases the amount of space between words so that each side of the page has clean straight edges. Moreover, since the left-justified text increases readability, it presents itself as more professional. These design strategies aim to make digital content visually appealing and adjust it to fit the Internet’s standard of ‘scanning’. As a consequence, online text produced with these premises should be both readable and scannable.

Finally, another significant element of the readability design is visual aids. Examples of visual aids are tables, graphs, photographs, and art, and the type chosen highly depends on the medium. Some function as informational graphics, while others function as supporting images. Regardless, they must always align with and help support the content. In the aforementioned study by Hussain et. al (2011), they found that teenagers (when compared to older adults) tend to prefer “visuals, simulations, audio and video” as it makes for a more stimulating reading experience (p. 975). In fact, visuals help readers conceptualize what they read, and in cases where an article discusses highly technical information, a simple infographic reinforces a reader’s understanding and breaks up long texts. Images relevant to the content can be used to conceptualize a mentioned example or as evidence of an idea or argument. For example, a historical article will typically include images of the time period depicting artifacts or historical figures.

Figure 7: Reading is a visual process. - Eye in a book. Sutherland, S. 2013.

At the same time, this break in words gives readers a moment to rest and connect one idea to the next. Of course, the overuse of anything does more harm than good. Allison Kilgannon (2022), the author of the textbook Provincial English, which provides instruction on writing practices for students, writes, “overusing these elements defeats the purpose because the viewer may become overwhelmed or distracted. Tables, charts, and graphs simplify complex information, but without clear labels and legible text, they will confuse the audience” (What Makes Visual Aids Effective? Section, para. 4). When leveraged well, visual aids are a valuable component of readability design and will elevate the quality of content.

If reading is a process for acquiring new knowledge as Iwan Fauzi suggests, then readability design should make obtaining that new knowledge as attainable as possible. Only excellent readability design practices can facilitate a fluid reading experience. Writing for the web presents greater challenges than print as the platform is more susceptible to the absent-mindedness of ‘browsing.' Furthermore, while design varies across online platforms, websites with professional appearances and high readability are distinguishable from the others as reliable sources with accessible messages. Mark Aakhus (2007) reiterates his ideas in reference to communication design, asserting, "there are, in principle, an unlimited number of designs for communication, and these designs are distinguishable by considering what an institution, practice, procedure, or technology presupposes about communication" (p.114). In conclusion, Aakhus's idea reinforces the suggestion of there being no 'right way' to design, as various groups each have a unique methodology for communication. Yet, one fact remains universal across these groups for readability design: make the words readable and the content's message reachable.

Sources

Aakhus, M. (2007). Communication as Design. Communication Monographs, 74(1), 112–117. https://doi.org/10.1080/03637750701196383

Amdur, D. (2006). Typographic Design in the Digital Studio (Graphic Design/Interactive Media) (1st ed.). Course Technology.

Baron, N. S. (2017). Reading in a digital age. The Phi Delta Kappan, 99(2), 15–20. Retrieved from http://www.jstor.org/stable/26388266

Cambridge Dictionary & Cambridge University Press. (2022a). Legibility, business English. Retrieved from https://dictionary.cambridge.org/dictionary/english/legibility

Cambridge Dictionary & Cambridge University Press. (2022). Readability, n. Retrieved from https://dictionary.cambridge.org/dictionary/english/readability

Everett, H. L. (2014). Consistency & contrast: a content analysis of web design instruction. Technical Communication, 61(4), 245–256. Retrieved from http://www.jstor.org/stable/43748721

Fauzi, I. (2018). The Effectiveness of Skimming and Scanning Strategies in Improving Comprehension and Reading Speed Rates to Students of English Study Programme. Register Journal, 11(1), 101–120. https://doi.org/10.18326/rgt.v11i1.101-120

Hojjati, N., & Muniandy, B. (2014). The effects of font type and spacing of text for online readability and performance. Contemporary Educational Technology, 5(2), 161–174. https://doi.org/10.30935/cedtech/6122

Hussain, W., Sohaib, O., Qasim Khan, M., & Ahmed, A. (2011). Web readability factors affecting users of all ages. Australian Journal of Basic and Applied Sciences 5(11), 5(11), 972–977. Retrieved from https://www.researchgate.net/publication/268205667_Web_Readability_Factors_Affecting_Users_of_All_Ages

Kilgannon, A. (2022). Provincial English. Pressbooks, BCcampus Open Education. Retrieved from https://opentextbc.ca/provincialenglishabe/chapter/incorporating-effective-visuals-into-a-presentation/

Ling, J., & van Schaik, P. (2007). The influence of line spacing and text alignment on visual search of web pages. Displays, 28(2), 60–67. https://doi.org/10.1016/j.displa.2007.04.003

Nichols, M. C. (1994). Using style guidelines to create consistent online information. Technical Communication, 41(3), 432–438. Retrieved from http://www.jstor.org/stable/43088470

Visual References

Figure 1: Bigstock. (n.d.). Unknown. [Photograph]. Institute for the Future of Education. https://observatory.tec.mx/edu-bits-2/using-the-arts-to-improve-reading-comprehension

Figure 2: Yu, C. (2015). Editorial Illustration. [Illustration]. Behance. https://www.behance.net/gallery/28590003/Editorial-Illustration-2015-1/modules/185629623

Figure 3: Luadthong, T. (2019). Man Reading Book While Sitting On Pile. [Digital art- Illustration]. Fine Art America. https://images.fineartamerica.com/images/artworkimages/mediumlarge/2/man-reading-book-while-sitting-on-pile-tithi-luadthong.jpg

Figure 4: Tubik Studio. (n.d.). Design workspace. [Illustration]. Tubik Studio. https://blog.tubikstudio.com/digital-illustrations-artworks-on-design-process/

Figure 5: Plunkert, D. (2014). Chronicle of Higher Education. [Illustration]. https://spurdesign.com/blog/2014/1/6/chronicle-of-higher-education

Figure 6: Antonio. (2007). The Raven. [Illustration]. Deviant Art. https://www.deviantart.com/swordfishll/art/The-Raven-67233782

Figure 7: Sutherland, S. (2013). Eye in a book. [Drawing, Pencil on Paper]. Pixels. https://pixels.com/featured/eye-in-a-book-sarah-sutherland.html