Reading on the Computer Screen : Does Font Type has Effects on Web Text Readability ?

Reading on the World Wide Web has become a daily habit nowadays. This can be seen from the perspective of changes on readers’ tendency to be more interested in materials from the internet, than the printed media. Taking these developments into account, it is important for web-based instructional designers to choose the appropriate font, especially for long blocks of text, in order to enhance the level of students’ readability. Accordingly, this study aims to evaluate the effects of serif and san serif font in the category of screen fonts and print fonts, in terms of Malay text readability on websites. For this purpose, four fonts were selected, namely Georgia (serif) and Verdana (san serif) for the first respondents and Times New Roman (serif) and Arial (san serif) for the second respondents. Georgia and Verdana were designed for computer screens display. Meanwhile, Times New Roman and Arial were originally designed for print media. Readability test on a computer screen was conducted on 48 undergraduates. Overall, the results showed that there was no significant difference between the redability of serif and san serif font of both screen display category and print display category. Accordingly, the research findings and the literature overview, suggest that Verdana and followed by Georgia as the better choice in displaying long text on websites. Likewise, as anticipated, Times New Roman and Arial fonts provide good readability for print media, which reinfoces their status as the printing font category. However, with the current computer screen capability, it can still be an alternative option for instructional web developers.


Introduction
Text is a multimedia element that plays an important role in disseminating information in instructional software in verbal form.With the rapid development of computer-based instructionals, such as web and courseware, the tendency to acquire information through computers, especially in an online form arises subsequently (Ferrari & Short, 2002).Consequently, the requirement for research related to text, especially in terms of improving students' reading level, is even more necessary now.This is because, the readability of text on computer screens is essential to ensure an effective interaction with the media (Erdogan, 2008;Erdogan & Bayram, 2007;Nielsen, 2000).
In general, text are symbols used to reflect speech (Green & Brown, 2002).Text is also defined as structured letters to form a meaning that can be understood (Jamaluddin & Zaidatun, 2000).This includes all types of symbols, letters, numbers, and various types of writing style that form a primary basis for the dissemination of information-both past and present (Jamaluddin & Zaidatun, 2000).Text is usually compared based on font type and size.Font is a set of characters that are printed or displayed in a specific style and size (Giese & Holmes, 2002;Brady, 1993).For computer-based instructional design, selection of appropriate fonts has an impact on students, especially in terms of recognizing and reading the symbols effectively.When the letters are placed together to form words, the aspect of recognizing these symbols or characters is important for perfect readability (Yoshida, 2000).

General Characteristics of Fonts
Standard fonts can be placed into two categories: Serif and San Serif (Ambrose & Harris, 2006).Serif was the early font, created before the era of metal type printing.Historically, the serif fonts were the most extensive and widely used, such as Humanist (Venetian), Old Style (Old Face, Geralde), Transitional, Modern (Didone), and Egyptian (Rabinowitz, 2006).Serif fonts have small strokes at the end of the letters, whilst san serif fonts do not (Ambrose & Harris, 2005;2006;Amdur, 2007;Azahar, 2006;Bryan, 1996;Conover, 2003;Hughes, 1999;Rabinowitz, 2006).Each font has a different anatomy, such as x-height, set width, and baseline.These features make each font uniquely different from one another with their own identities (Amdur, 2007).In summary, the differences and general anatomy of serif (Georgia) and san serif (Verdana) fonts can be seen in Figure 1 below.Serif fonts are the preferred for long blocks of text because they help readers in term of distinguishing letters individually (Amdur, 2007;Bryan, 1996), which helps in terms of reading fluency (Morrison & Noyes, 2003).Serif also helps the reader to follow lines of text in terms of reading fluency (Ambrose & Harris, 2005;2006;Hughes, 1999).Serif provides unique features to help readers to identify letters of the alphabet easily (Bryan, 1996).It is said that these serif characteristics has an influencing effects in improving readability of a font (Arditi & Cho, 2005;Conover, 2003).However, the question still arises: "Do these features also have the same effect when displaying long blocks of text on a computer screen?"This is especially true, as website displays are the medium of choice nowadays.In contrast, many web designers state that san serif fonts, such as Arial or Verdana, give better computer screen readability, especially when a small font size is chosen (Peck, 2003;Powell, 2002).
San serif fonts or gothic fonts have no small strokes as in serif fonts.San serif was designed and known during the early 20th century (Rabinowitz, 2006).After a period of transition, san serif fonts became categorized into three major families namely Grotesque, Humanist, and Geometric.Moreover, this font looked more contemporary (Ambrose & Harris, 2005;2006).The simple and clear design of the san serif fonts make it also suitable as a "display font" at the beginning years (Bryan, 1996).The term "display font" is used for fonts which were designed to be used in advertising signs and posters, which could be read clearly even at long distances (Ambrose & Harris, 2005;Rabinowitz, 2006).In addition, the san serif font was also widely used in the publishing of books and magazines as headings or titles, because its features made it unsuitable for the continuous reading of long text (Bryan, 1996).Even so, according to Conover (2003), the characteristics of the san serif font makes it easier to read on road signs and small clusters of words.

Font and Readability on Computer Screen
A study by Shaikh and Chaparro (2004), which measured the reading habits of internet users involving five types of documents, namely journal articles, news, periodicals, written text, and product information, found that consumers were more likely to read journals in printed documents and the news, periodicals, written text, and product information in online documents.Therefore, the studies looking on the factors affecting the readability of online text is concluded important (Shaikh, 2005).This consideration is crucial because readability is the most important factor affecting the efficiency and fatigue of one's work (Hyungsuk & Hyunseung, 2007).Furthermore, in the role of writers to design documents with good readability, it is important to ensure that messages can be communicated effectively to the readers (Rabinowitz, 2006;Wright, Bailey, Tuan, & Wacker, 1999).
Generally, readability refers to the speed and comfort of reading and the understanding of its meaning (Woods, Davis & Scharff, 2005;Mills & Weldon, 1987).In particular, the legibility of words, sentences, and paragraphs defines the level of readability (Mills & Weldon, 1987;White, 2005).According to Brinck, Gergle, and Wood (2002), readability refers to how many words and sentences can be detected by the reader and the clarity of vocabulary and grammar in words and verses.In addition, readability is also related to features and layout of a text which influence the understanding of the meaning that the writer intended to convey (Ambrose & Harris, 2006;Barth, 2008;Rabinowitz, 2006).
There are many factors that can affect or improve the readability of text on a computer screen, such as font type, font size, white space, the distance between lines of text (leading), paragraph style, line length and word length (Ambrose & Harris, 2005;Amdur, 2007;Azahar, 2006;Hughes, 1999;Hyungsuk & Hyunseung, 2007;Rabinowitz, 2006;Shaikh, 2005).According to Amdur (2007), selection of clear, simple, sufficient x-height and width dimensions of corresponding letters, help to improve the readability of text.However, the font type-serif or san serif-that has a good readability of text on a computer screen is still questionable.For printed documents, undoubtedly, serif fonts have better readability.Since, small lines in serif fonts assist readers in recognizing the character of each letter for better readability (Amdur, 2007;Bryan, 1996).In addition, the small lines in serif, form line that guide readers' eyes along the length of the text (Ambrose & Harris, 2005;2006;Amdur, 2007;Hughes, 1999).In conclusion, the appearance of small line in serif is said to be an influencing characteristic that affects the readability of a font (Arditi & Cho, 2005;Conover, 2003).However, the impact of this feature on displaying long blocks of text on a computer screen (which is the current medium of choice), has yet to be ascertained.In contrast, many web designers say that san serif fonts, such as Arial or Verdana, have a better screen readability (especially at small sizes) than other serif fonts (Peck, 2003;Powell, 2002;Wilson, 2001).

Background of the Study
Reading text on a website is gradually becoming a daily routine due to the unceasingly increasing amount of online materials on the web, shifting the urgency of reading from printed documents to reading online information using a computer screen.This shift has changed the way we read and understand text, as reading text on a computer screen is different from reading printed documents (Erdogan, 2008;Ferrari & Short, 2002).One of the seldom highlighted issues related to text and font is readability, which refers to the level of easiness in reading, where among the common influencing factors affecting the readability is spaces, font size, and font type (Landa, 2001;Yoshida, 2000).
The selection of the most appropriate font for a website is still debatable amongst web developers and typography researchers (Erdogan, 2008;Ferrari & Short, 2002).Many studies have been conducted to determine the best font-serif or san serif-in terms of readability and reading facilities on websites.It is said that serif fonts are suitable for printed media and san serif fonts are suitable for computer screens because they are much easier and faster to read (Vaughan, 2008;Peck, 2003).Features found in serif fonts make them easier to read, which is why most books, magazines, and newspapers use serif fonts, such as Times New Roman or Bookman (Bernard, Mills, Paterson & Storrer, 2001;Bryan, 1996;Conover, 2003;Wilson, 2001).Nevertheless, most fonts used on computer screens are actually designed for printed media (Boyarski, Neuwirth, Forlizzi & Regli, 1998).This leads to the notion that serif fonts are easier to read in any medium, whether printed or on a computer screen (De Lange, Esterhuizen & Beatty, 1993;Wilson, 2001).However, computer screens are very different to printed documents, as they use a resolution lower than 72 dpi, whereas printed documents use 180 dpi, 300 dpi, or higher (Wilson, 2001).The notion is still questionable, because early computer screens were less able to render serif fonts, but most modern computer screens are now able to display all types of fonts clearly, which are similar to printed media (Bryan, 1996;"Font readability," n.d.;Rabinowitz, 2006).Furthermore, previous studies also found that an increase of screen resolution also increases the readability of text (Gugerty, Tyrrell, Aten & Edmonds, 2004).
Reading text on a computer screen is actually quite tiring, and text that contains long passages should be avoided (Gotz, 1998).According to Erdogan (2008), reading from a computer screen is not the same as printed media.Moreover, reading from computer screen is 30% slower than reading printed materials (Ferrari & Short, 2002).Due to these limitations, several new fonts have been designed specifically to suit reading from computer screens (Rabinowitz, 2006).In this regard, the Verdana and Georgia, which are respectively san serif and serif fonts were designed by Matthew Carter in 1996 (Amdur, 2007).However, some interface designers disagree on the selection of either font as appropriate choices for good readability on computer screens (Erdogan, 2008;Ferrari & Short, 2008;Shaikh & Chaparro, 2004;Tullis, Boynton & Hersch, 1995).This disagreement is reflected by numerous inconsistent findings in the literature.Some studies show no differences between the fonts (Boyarski et al., 1998), while others suggest that san serif fonts are better for computer screens, in terms of readability (Josephson, 2008;Wilson, 2001).A study by Tullis et al., (1995), found no difference in reading speed between serif and san serif fonts, which was in contrast with the finding of a study by Bernard et al., (2001), who found that serif fonts were read faster than san serif fonts.These findings suggest that identifying the most appropriate font for optimum use on a computer screen is necessary (Morrison & Noyes, 2003).Interestingly, some designers suggest that serif fonts and san serif fonts should be combined in the main text and titles of a web interface (Conover, 2003;Yoshida, 2000).
Accordingly, this study aims to evaluate the effects of serif and san serif fonts of screen and print display categories on computer display.Focusing on the readability of text displayed on a Malay language website.Two research questions were formulated in this study in order to address the issues that have been discussed as follows; a) Is there any significant difference on readability on computer screen between serif and san serif fonts in screen display category?b) Is there any significant difference on readability on computer screen between serif and san serif fonts in print display category?

Participants
This study was conducted at the Sultan Idris Education University, Malaysia, involving 48 undergraduates, who major in Information and Communication Technology (ICT).All the participants were chosen from the ICT program because they have extensive experience in reading from the computer screen.The selection involving ICT-major undergraduates is highly recommended as these students are active internet users in searching and reading online information for instructional purposes (Hsin, 2009;Nawal & Abdul Rahman, 2003).They were randomly assigned into two groups: the first group was tested for screen display font category, and the second group was tested for print display font category.Each testing involved a pair of serif and san serif fonts.

Test Instrument
Two reading passages or text blocks, with both containing 140 words at the same level of difficulty, were prepared by the authors (the level of difficulties is high).A Malay language specialist teacher reviewed and validated these two text blocks before the instrument development was carried out.The reading text blocks as shown in Figure 2 and Figure 3 below, used serif and san serif fonts accordingly.Each text block contained the same number of words discussing the similar topic; this was also validated by Malay language specialist teacher.
Experiments were carried out to measure the combination of time taken and accuracy in reading these passages on web interface developed.In finding the appropriate scoring method, the authors referred to the recommendations in the literature that emphasize readability on how many words and sentences can be detected by the reader and the clarity of vocabulary and grammar in words and verses (Brinck, Gergle, & Wood, 2002).Accordingly, two scales were developed to measure the readability based on the rubric scores developed.The two scales were used to determine the score of reading speed and accuracy.The sum of both scores was decided as the readability performance score.Table 1 shows the seven steps used in the development of the rubric based on Mertler (2001) recommendation.Overall, the rubric developed was reviewed and validated by Malay language specialist teacher.Specifically for this study, the steps followed based on Mertler (2001) recommendation to develop the reading performance rubric are as follows: Step 1: Objectives to be achieved were to identify the levels of reading time and accuracy.
Step 2: The specific criteria were time in seconds and commission of errors (or errors in the number of words read).
Step 3: Scores were broken down into nine scales.
Step 4: The time interval was 4 seconds for each scale; and for accuracy, the interval was two errors for each scale.
Step 5: Rubrics were constructed based on these identified intervals.
Step 6: Data collected were analyzed along the appropriate scales of the rubric.
Table 2 below summarizes the scales for the reading performance in terms of speed and accuracy.

Media Design
The evaluation method used in this study was a reading test because this is a commonly used test in measuring readability or easiness of reading (De Lange, Esterhuizen & Beatty, 1993;Huenerfauth, Feng & Elhadad, 2009).The test involved four different web interfaces which displays four different fonts: Georgia and Verdana for the screen display category, and Times New Roman and Arial for the print display category.These fonts were chosen as Georgia (serif) and Verdana (san serif) were developed specifically for the purpose of computer screens, whilst Times New Roman (Serif) and Arial (san serif) were originally developed for printed media (Bernard, Chia & Mills, 2001;Josephson, 2008).Thus, reading performance differences were investigated between Georgia and Verdana for the first group and between Times New Roman and Arial for the second group.
The font size used in the passages was 12pt.(or 3 in the HTML document).This size was deemed suitable based on a survey finding which pointed out, majority of web sites use 12 pt.font size (Bernard, Mills, Peterson, & Storrer, 2001).Moreover, this size can be read faster on a website compared to 10pt.or 11pt.font sizes (Bernard, Lida, Riley, Hackler & Janzen, 2002;Powell, 2002).The font was displayed in black against a white background that provided good contrast to the readers, which could improve reading (Ahmad Zamzuri, 2008;Erdogan, 2008).Likewise, Loosmore (1994) asserts that a dark colour font is more suited for a white background.Additionally, this colour combination is also emphasized in the development of websites (Erdogan, 2008).In this study, the interfaces employ this colour combination without any other distracting elements as shown in Figure 4.

Research Procedures
The test began with the first respondent of the first group reading the first text block (Georgia) and then followed by reading the second text block (Verdana), which are the screen category fonts.30 seconds of resting time was allocated in-between the reading activities.The text was displayed on Internet Explorer web browser on a 21" LCD flat screen monitor, with a resolution of 1280 x 1024 pixels.Each respondent was monitored by two research assistants, who recorded the time taken to read the passages and the number of errors commited throughout the reading activity.All the respondents were required to read the passages as quickly and accurately as possible at a moderate, listenable voice.The same procedures was followed by the next respondent till the last respondent of group one.Likewise, the similar procedures was employed on group two.The difference was, they were required to read the first text block (Times New Roman) and then followed by reading the second text block (Arial), which are the print category fonts.Table 4 summarizes the breakdown of group according font category and type.

Results
Both descriptive and inferential statistics were used to address the research questions of the study.For the latter statistics, an independent sample t-test was used to test whether there were significant differences in the readability on computer screen between serif and san serif fonts both in screen font and print font categories.The level of significance used to test the statistical significance was 0.05.Levene test was first performed to check the assumption of equal variances between the two types of font reading for both group, which showed that this assumption was met.
For the first group that used computer screen to read, the participants attained mean scores of 73.1 (SD = 8.57) and 72.92 (SD = 6.74) in reading the text in Georgia and Verdana fonts, respectively.The difference between the mean scores was also found to be non-significant, t (46) = 0.09, p > 0.05.Thus, the readability of Georgia (serif) and Verdana (san serif) fonts on a computer screen was the same.Table 4 summarizes the mean scores and standard deviations of the text reading performances of the first group.
Table 4. Means and standard deviations of readability of the first group Similar analysis was used for the second group that read the similar passages based on Times New Roman (serif) and Arial (san serif) fonts, which is in print category fonts.The participants attained mean scores of 66.25 (SD = 12.96) and 65.62 (SD = 9.93) in reading the text in Times New Roman and Arial fonts, respectively.The difference between the mean scores was also found to be non-significant, t (46) = 0.19, p > 0.05.Thus, the readability of Times New Roman (serif) and Arial (san serif) fonts on computer screen was the same.Table 5 summarizes the mean scores and standard deviations of the text reading performances of the second group.
Table 5. Means and standard deviations of readability of the second group

Discussion
Findings of text readability between serif and san serif fonts indicate that the difference between these measures is insignificant.Thus, these findings do not provide evidence to support the claim that san serif has better readability than serif on computer screens.In other words, this finding further reinforces the important new role of serif fonts, (i.e.Georgia), in displaying legible text on the computer screen that rivals the established role of san serif fonts (i.e.Verdana) for the same displaying purpose.On previous occasion, the former fonts had been perceived to render poor text readability on the computer screen due to low computer screen resolution (Bryan, 1996;Rabinowitz, 2006).Moreover, the serif fonts have been specifically designed for printed media and not for display on the computer screen (Vaughan, 2008;Peck, 2003).On the contrary, some serif fonts, such as Georgia, have been designed to fit onto the computer screen that do increases text readability on the computer screen.
The specific displaying roles of san serif (for the printed media) and serif (for the computer screen) fonts is now being questioned as this dichotomized roles was conceived at the time when computer screen resolutions were not superior as of today (Bryan, 1996;"Font readability," nd;Rabinowitz, 2006).Previously, computer screens were less capable in rendering serif fonts.However, most today's computer screens have the capability to display all type of fonts clearly on par with the printed media.In addition, this finding also concurs with previous findings that showed no significant differences in terms of readability between Georgia and Verdana fonts on the computer screen (Weisenmiller, 1999;Bernard et al., 2002).Likewise, Boyarski et al., (1998)  observed that in general the participants of the study preferred Verdana font to Georgia font.The same researchers also found that the computer screen serif font Georgia was more readable than the printing serif font Times New Roman, owing to the Georgia's prominent characters being specifically designed for computer screen display.As anticipated, Georgia's special feature with high x-height provides better visual cues to help the reader to read the text easily.Georgia's better readability is best explained by Amdur's (2007) recommendations to use fonts that are clear, simple, have a high x-height, and a width set of the correct dimensions to help improve the readability of text.Another important characteristic that has been demonstrated to be helpful in improving Verdana and Georgia text readability is that its font letters are not in contact with each other, and this unique feature helps improve readability on the computer screen.
As previously discussed, Times New Roman and Arial fonts were originally developed for printed media.Specifically, Times New Roman was designed to preserve the legibility of text, despite the high number of characters contained in a single line of text (Conover, 2003).Thus, this font has continually been used in newsprint to accomodate more dense text in a confined space (Conover, 2003).In this study, the findings show that there are no significant differences in terms of readability of text in Times New Roman (serif font) and Arial (san serif).Thus, again failed to support the claim that san serif have better computer screen readability than serif.This finding also concurs with the research findings of Bernard, Chaparro, Mills and Halcomb (2003), who found that no significant difference was found on the readability of text between Times New Roman and Arial.Previously, Bernard and Mills (2000) had found that Times New Roman enabled faster reading, but Arial was the font of choice by the research participants.With equal text readability, both fonts would dominantly appear in the screen display, but Bernard and Mills (2000) finding suggests Arial would be prominently used as being perceived to be more appealing than Time New Roman.In conclusion, the finding of this study provides further evidence on the same effectiveness of serif and san serif fonts, for screen display purpose.Based on the findings and literature overview, this study suggests Verdana as the best choice for instructional web developer, followed by Georgia.Thus, Arial and Times New Roman should be the alternative option as well.

Conclusion and Recommendations
There was no significant difference in text readability on the computer screen between serif and san serif fonts.Furthermore, the former font (which is meant for the printing) and the latter font (which is meant for the computer screen) provide similar readability on website text.From the practical standpoint, the standard practice of using serif and san serif fonts, namely Verdana and Georgia, for computer screen reading would continue in reading long text on websites.However, Times New Roman and Arial should also be considered as an alternative option for reading text on web pages, even though they are under the print media fonts category.
Interestingly, the findings of this study indicate that the mean scores of Georgia and Verdana (i.e. computer screen display fonts) were slightly higher than Times New Roman and Arial (i.e.print media fonts).However, a definite conclusion is not applicable at this point, since, the study involves two different groups that might influenced by factors that might affected the reading performance throughout the reading test.Therefore, further study on the effects of readability between print category fonts and screen category fonts, involving the same respondent group could find the specific answers.Beside that, other variable that could also be included for future research is the impacts of screen resolution on text readability.This includes in finding the impacts of fonts and readability on various current devices such as laptop, netbook, palmtop, tablet pc, kindle, etc.

Figure 1 .
Figure 1.Differences and general anatomy between serif (on the left) and san serif (on the right) fonts

Figure 4 .
Figure 4. Interface showing text block in Georgia (serif) font

Table 1 .
The seven-step process in developing the performance rubric

Table 2 .
The speed performance and accuracy performance scales

Table 3 .
Breakdown of group according font category and type found no significant difference between Georgia and Verdana font readability on the computer screen.However, they