        
     
     

  

5

{\l

L

EWKILEHIIW

WI

‘
i

535‘ WWWl1}

THS_

6/100:

 

LIBRARY
Michigan State
University

 

 

 

This is to certify that the
thesis entitled

Web Aesthetics and Usability:
An Empirical Evaluation of White Space

presented by

Konstantinos Efstratios Kripintiris

has been accepted towards fulﬁllment
of the requirements for the

MA. degree in Telecommunication,
Information Studies and Media

 

 

Mn 3; §
/ " Wsor’s Signature

8/8/2008

 

 

Date

MSU is an afﬁrmative-action, equal-opportunity employer

.tkn— -.-_.V-.-m.-.--o-u—---.--.-.-u—n-n-u-.-.-

- -v-l-IQJQI--IEI_’-._4n-v-I-c-o-n-c-

 

PLACE IN RETURN BOX to remove this checkout from your record.
TO AVOID FINES return on or before date due.
MAY BE RECALLED with earlier due date if requested.

 

DATE DUE DATE DUE DATE DUE

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

SIOB KIProilAcc8Pres/CIRCIDateDue indd

 

WEB AESTHETICS AND USABILITY:
AN EMPIRICAL EVALUATION OF WHITE SPACE

By

Konstantinos Efstratios Kripintiris

A THESIS

Submitted to
Michigan State University
in partial fulﬁllment of the requirements
for the degree of

MASTER OF ARTS
Telecommunication, Information Studies and Media

2008

ABSTRACT

WEB AESTHETICS AND USABILITY:
AN EMPIRICAL EVALUATION OF WHITE SPACE

By

Konstantinos Efstratios Kripintiris

The Human Computer Interaction (HCI) research community constantly seeks to
improve of the users’ web experience. Usability is arguably the most essential component
of a user’s online experience on the Web. Nevertheless, in recent years, the need to
explore new and non-traditional factors (such as visual aesthetics and perceived
attractiveness) that may impact usability has arisen. This study contributes to the ﬁeld by
exploring the relationships between the classical design element of white space, the
perceived attractiveness of the website, and the latter’s usability. A between-subject
research design involves the manipulation a website’s utilized white space. Three
different versions were constructed, using 25, 50 and 75 percent of the website’s white
space respectively. Findings include a strong relationship between, the perceived
attractiveness and the perceived usability of a website. The study suggests that the
usability of a website is impacted more negatively when the white space increases over
50 percent. When the white space decreases lower than 50% the impact is not significant.
Both practitioners and researchers should consider that in the context of eCommerce Web
design, subtraction of content and shrink of visual elements may negatively impact the

usability of a website.

Copyright by
Konstantinos Efstratios Kripintiris
2008

In memory of my beloved grandfather Konstantinos

iv

ACKNOWLEDGEMENTS

First I want to thank my thesis chair Dr. Constantinos K. Coursaris for his
continuous support during my Master’s program at Michigan State University.
Constantinos was there to advise me and support my ﬁrst steps as a researcher. Also I
would like to thank my committee members Dr. Dean Rehberger and Dan Marsh for their
valuable insights and questions during the proposal and thesis defenses.

Second, I want to thank my supervisors Dr. Janet Swenson and Dr. David
Sheridan for believing in me and offering me the opportunity to serve the Michigan State
University Writing Center as Digital Writing Consultant. Their ethical and ﬁnancial
support was vital for the completion of my degree. Also, a special thanks goes to Nick
Bowman who helped me with the statistical analysis of my data, at a very crucial period
of my studies. His guidance was more than critical for the completion of my degree. I
also want to thank the following people at Michigan State University for their help with
this thesis: Aimee Knight, Joshua Sauvie, Noah Ullmann, and Emilia Kanazireva

Last but not least, I want to thank my parents, Eleni and Stratos Kripintiris for
their unconditional support to the pursuit of my academic goals regardless of cost,
distance, and geography. I owe them everything that I have accomplished and have

become.

TABLE OF CONTENTS

LIST OF TABLES ............................................................................................ VII
LIST OF FIGURES .......................................................................................... IX
INTRODUCTION ............................................................................................. 1
CHAPTER 1
LITERATURE REVIEW ................................................................................... 6
Aesthetics and their relationship with HCI ............................................ 6
Design principles, elements and visual communication ......................... 11
Alignment and Symmetry ....................................................... 13
Contrast ................................................................................... 15
Similarity & Proximity ............................................................ 16
Golden Ratio and Fibonacci numbers ..................................... 16
White space ............................................................................. 18
Aesthetics, perceived attractiveness, emotions, and HCI ...................... 20
Usability ................................................................................................. 27
CHAPTER 2
THEORETICAL FOUNDATIONS & RESEARCH FRAMEWORK ............ 29
CHAPTER 3
RESEARCH METHODOLOGY ...................................................................... 33
Experiment design and procedures ........................................................ 33
Subjects .................................................................................................. 36
Instruments and validity ......................................................................... 37
CHAPTER 4
RESULTS AND DISCUSION ......................................................................... 41
Results .................................................................................................... 41
Discussion .............................................................................................. 47
CHAPTER 5
CONTRIBUTIONS, LIMITATIONS AND FUTURE RESEARCH ............... 50
Contributions .......................................................................................... 50
Limitations .............................................................................................. 52
APPENDICES ................................................................................................... 54
BIBLIOGRAPHY ............................................................................................. 59

vi

LIST OF TABLES

Table l. Perceived attractiveness construct items and their total correlations. . .......38

Table 2. Perceived attractiveness Cronbach’s alpha, construct items and their
item-total correlations ........................................................................ 39

Table 3. Usability constructs’ Cronbach’s alpha, construct items and their

item-total correlations ........................................................................ 39
Table 4. Construct statistics .................................................................. 40
Table 5. Items and Construct statistics ..................................................... 40
Table 6. Perceived attractiveness rankings between groups ............................ 41

Table 7. ANOVA for relationships between white space groups and
perceived attractiveness ...................................................................... 42

8. Tukey test for relationships between white space groups and
perceived attractiveness ....................................................................... 42

Table 9. Perceived efﬁciency rankings between groups ................................. 42

Table 10. ANOVA for relationships between white space groups and
perceived efﬁciency ............................................................................ 43

Table 11. Tukey test for relationships between white space groups and
perceived efﬁciency ........................................................................... 43

Table 12. Perceived effectiveness rankings between groups ............................ 43

vii

 

Table 13. ANOVA for relationships between White space groups and
perceived effectiveness ....................................................................... 43

Table 14. Tukey test for relationships between white space groups and
perceived effectiveness ....................................................................... 44

15. Perceived satisfaction rankings between groups ..................................... 44

Table 16. ANOVA for relationships between White space groups and
perceived satisfaction ......................................................................... 44

Table 17. Tukey test for relationships between white space groups and
perceived satisfaction ......................................................................... 45

Table 18. Pearson’s correlations between perceived attractiveness and
perceived usability ............................................................................ 45

Table 19. ANOVA for the signiﬁcance of the regression model ....................... 46

Table 20. Regression analysis model between perceived attractiveness
and usability ................................................................................... 46

Table 21. Regression analysis model between perceived efﬁciency,
effectiveness and satisfaction ................................................................ 46

viii

LIST OF FIGURES

Figure 1. Research framework .................................................................. 28
Figure 2. Potential relationship between classical aesthetics and usability ................ 29
Figure 3. Proposed Research Model ............................................................. 31
Figure 4. 75% White space56
Figure 5.50% White space57

Figure 6. 25% White space58

ix

Introduction

The expansion of the Internet has seen tremendous acceleration during the past
two decades. According to the Internet World Statistics (2008), 1.3 billion people
worldwide use the Internet, as of December 2007. The Web has been one of the primary
reasons for the Intemet’s expansion. Currently, it is the protagonist in terms of providing
any kind of information (Schmidt et al. 2003). While the Web used to be a
complementary asset for companies, institutions, organizations, and other parties, it has
been transformed to being their vital component.

In the late 19908, the massive usage of the Web had made the design of websites a
complicated process. Due to the need for effective ﬂow of information, website design
started requiring the collaborative work of scientists, designers, and artists across
disciplines. More effort had been put into Web design, since it was no longer sufﬁcient to
have a website unless it was usable to its audience (Tarasewich et a1. 2001).

Currently, human-centered research is required in several points of the design
process for effective Web products. The Human-Computer Interaction (HCI) community
studies the Web from an anthropocentric point of view. Different approaches have been
developed to analyze and explore the foundations of the users’ experience (Norman
1998). Schenkman and Jonsson (2000) state that the use of Web consists of three
different factors: the provided information (content), the given impression to the user
(aesthetics), and the usability of the website. The latter factor has been the least
researched and many of its potentials are yet to be explored (Lavie and Tractinsky 2004).

Traditionally, usefulness, utility, and usability have been the fundamental

qualities of the Web experience (Hartmann 2006). Their impact has been tremendous,

and the HCI community has been signiﬁcantly focused on them for more than a decade.
Nevertheless, the complexity of user experience has generated a continuous growth of the
HCI literature towards the investigation of new, non-traditional, factors. There seems to
be a growing tendency of exploring visual aesthetics and perceived attractiveness over
the last few years (Hartmann 2006). A few earlier studies from different domains had
shown an impact of aesthetics in the daily interaction of humans with artifacts (Norman
1998, Jordan 1998, Tractinsky 1997, Lavie and Tractinksy 2004). In addition, claims for
a potential correlation between feelings and usability had been apparent (Schenkman and
Jonsson 2000, Norman 1998). The recent trend of exploring aesthetics has led researchers
to keep a balance between traditional HCI concerns and aesthetics. There is limited
research on whether or not the perceived attractiveness of an information system, caused
by aesthetic considerations, impacts its usability (Lavie and Tractinsky 2004). But, there
is enough evidence, both from the currently limited studies in the HCI ﬁeld and from
studies conducted in different domains that a potential relationship between aesthetics
and usability exists.
Research Objectives

This study explores how aesthetics impact a website’s perceived attractiveness
and usability by expanding the ﬁndings of Lavie and Tractinksy (2004). Lavie and
Tractinsky (2004) separate aesthetics into two subcategories: classical and expressive.
Their study showed a signiﬁcant association between both classical and expressive
aesthetics with usability. They consequently developed a measurement instrument
consisting of ﬁve-item scale for each of the aesthetics subcategories. They claim that the

reliabilities, factor structure, and validity of those items reﬂect the aesthetics scales

adequately. Lavie and Tractinksy (2004) developed a formula of measuring the aesthetic
quality of interactive artifacts. Although their ﬁndings are limited only in the area of user
perception (Lim et al. 2007), their work has been fundamental and used heavily in the
existing HCI and aesthetics literature, including this study. This empirical evaluation
explores more in depth those ﬁndings by focusing only on the sub-category of classical
aesthetics, which consist of sets of design principles and elements. Although many of
those principles and elements are coming from various different domains such as
architecture, graphic design, desktop publishing, studio art, etc., they construct a solid
theoretical foundation, which has been utilized and followed by professionals and
theoreticians across the disciplines. Current literature discusses several approaches of the
role of aesthetics in HCI. Some studies consider aesthetics not just part of the visual
appeal of interactive artifacts, but an integral component of the holistic user experience.
Other studies are discussing the relationships between the perceptions of aesthetics and
usability. This current study places itself closer to the latter category of literature; the
goal is to identify patterns of the aesthetics’ role in the perceptions of attractiveness and
usability. In terms of usability, this empirical study uses the deﬁnition of the International
Organization for Standardization (ISO 9241-11), which deﬁnes usability as “the extent to
which a product can be used by speciﬁed users to achieve speciﬁed goals with
effectiveness, efﬁciency and satisfaction in a speciﬁed context of use.” Additional
information about usability will be presented in chapter two.

Therefore, the broader research question of this study is: How do classical

aesthetics impact the perceived attractiveness and usability of a website?

Since, classical aesthetics cannot be treated as an individual research construct
because they consist of numerous different dimensions and sets of principles, breaking
down classical aesthetics seems mandatory and, thus, is examined in chapter two.

Considering the various principles and elements behind the classical aesthetics,
several research questions may emerge after incorporating principles and elements such
as contrast, unity, white space, proximity, alignment and others. Also, the potential
combinations of two or more classical aesthetic dimensions generate more research
questions (e. g. What, if any, are the interaction effects between the website’s symmetry
and use of white space on a website’s perceive attractiveness and usability?)

All the potential research questions are worth investigating. However, due to the
lack of literature, a solid theoretical foundation is not provided. The purpose of this study
is to provide empirical evidence and subsequently contribute to the development of a
strong theoretical and practical basis. Thus, the focus is only on one dimension of
classical aesthetics, on the principle of white space. The three main research questions

coming forward are:

Q1: How does white space impact a website ’5 perceived attractiveness?
Q2: How does white space impact a website ’s perceived usability?

Q3 .° How does perceived attractiveness impact a website ’5 perceived usability?

In the next section, the study goes through a literature review in order to explore
several relevant publications, which enlighten the path of how aesthetics may impact

websites’ perceived attractiveness and usability. It starts with an introduction to

aesthetics, and information regarding their potential relationship with perceived
attractiveness and usability. The subsequent chapters present the research framework, the
proposed research model, and the methods followed in the experimental evaluation.
Lastly, the results are reported and the study concludes with a discussion of the

implications and the limitations of this empirical evaluation.

 

Chapter 1 - Literature Review
Aesthetics and their relationship with Human-Computer Interaction

Aesthetics originate from the Greek adjective aesthetikos, which derives from the
verb aesthesthai that means, “perceive” (Oxford American Dictionary 2008). Aesthetics
are a set of principles concerned with the nature and appreciation of beauty. They are
interlinked with the philosophy of art and are considered to be a particular theory of the
conception of beauty; a particular approach to what is pleasing to the senses (Hoffman
and Krauss 2004). That sense, the appreciation of beauty, was coined in Germany in the
18th century with the series of articles on “The pleasures of the imagination” written by
the journalist Joseph Addison in the magazine The Spectator in 1712. Before that, some
signiﬁcant thinkers of that era had generated some thoughts, which had made a few
appearances into this ground. An example is the formulation of general theories of
proportion and harmony, detailed most speciﬁcally in architecture and music. However,
philosophical reﬂection on Aesthetics did not begin to grow until the widening of leisure
activities in the eighteenth century (Slater 2006). After the interest in beauty broadened,
aesthetics started to encompass the art-world, and since late ‘503 the number of pure
aesthetic ideas discussed in the literature has expanded even more. Building upon
traditional philosophies of art, current trends carefully examine the aesthetical aspects of
art (Slater 2006).

People throughout the centuries have been highly interested in aesthetics. The
appreciation of beauty is a classical quality and applied to many aspects of life, such as

senses, imagination, and understanding (Lavie and Tractinsky 2004). Aesthetics have

been a topic of study and research over the ages by many schools of thought, and
consequently have been approached from many different angles and points of view.

Through their discussion, Lavie and Tractinsky (2004) present aesthetics
possessing multiple meanings. However, they discuss the existence of two major
approaches of aesthetics, the philosophical approach and the empirical one. Both are
based on studies of works of art. A commonality among aesthetics across the centuries is
its dynamic nature. Beauty has been being reformulated to address and reﬂect the
propensities and tendencies of the era to which it belongs. It is observed and studied that
aesthetical preferences of the present come to replace those of the past and so forth
(Lavie and Tractinsky 2004).

Tarasewich et al. (2001), cite Eysenck (1983) addressing two conﬂicting points
on aesthetics. The ﬁrst considers aesthetics as something completely subjective and that
beauty is a quality not able to be shown. The second point of view sees aesthetics as an
objective quality, which can be understood and shown to people. Eysenck (1983) ends up
believing that there is some sort of objectivity in aesthetic judgments.

Since aesthetics are a greatly broad and ambiguous area of study, putting them
into context is essential and required for any type of scientiﬁc research (Lavie and
Tractinsky 2004). This current study focuses on electronic design and communication via
Web related technologies. Technology, communication, and design have been evolving
synchronously in each period of our history. Muriel Cooper (1989) talks about the
analogous evolution of communication design and technology. Each and every
technological advance pushes the limits of communication and design and sets new

standards. Classical design qualities are being inherited while new practices are being

invented and applied. The passage, from print design and visual communication to
electronic media, followed a similar pattern. Traditional design techniques and principles
were carried over, usually in the form of metaphors (e. g. brushes, color palettes, etc.).
New techniques were quickly discovered and exploited, giving us a predictable and
traditional transition from an older medium to a newer one (Cooper 1989). Aesthetics in
visual communication were transitioned along the way. According to Tractinsky et a1.
(1997) the importance of application of visual aesthetics on computer graphic
environments and information systems is signiﬁcant in terms of system usability.

The function of visual aesthetics in computing environments is mostly based on
the Greek origin of perception, which is conventionally concerned with the beauty and
potentially with the judgment of it (Zettl 1999). However, a different approach by Lavie
and Tractinsky (2004) suggests that visual aesthetics is not only concerned with beauty,
but also with the appreciation of beauty. This statement supports Zettl’s (1999) earlier
claim about visual aesthetics not being just an abstract concept but a speciﬁc procedure,
through which, people are able to examine and evaluate displayed visual elements.

In this context of computer communication, the application of visual aesthetics is
the juxtaposition of appropriate visual stimuli, which can support and enhance visual
communication (Hofﬁnan and Krauss 2004). Klett (2002) found that speciﬁc
visualizations tend to attract attention and cause users’ curiosity due to the presentation of
facts through affective stimuli, and therefore lead to an augmented understanding of the
transmitted message. Klett (2002) also claims that visual organization is the most

important aid in representing information. Zettl (1999) states that various categories of

applied visual aesthetics such as the effect of light, space, time, and motion interact to
produce the ﬁnal message.

Since visual communication and organization are integral parts of Web design,
visual aesthetics can play a critical role in the Web design process. Selecting and
incorporating visual elements and techniques within a Website can affect the provided
message, content, and information (Hoffmann and Krauss 2004). Current literature does
not provide us with a standard deﬁnition or operationalization of visual aesthetics or
attractiveness. However, the ﬁrst endeavors towards a deeper understanding of visual
aesthetics in the context of HCI, clearly belong to Noam Tractinksy. His contributions to
the ﬁeld have been signiﬁcant (Tractinksy 1997, 2000, 2005, Lavie and Tractinksy 2004).
and used by anyone who attempts to explore the relationship between aesthetics and
usability.

Lavie and Tractinsky (2004) separate visual aesthetics into two subsets: classical
aesthetics and expressive aesthetics. Consequently, they connect those deﬁnitions with
Nasar’s (1999) concept of visual richness and visual clarity. Visual richness addresses the
originality, sophistication, and creativity in terms of graphics, layout, and typography. On
the other hand, visual clarity consists of attributes such as clarity, cleanliness, symmetry,
contrast, and others. Tarasewich (2004), attempting a step further, associates visual
aesthetics with web design elements such as: animation, graphics, uniformity, colors,
fonts, background, hyperlinks, appearance and content information. His work, along with
other scholars in the ﬁeld of HCI is explored further in later chapters.

This study provides insight towards the disambiguation of aesthetics in HCI and

speciﬁcally in Web design. It is based on Lavie and Tractinsky’s separation of aesthetics

into expressive and classical. Despite the initial evidence that some connection between
classical and expressive aesthetics exists (Coursaris et a1. 2008), the focus of this study
will not be on expressive aesthetics due to their highly subjective nature and the difficulty
of measuring them. After the establishment of a clear understanding of classical
aesthetics, future research will be able to step more steadily towards a further exploration
of expressive aesthetics.

Although such an assumption may be considered precarious, this study assumes
that the “expressive” aesthetic level of the design that will be tested and studied is of a
high and stable level. Thus, the study concentrates only on classical principles and
elements, which have been utilized in any discipline from ancient and traditional to
contemporary designs. Those principles are under the umbrella of classical visual
aesthetics or visual clarity according to Nasar (1999). Tractinksy (2004) points out Nasar
(1999) as the ﬁrst scholar to make use of the term “visual clarity.” Visual clarity reﬂects
qualities held by classical notions of what comprises aesthetic visual design. Even though
aesthetics has been typically considered as something subjective, Ngo et al. (2000)
developed several computational algorithms, which could measure aesthetics objectively
in the context of interactive interface design.

Next, this study explores brieﬂy fundamental principles and elements of design
(including some Gestalt laws), as a relationship to visual communication and usability
has already been apparent. Gestalt psychology has promoted the principles of visual
organization since the early twentieth century. For the operationalization of the design
being studied, researchers often turn to Gestalt laws and principles, which may in turn be

used as design guidelines. The importance of those laws, along with other principles and

10

elements has been emphasized and distribute across the design disciplines (N go 2001).
These principles offer insight on how visual connections are shaped among different
elements and principles and how individuals perceive visual stimuli such as images,

colors, separation ﬁgure from ground, etc. (Smith 2005).

Design principles, elements, and visual communication

“Designers can create normalcy out of chaos; they can clearly communicate ideas
through the organizing and manipulating of words and pictures” (Veen 2000). That is an
indisputable quality of designers across the disciplines. However, within the context of
this study it is critically important to pay attention to the disambiguation of web design.
Web design follows inherited principles and elements from other types of design, but also
has its own unique characteristics. It is a mixture of graphic arts, technology and
psychology (Wroblewski 2003). That mixture makes Web design a complicated process,
which requires the expertise of several different professionals including information
technologists, programmers, user experience architects, web designers, etc. Their
expertise is usually a combination of academic training along with hands-on experience
acquired by long-term exposure to the web developments practices. Wroblewski (2003)
discusses the current qualiﬁcations of web related professionals. He claims that although
they have the tools to produce effective information design, there seems to be a need for a
further immersion into Gestalt and design literature. Wroblewski (2003) states that web
design requires extensive knowledge of visual communication. He deﬁnes visual
communication as the combination of visual personality (expressive aesthetics) and
visual organization (classical aesthetics). He refers to visual organization as the ability of

humans to make sense out of the relationships and the differences among elements and

11

consequently put together entire stories of understanding of what is seen. Design
principles and design elements offer valuable insight regarding how humans visually
group information. They are not deﬁnite due to the complexity of Web design and
occasionally it may even seem imperative to deviate from these principles. Nevertheless,
a deeper understanding of visual organization and hierarchy may enhance the ability of
Web design professionals, to produce more effective, efﬁcient and satisfactory solutions
(Wroblewski 2003).

Design principles and elements are not stand-alone guidelines. They are
fundamental tools, attributes and values of visual perception that always function and
apply in relation to their surroundings (White 2002). The human mind constantly
searches for meaning. When modern individuals look at a printed document, a painting or
a computer screen, their eyes and minds are trying to instinctively and subconsciously
create meaning (White 2002). That meaning is being shaped from looking into
similarities and differences among visual elements, which function according to the
design principles. Therefore, designing is a process of bringing out that meaning that lies
among differences and similarities. Successful designs are able to show off that inherent
meaning ﬁilly and simply (White 2002). Various design principles have been used across
the centuries in countless styles and schools of design. Certainly the value of those
principles is diachronic and unimpaired. Within this study, design principles are
discussed in the context of website design. Although slightly different from print, website

design also shares these principles.

12

Alignment - Symmetry

Intuitively, designers do not place visual elements in space arbitrarily. Every item
on a Web page logically connects with other surrounding elements. Many of those visual
connections are a result of the alignment principle (Williams 2004). Saw (2001)
separates alignment into two subsets: the edge alignment and the center alignment. Visual
items that have ﬂat edges form patterns of edge alignment while center alignment may be
formed with any visual objects or shapes.

Alignment makes the user conscious of the website’s logical order. When visual
elements are aligned on a Web page they create a stronger cohesive unit. The human eye
and mind tend to create invisible lines, which connect similar elements on the Web page
(Williams 2004). When those elements follow the rules of alignment, the human eye
scans the page with greater ease and it creates those invisible lines instantly.

Therefore, lack of alignment may be a signiﬁcant detriment to a website’s usability.
Human eyes prefer to see order, which creates a calm and secure feeling.

Similarly, the principle of continuity enhances the predictability of a design by
juxtaposing continuous and coherent stimuli. Having a design follow the principle of
continuity, it results in evoking the human eye to move through one object and continue
to another within a particular composition (Skaalid 1999). Since the user’s eyes scan a
Web page instead of reading it, it is imperative that a page follows the principle of
continuity, which makes it more intuitive (Krug 2000). That repetition of similar visual
stimuli enhances a design and creates a visual rhythm. Consequently, the visual rhythm
brings the repeated visual elements of space into motion, and therefore creates an

effective ﬂow within the design. The human eye tends to follow that ﬂow and the whole

13

process of going through a design becomes more spontaneous for the user. During this
process a user may complete the visual organization in a predictable way. For example,
the user may ﬁll in details that were purposely omitted from the design to achieve other
beneﬁts including a sense of cleanliness (Krug 2000, Williams 2004).

Aligning visual stimuli many times lead to the essential design principle of
symmetry, a fundamental dimension of visual aesthetics in any context of use and any
discipline. It implies that the position and size of objects at one side of an axis are
identical on the other side. A half object seems to be a reﬂection of its other half
(Balinsky 2006). Designs that follow the principle of symmetry and asymmetry may be
affected in terms of feeling. Symmetry gives a feeling of permanence and stability, while
asymmetry creates feelings of interest and curiosity (Balinsky 2006). Designers apply
symmetry into designs in order to communicate principles such as quality, stability and
trust (Balinsky 2006).

Symmetrical elements on a design do not need to have the same content. Exact
duplication across the axis is not required due to the limited resolution of the human eye
(Balinsky 2006). Application of symmen'y that does not obey mathematical laws, and it is
different from classical symmetry, it is called visual symmetry (Balinsky 2006).
Therefore, visual symmetry becomes more important in print or website design than
classical symmetry, which obeys strictly to mathematical laws.

McClurg (2005) associates symmetry and asymmetry with visual balance. Visual
balance is “the arrangement of the objects in a given design as it relates to their visual
weight within a composition.” McClurg also refers to the approximate symmetry, which

occurs with similar but not identical visual objects. Lastly, Krug (2000) addresses the

14

need for strict structures on the Web, which enhance a Website’s readability. According
to Krug (2000), when users visit a Web page they do not read its text or look carefully at
its visual elements. Users usually scan a page and focus on something that catches their
attention. By utilizing symmetry, a redundancy and predictability of visual information is
achieved, which increases simplicity, clarity, and in turn, usability (Krug 2000).
Contrast

Distinguishing the visual and logical roles of visual items is fundamental in
design. The designers, usually intuitively, turn to contrast for that purpose. The term
contrast is a little ambiguous since it applies to a few different concepts (vision contrast,
formula contrast, contrast in statistics, color contrast, etc.). Within this study any
reference to the term contrast indicates the concept of dissimilarities among visual stimuli
(Williams 2004). Contrast is immensely powerful, perhaps the most powerful among the
design principles. Initially, applying contrast in any type of design might be considered a
simple, intuitive and even primitive concept. However, the level of contrast in any design
plays a signiﬁcant role in the overall visual composition (Kirsanov 2007). According to
Williams (2004), applying contrast is most important to visual attraction and one of the
best ways to effectively add visual interest to any design. Successful application of
contrast addresses the concept of dynamic tension and the degree of the existing conﬂict
between the visual elements in any design (McClurg 2005). Contrast can be created when
two or more visual elements are characteristically different; otherwise (if the elements are
slightly different) there is visual conﬂict between them. According to Williams (2004),
contrast can be applied in many ways such as: “large type with small type; a graceful old

style font with a bold sans serif font; a thin line with a thick line; a cool color with a

15

warm color; a smooth texture with a rough texture; a horizontal element (such as a long
line of text) with a vertical element (such as a tall, narrow column of text); widely spaced
lines with closely packed lines; a small graphic with a large graphic.” Applying contrast
can add a signiﬁcant visual appeal to the overall design and catch the attention of the
user.
Similarity

Absence of contrasting visual elements may sound catastrophic but if it is used
effectively it leads to another essential design principle - similarity. Skaalid (1999) states
that visual elements that share similar characteristics such as shape, size, color, texture, or
value, will be seen as belonging together. The human brain tends to create groups of
similar objects and therefore a semantic relationship between the visual objects is formed
(McClurg 2005). A sense of belongingness is also achieved by placing design elements
closer together (Gestalt principle of proximity). Users are able to recognize the logical
differences between visually similar objects, however that cognitive process becomes
more intuitive when there is a correlation between visual similarity and logical similarity
(Krug 2000). Williams (2004) also described the underlined concept of similarity,
although she labeled it proximity.
Golden ratio and Fibonacci numbers

Designers have frequently utilized the golden ratio and Fibonacci numbers across
the centuries. However, the golden ratio and the Fibonnacci numbers themselves are not
design principles (Kymin 2008). The golden ratio is a visual representation of the number
(p (1.618033988749895). It is an irrational number similar to the 1:, that is deﬁned to be

( l+1/5)/2. The Fibonacci numbers are a sequence of numbers named after Leonardo of

16

Pisa or Fibonacci. The ratios of successive Fibonacci numbers approach a value of
1.61803. . .. n. The limit of this equation as n approaches inﬁnity, is the irrational number
(p (Dunlap 1997).

The ﬁrst use of the golden ratio as a design guideline was found to be in ancient
Egyptian and Greek architecture, where the golden ratio was used for the development of
the golden rectangle (Dunlap 1997). The golden rectangle’s width ratio is the number Q).
It has been documented that this certain rectangle is considered more aesthetically
pleasing (Dunlap 1997).

The concept of the golden rectangle and generally the golden ratio and the
Fibonacci numbers have been used extensively across multiple disciplines including
mathematics, philosophy, physics, architecture, music, and of course, design (Dunlap
1997). The golden ratio has been used since the antiquity to create a design that is
aesthetic and pleasing to most people (Kyrin 2008). Its aesthetic appeal has been heavily
applied to forms of art, although often in a more subconscious level. Nevertheless, many
modern artifacts consist of deliberately used golden rectangles (Dunlap 1997). When the
golden ratio and the Fibonacci numbers are used in design, they construct a natural
language that humans tend to understand and appreciate. That is because (p can be found
freely in nature (Kyrin 2008, Dunlap 1997). The implications of the golden ratio in Web
design may be found in the overall layout of a website or even in the design of individual

visual components such as navigation columns and content blocks (Kyrin 2008).

17

White space

As mentioned earlier, this study focuses on white space (or negative space) and its
relationship to websites usability. Throughout this study the terms white space and
negative space imply the exact same design elements and they are used interchangeably.
Space as it applies to design is difﬁcult to be deﬁned, because it encompasses several
visual elements. Bennett (2005) states that visual space consists of three distinct
concepts: the format that is associated with the actual size of visual elements, the
negative and the positive space (where the smaller of two overlapping visual objects is
identiﬁed as ﬁgure while the larger is regarded as ground) and the illusionary space
(which is the pseudo three-dimensional space created by using two-dimensional visual
elements). In addition, White (2002) claims that white space is the result of ﬁgure-ground
relationships. Such relationships are juxtapositions of ﬁgure and ground in design
compositions. The visual elements in a given environment correspond to the positive
space, and the environment itself is the negative space (McClurg 2005, Tittel et a1. 1997).
According to Palmer (1999), a ﬁgure-ground relationship is a type of “perceptual
organization” in human vision. Designers use ﬁgure-ground relationships in two-
dimensional compositions by manipulating the emptiness within speciﬁc designs (White
2002). Emptiness in design is as important as fullness, activity, and content. Manipulation
of emptiness may lead to the achievement of contrast and visual rest (White 2002). There
are three types of ﬁgure-ground relationships: the stable one, where elements shape
unchangeable bonds; the reversible one, where visual elements may take reversible roles;

and the ambiguous one, where the roles are not identiﬁable (White 2002).

18

In the context of website design, white space seems to be interconnected with
readability (White 2002). The term readability refers to the adequacy of a visual element
to attract readers. Within Web pages, areas of white space are used in order to frame
important “ﬁgure” visual items containing valuable content (Loewen 2006). Effective use
of negative space may convey large portion of cleanliness. White (2002) connects that
cleanliness to quality. Ken Hiebert, a design professor at Carnegie Mellon University in
the 608, states: “It is common to use space as a kind of luxury, projecting generosity or
classic simplicity — a formula for ‘class.’ But if space is used only as a formula or device,
it is also readily suspect as being wasteful, arrogant, or elitist. Yet space is a human need,
and the experience of space is typically an exhilarating one” (White 2002).

From all the above, the importance of white space as a critical design element
becomes apparent. White space shapes the context where the visual connections among
visual stimuli occur (V ega-Riveros and Villalobos, 2006 and White 2002). Without
sufﬁcient negative space surrounding individual visual elements, the information’s visual
density increases and inhibits a user’s ability to focus on separate items at separate times.
This leads the focus of the user out of the informational context. A website cluttered with
large items results in tawdriness and it makes the communication of individual items
difﬁcult (Loewen 2006). Furthermore, in a cluttered design ﬁgures do not communicate a
strong individual message because they operate more as a group (Loewen 2006). Lastly,
in an attempt to operationalize white space, Harrington et a1. (2004) state that in the
context of print design “white space should total about half of the total page area. The

non white-space area can be estimated by totaling the areas of the content objects."

19

This overview of the design principles is certainly not exhaustive. A signiﬁcant
volume of literature is dedicated to these principles since they have been utilized across
multiple disciplines. Although many of these principles are coming from various different
domains such as architecture, graphic design, desktop publishing, studio art, etc., they
construct a solid theoretical foundation, which have been utilized and followed by
professionals and theoreticians across the disciplines. The scope of this study is not an
in-depth exploration of those principles, but their connection with HCI and speciﬁcally
Web design. Next, this study goes through the existing literature of aesthetics in the
context of HCI. Although signiﬁcantly limited, the current ﬁndings lay a fruitful path to a

more extensive examination.

Aesthetics, perceived attractiveness, emotions, and HCI

While the role of aesthetics in human affairs has been well documented across
many disciplines, there is a signiﬁcantly limited literature regarding that role in HCI
(Tractinsky 2004). A signiﬁcant volume of HCI research has focused on usability. The
important factor of aesthetics and its potential impact on usability have not been
investigated sufﬁciently. Huh et. al (2007) highlight the growing need of moving beyond
usability and integrate aesthetics into the HCI research agenda. Recent HCI research calls
for a balance between usability and aesthetic considerations (Lavie and Tractinsky 2004,
Nakarada and Lobb 2005, Hub et al. 2007, Coursaris et a1. 2008). Thus far, a limited set
of ﬁndings clearly indicates the existence of a relationship between aesthetics and
usability (Tractinsky 1997, Lavie and Tractinsky 2004, Huh et a1. 2007). Tractinsky
(2004) refers to Vitruvius, the ﬁrst know theoretician of the design discipline, active in

the 1“ Century B.C. According to Vitruvius, an effective architectural structure consists

20

of three fundamentals factors: the strength and the durability (F irrnitas), the suitability
and the convenience (Utilitas), and lastly the beauty (Venustas). It is not complicated to
see parallels between Vitruvius’ principles and principles of Information Systems (IS).
Traditionally, professionals in the 18 ﬁeld and speciﬁcally in Website design expended
signiﬁcant effort in order to build robust information systems, which follow some basic
principles of stability correctness. Also, in Management Information Systems (M18) and
HCI, usability (approximates utilitas) is one of the ﬁve main research areas (Banker &
Kauffman 2004). Professionals try to create functional systems that are easy to use. The
latter principle (Venustas), which has to do with the beauty and the attractiveness, has
received minimal attention in M18 and HCI research.

The ﬁrst empirical results in this ﬁeld came from Kurosu and Kashimura (1995),
who were the ﬁrst to study the relationship between interface aesthetics and usability
(Tractinksy 1997). They found an unexpectedly robust relationship between Automatic
Teller Machine (ATM) user interface aesthetics and perceived usability. Tractinsky et a1.
(1997) expanded on Kurosu and Kashimura’s ﬁndings by proving empirically that the
relationship between aesthetics and perceived usability was still present beyond initial
impressions even in a different cultural context. They showed a high correlation between
visual aesthetics and the system’s perceived usability before, during, and after the
interaction. Although these two studies were not measuring an aesthetic consideration
within website environments, they are considered to be the initial efforts towards a deeper
understanding of aesthetics and usability.

Lavie and Tractinsky (2004) found a high correlation between perceived

attractiveness and usability in the context of website design, which supported

21

Tractinsky’s (1997) and Kurosu’s and Kashimura’s (1995) earlier ﬁndings that were
coming from a different context (ATM user interface). In particular, their study showed a
signiﬁcant association between both classical and expressive aesthetics with usability.
They consequently built a measurement instrument consisting of ﬁve-item scale for each
of the aesthetics subcategories. They claim that the reliabilities, factor structure and
validity of those items reﬂect the aesthetics scales adequately. Their study has been
fundamental and used heavily in the existing HCI and aesthetics literature. Nevertheless,
their ﬁndings are limited in the area of user perception (Lim et a1. 2007). Recently the
literature tends to lean toward the direction of how such approaches to aesthetics can be
used and utilized by both practitioners and theoreticians in order to lay the foundation of
web aesthetics (Lim et. a12007).

Nakarada and Lobb (2005) found through an empirical study that perceived
attractiveness impacts search perseverance. Consequently, they suggested that a user is
mostly likely to keep searching when the environment, where the search occurs, has a
higher aesthetic level. Mahlke (2002) presented a different approach to explaining users’
online behavior and suggested that the starting points of the users’ experience are the
qualities of the system by four captured dimensions: perceived usefulness, perceived ease
of use, perceived hedonic quality and perceived attractiveness. An empirical study that
followed the conceptual theory showed that users could perceive those qualities
consistently and independently. Although perceived usefulness was the prevalent
predictor of intention of use and subsequent actual usage behavior, perceived
attractiveness was also shown to be signiﬁcant (Mahlke 2002). Furthermore, Karvonen

(2000) suggested that simplicity, which is a key component of usability, could be the

22

connection between aesthetics and usability, because simplicity is also considered an
aesthetic notion.

Sutcliffe’s (2002) heuristics suggest that a highly structured layout along with
information accessibility impact the system’s usability. Schenkman and Jonsson (2000)
separate Web users into two distinct categories: users who look up a speciﬁc web page
because they need a particular piece of information and users who “surf” around the
Internet without a predeﬁned purpose. The latter set of users is more difﬁcult to satisfy
with a Web page because they can easily move to a different one. According to
Schenkman and Jonsson (2000), the initial impression (perceived attractiveness) of a
Web page is very important. A website needs to be appealing to its users, especially to
the random ones, who are not looking for something speciﬁc. In addition, the ﬁrst
impression may inﬂuence later perceptions of usability and satisfaction, gaining in that
manner the interest of a “difﬁcult” user (Lindgaard, 2007).

Petersen et al. (2004) address the ambiguity of the use of aesthetics in interactive
environments by turning to the theory of pragmatic aesthetics. They discuss Shusterman’s
(1998) propagation of pragmatic and analytical aesthetics. Pragmatic aesthetics may be
seen as integral parts of interactive systems and highly connected with the context of use.
Consequently, Petersen et a1. (2004) construct a framework in order to distinguish
aesthetics of use and appearance. Although their study is conceptual, it provides strong
theoretical foundation for ﬁirther exploration of pragmatic aesthetics in interactive
systems.

In a more utilitarian scope, Coursaris et al. (2008) investigate color as a

fundamental aesthetic principle. Their study was task-oriented in the context of online

23

hotel booking. They tested split-complimentary color schemes that utilized combinations
of cool and warm colors. Their ﬁndings offer support to prior studies on color
combinations (Brandy and Phillips 2003, Papachristos et. al. 2005). Coursaris et al.
(2008) found that users perceived Web layouts, which combine a cool primary color and
a cool or warm secondary color, as the most appealing. They also expanded Lavie and
Tractinsky’s ﬁndings regarding classical and expressive aesthetics by identifying an
impact of classical aesthetics to expressive ones.

Following a similar pattern, Cai et al. (2008) explore the effects of Web aesthetics
on consumers’ online behavior. The main purpose of their study is to investigate the
effects of aesthetics across different online shopping sites. They claim that Web
aesthetics are capable of inﬂuencing the users’ mood in an online store environment and
consequently their entire perception regarding the whole online shopping experience.
They also see Web aesthetics impacting the e-A tmospherics (Sautter et al. 2004) of online
stores, which may subsequently impact the overall perceived quality of the online
shopping experience (Cai et al. 2008).

Hartmann et al. (2007) introduced a theoretical framework for the assessment of
websites’ attractiveness. They constructed a questionnaire based to the Adaptive Decision
Making (ADM) theory and they used it to evaluate three websites, which shared the same
topic but were different in terms of aesthetics. The ADM theory alleges that people’s
ability to make decision is adaptive and contingent upon the required task, the context
and their background, and experiences (Payne et al. 1993). They hypothesized that users
would judge according to their background, culture, training, the importance and the

nature of the tasks, and the interactions between decision-make criteria. Hartman et a1.

24

(2007) proposed ﬁve different judgment criteria: usability, content, aesthetics, reputation
and customizability. The participants were categorized in three different groups
depending on the national origin and academic background. Their ﬁndings showed a
signiﬁcant correlation between aesthetics and usability. Interestingly, the investigators
found a difference between objective usability (reported problems) and subjective
usability. Thus, it could be argued that overall favorable aesthetic impression of a
website, augmented by aesthetics, may overcome poor usability experience (Hartmann et
al. 2007).

Lim et al. (2007) introduce their concept of designing aesthetic interactions. They
name it interaction gestalt. According to them, an interaction gestalt is an autonomous
entity laid between the user experience and the interactive artifact. They deﬁne
interaction gestalt as a language through which designers may manipulate the aesthetics
of interaction. A uniﬁed code system that allows designers to understand what attributes
(design principles) may be considered in order to result desirable designs. Lim et al.
(2007) state that visual designers know how to design based on their intuitions and
insights, similar to other craftsmen like carpenters. However, they usually do not possess
any theoretical knowledge of use experience in the speciﬁc context that they design into.
They trust the internalized knowledge in order to produce both aesthetically pleasing and
usable products. Lim et al. (2007) aim to provide designers with a set of interaction
attributes which can be consciously manipulated to produce successﬁrl “gestalt
interactions,” namely the aesthetic perceptions that emerge between the user experience

and the interactive artifact.

25

Donald Norman and his insightful and inﬂuential books regarding emotions and
design have evoked several scholars to discuss aesthetics and emotions as an important
element of HCI. There has been a keen interest in user interfaces, which elicit emotions
(Lottridge 2008). Individuals can easily assess aesthetics. Consequently, aesthetic appeal
is perceived early during any human-interface interaction, although aesthetic properties
can also affect later perceptions. Humans tend to be attracted to beauty in any context.
Jordan (1998) found that several products, which could engender pleasurable feelings,
were considered more usable than those, which did not convey some visual
attractiveness. Nakarada and Lobb (2005) found that a user is most likely, either
consciously or subconsciously, to remain in an attractive environment more than in a less
attractive one. That is partly due to positive feelings associated with the visually
attractive stimuli.

In one of her latest studies, Lindgaard (2007) explains a paradox she encountered
when she was participating in a usability study in the late 905. In one of the evaluations, a
group of participants faced serious difﬁculties when attempted to complete the tasks.
Only half of the tasks were completed. However, their ratings regarding perceived
usability and satisfaction were as low as another group of participants, who had to merely
browse the site without completing any tasks or face any usability issues. First impression
seemed to be a key criterion because it could evoke emotions, which impact the initial

perception of a website and also later perceptions of usability and satisfaction.

26

Usability

According the Usability Professionals Association (2008) “usability is the degree
to which something - software, hardware or anything else - is easy to use and a good ﬁt
for the people who use it”. Also, frequently the term usability refers to the techniques and
processes used for the design and development of usable products. Software psychology
that started being used in early 705 is considered to be the ﬁrst form of usability.
“Soﬁware psychology dealt with the utility of a behavioral approach to understanding
software design, programming, and the use of interactive systems, and to motivate and
guide system developers to consider the characteristics of human beings (Carroll 1997).”

There have been several deﬁnitions of usability put forth by scholars. Jacob
Nielsen (1993) proposed a deﬁnition where usability was encapsulated as the process of
testing with a handful of techniques to gain a system’s learnability, efﬁciency,
memorability, less errors, and user satisfaction. Rubin (1994) proposed similar usability
attributes, including learnability, effectiveness, usefulness, and attitude. A third deﬁnition
is put forth by the International Organization for Standardization (ISO 9241-11), which
deﬁnes usability as “the extent to which a product can be used by speciﬁed users to
achieve speciﬁed goals with effectiveness, efﬁciency and satisfaction in a speciﬁed
context of use” (Bevan 2001). This deﬁnition is the most commonly used in the
operationalization of usability in related studies since the constructs of the ﬁrst two seem
to coexist in the constructs of the ISO 9241-11 deﬁnition:

0 Efficiency: the level of resource consumed in performing tasks,
' Eﬂectiveness: the ability of users to complete tasks using the system, and the quality of

output of those tasks,

27

° Satisfaction: users’ subjective satisfaction to using the system

As it was mentioned previously, usability also refers to human centered design
techniques, which are utilized across the design process to assure usable and desirable
products. According to ISO 13407 "Human-centered design is characterized by: the
active involvement of users and a clear understanding of user and task requirements; an
appropriate allocation of function between users and technology; the iteration of design

solutions; multi-disciplinary design" (ISO 13407, 1999).

 

 

 

Perceived

/ Attractiveness \

Aesthetics Usability

 

 

 

 

 

 

V

 

 

 

 

 

 

 

Affect

 

 

 

 

Figure 1. Research framework

Thus far it was examined how aesthetics may potentially impact the usability of
websites either directly or by altering the users’ perceived attractiveness, and mood
(feelings). This theoretical research framework presented in the Figure 1, may be
leveraged for future research, as several research models may emerge out of it. In the
next chapter, the focus of this study on classical aesthetics, perceived attractiveness and

usability is disclosed.

28

 

Chapter 2 - Theoretical Foundations & Research Framework

The above literature described in the previous chapter although coming from
different disciplines and backgrounds, may be used to construct a theoretical foundation
for the existence of a relationship between aesthetics and usability. As it has been
examined so far, visual aesthetics, in the context of website design, have been separated '
into two distinct categories. Figure 2 depicts the focus of this study, which proposes the
relationship between classical aesthetics (visual clarity), perceived attractiveness, and

usability.

 

 

Perceived
Attractiveness

 

 

 

 

Classical
Aesthetics

 

 

 

 

Usability

 

 

 

 

 

 

Figure 2. Potential relationship between classical aesthetics and usability

Numerous research conditions can potentially be investigated and studied.
Throughout the literature review, various factors were examined, which led to the
assumption that various types of connections and relationships exist between aesthetics
and usability. Considering the lack of a solid theoretical background and ambiguity of the
topic, attempts of studying design principles and elements in pairs may be misleading and

ambiguous, thus this study concentrates only on the fundamental design element of white

29

space. Operationalizing white space can enormously contribute to future research and
pave the path for the disambiguation of aesthetics in this particular domain.

The emerging research model (ﬁgure 2) allows the investigation of how different
percentages of utilized white space may impact the perceived attractiveness and usability
of websites. Subsequently, it is explored how a higher level of perceived attractiveness
may impact the perceived usability of a particular design.

Harrington’s et a1. (2004) statement of optimal white space use could not be
applied to electronic design without an in depth investigation. Many different factors,
such as screen resolutions, lighting, context of use and other, confound such a statement.
This study seeks to initiate an application of the Harrigthon et a1. (2004) statement and
explores whether or not it can be successfully extended to electronic design. Therefore,
and by being aware that the above literature belongs to multiple design domains, the
following hypothesis is proposed:

H1. The more the utilized space approaches half of the total area of the Web pages of a
website, the greater the perceived attractiveness of the website will be.

Throughout the literature review we came across enough evidence, which supports
potential relationships between perceived attractiveness and usability. Thus, a number of
relationships are proposed:

H2. The more the utilized space approaches half of the total area of the Web pages ofa
website, the greater the perceived efﬁciency of the website will be.

H3. The more the utilized space approaches half of the total area of the Web pages of a

website, the greater the perceived effectiveness of the website will be.

30

H4. The more the utilized space approaches half of the total area of the Web pages of a
website, the greater the perceived satisfaction of the website will be.

H5. The greater the level of perceived attractiveness of a website is, the greater its
perceived eﬁ‘iciency will be.

H6. The greater the level of perceived attractiveness of a website is, the greater its
perceived effectiveness will be.

H7. The greater the level of perceived attractiveness of a website is, the greater its
perceived satisfaction will be.

These seven hypotheses may illuminate the path of how white space could possibly
impact the perceived usability and perceived attractiveness of websites. Current literature
supports that perceived attractiveness and emotions seem to be highly connected with the

perceived usability of interactive artifacts.

 

 

 

White H1 Perceived

__._____.—.> -
space Attractlveness

 

 

 

 

 

 

 

 

 

 

Figure 3. Proposed Research Model

31

Context of study

Ideally, the heuristics of this study would be able to be greatly generalized and
applied to a variety of websites with different scopes and purposes. However, the current
range of websites and the versatility of the Web will not allow such attempt. The Web
provides a great plethora of any type of information. Visual communication puts that
farrago of information into order by utilizing several principles including aesthetics. As
we have examined so far, people’s tastes regarding aesthetics are constantly changing. It
becomes even more complicated, when we are referring to consumption and delivery of
information in an era that e-commerce, electronic advertising and social networking are
dominating the World Wide Web (Kroski 2007). The online behavior of the user,
although sometimes shares similarities, is usually diverse depending on the context. The
current study is leaning towards the e-commerce domain following a path of similar
studies (Cai et a1. 2008, Coursaris et al. 2008). The website created for the online
experiment represents a ﬁctional travel agency. Its design follows the current “online
travel agency” standards in terms of layout and presentation of information. Such
websites are prominent for the plethora and condense of information, while white space is
minimally apparent. The users’ experience with the present study may bring into light
whether or not the current trends regarding white space usage are accurate. Also, insights
regarding how aesthetics may inﬂuence the online travel agency industry may be
provided, which could potentially contribute to a better understanding of the user
experience in this particular context. In addition, it is expected that the potential patterns
of this study can be generalized (to a certain extent) in a way that could be applied to

other websites in similar domains, mainly under the umbrella of e-commerce.

32

Chapter 3 - Research Methodology
Experiment design and procedure

An empirical study was conducted to validate the proposed research model (shown
in ﬁgure 3). The study employed a three-groups between-subj ects design, where white
space was manipulated at three levels. Each treatment represented an increased level of
utilized white space. The operationalization of white space in this study follows the
deﬁnition stated by Harrington et al. (2004) in the context of automated document layout.
The deﬁnition states that for an effective use of the overall space of a document, the
“white space should total about half of the total page area. The non white-space area can
be estimated by totaling the areas of the content objects." This study applies this
measuring method into Web design.

Three different versions of a website were developed. The website is a mock-up
design of a ﬁctional travel agency. The three versions differentiated only in terms of how
much white space was used. The manipulation of white space was done by increasing or
decreasing the amount of information within the content blocks, by escalating or
declining the fonts’ size, the buttons, the navigation bar and generally all the visual
elements within the ﬁxed sized pages. Nevertheless, the width and height of the pages
remained the same across the three versions in order to provide “as much as possible”
similar user experience across different browsers and platforms. The deviation due to the
white space manipulation among the three versions resulted in users receiving similar
amount of information across the versions.

Harrington et al. (2004) state that the content blocks must occupy 50% of the total

area of a page. Thus, within the ﬁrst version, the white space occupied approximately

33

50% of the total area. This version is functioning as the baseline while the other two are
deviating from this optimal point. Subsequently, the second version utilized less negative
space (approximately 25%). This reduction occurred by increasing the amount of detailed
information within the content blocks and by escalating sizes of the font and the other
visual elements (e.g. search bars, button, etc.). The third version utilized a greater amount
of white space (approximately 75%). To reach the 75% white space, the content of the
information blocks was decreased in terms of detailed information, fonts sizes and sizes
of the other visual elements. The scaling occurred using the Adobe Dreamweaver web-
authoring tool. The pages were divided into distinct content blocks. They all had a width
of 780 pixels, which considered even the lowest-end users using monitors of 800 by 600
resolution.

The home page consisted of the banner, the navigation, the main advertisement
box, the booking form, the special offers box, the vacation packages box and the
secondary advertisement block. Each of those content blocks was manipulated in order to
construct the three different versions. The banner division included three lines of text, the
title of the ﬁrm and the “sign-in” (personalized content) lines. All text was manipulated
to achieve different amounts of white space within the block. In the 25% of white space
version, the ﬁrm’s title had a font size of 18 points, which was increased to 24 and 30
point for the 50% and 75% of white space versions respectively. Similarly, the sign-in
lines were increased from 10 and 12 points in the high white space version (75%) to 12
and 14, and 14 and 16 points in the other two treatments. The navigation bar consisted of
5 buttons. The text within the buttons increased across each version to achieve either

lesser or greater amount of white space. The buttons of the 50% had text of 16 points

34

size, which decreased to 12 points for the 75% version and increased to 20 points on third
treatment. The middle part of the front page was divided into two parts. The left one
accommodated the main advertisement block, while the right one was used for the
placement of the interactive booking form. The main advertisement box consisted of one
main picture, which was depicting an exotic destination of a special offer. In the version
with lower white space (25%), the picture did not have any marginal frame around it, and
occupied 520 by 260 pixels of space. While a ﬂame was placed around the picture in
order to add white space in the other two versions, which resulted in decline of the
picture’s size to 460 by 230 and 400 by 200 in the consequent versions. Meanwhile, the
decline of fonts’ and forms’ sizes within the interactive booking form at the right part
resulted in an increased amount of white space. The fonts sizes used across each version
were: 12pt., 14pt., and l6pt. The forms’ width increased from 100 to 160 and 220 pixels
for the 25%, 50%, and 75% of white space treatments respectively. The lower part of the
page was also divided into two divisions. The right part was occupied by the “vacations
packages” section and the left one by the “hot destinations” section. Both sections
utilized icons with accompanying text to promote vacation packages and popular
destinations. The initial treatment of 50% white space accommodated two popular
destinations and two vacations packages. The deviation towards lesser white space (25%)
was achieved by increasing the size of the content in a similar manner as the upper parts
of the page. In the third manipulation (75%), one of the vacation packages and one of the
popular destinations were removed in order to increase the amount of white space.

The manipulation of white space for the remaining pages of each version followed

an identical manner. In terms of content, it was ensured that the text removed did not alter

35

the adequacy of the delivered content by removing superﬂuous words.

The experiment was entirely web-based. The participants were recruited via an
email advertisement and their participation was voluntarily. Through a hyperlink
included in the email advertisement, participants were led to a Web page where they were
informed about the study and its procedures. On the same page, they had to give their
consent in order to proceed. A randomizer, which was developed with a server side
technology (PHP), assigned one of the three versions to each participant. Tasks prompted
the subjects to browse through the experimental version and search for speciﬁc
information. The participants were informed that the tasks were only meant to offer an
opportunity to explore the website and its design. They were also informed that their
performance was not going to be evaluated. After having them navigate one of the three
websites, the participants were asked to rank the website design in terms of their
respectively perceived aesthetics, efﬁciency, effectiveness and satisfaction.

Subjects

A convenience sample was gathered via email through several Michigan State
University mailing lists. The entire subject population consists of university students,
faculty and staff. A total of 94 subjects participated. Out of those data sets that were
collected, 90 sets of data were actually usable, with a minimum of 30 subjects per group.
Each participant was randomly assigned one of the three treatments in order to control
perplexing effects due to differences in subjects’ chacteristics. The sample showed that
62% of the participants were females with the rest of the percentages belonging to
opposite gender. The average age was 27 (ranging from 19 to 52). All the participants

had at least some college education, with over 50% of them either holding or pursuing an

36

advanced degree. ANOVA tests did not ﬁnd signiﬁcant differences for subjects in the
various treatment groups, thus conﬁrming the successful randomization of assignment
across groups.
Instruments scales and validity

The questionnaire used for data collection contains scales that measure the
various constructs shown in the research model (ﬁgure 3). All scales were adapted from
prior studies. Scales for perceived efﬁciency and effectiveness were borrowed from
Coursaris (2005). Scales for perceived attractiveness were borrowed from Lavie and
Tractinsky (2004), and lastly, scales for perceived satisfaction and some scales for
perceived efﬁciency were taken from Davis (1989). All these scales had established their
reliability and validity, thereby satisfying content validity. All the perceived usability
studies were reworded to better ﬁt in the context of this study. The scales were used to
measure the users’ perceived attractiveness of the three distinct version of the website,
through assessments of “classical aesthetics.” These 7-point Likert items (anchored
“Strongly Disagree/Agree”) measured responses to the shared question, “I consider the
website’s design to be” for each of the following items: clean, clear, aesthetic, pleasant,
symmetrical and organized.

Since the items used for the measurement of the aesthetic perceptions of the users
are relevantly new, a reliability analysis was run to identify potentially latent items. The
initial analysis showed a ﬁrst total Cronbach’s alpha of .899 and satisfactory item-total

correlations (table 1).

37

Table l. Perceived attractiveness construct items and their total correlations

 

 

 

 

 

 

 

 

 

 

 

 

Item Question: Likert 7'50319 Item-Total Cronbach’s Cronbach’s a
strongly disagree to strongly correlation alpha if item deleted
agree

Aesthetics .899

Aestheticsl Clean .787 .872
AestheticsZ Clear .746 .879
Aesthetics3 Aesthetic .758 .877
Aesthetics4 Pleasant .81 l .868
AestheticsS Symmetrical .516 .913
Aesthetics6 Organized .757 .877

 

 

 

(Note: * denotes that the speciﬁc item was removed from the subsequent analysis)

Only one item (Aesthe5) did not meet the criterion of an at least 0.7 total correlation as

addressed from the literature (Hulland 1999). Adherence to that criterion required the

removal of the speciﬁc item in the subsequent analysis. After the removal of the non-

valid item, every item was re-validated by testing again its item-total correlation (table 2).

In terms of usability three scales were used to measure the users’ perceived

efﬁciency, effectiveness and satisfaction. Similar 7-point Likert scales were used,

anchored “Strongly disagree/agree” responses to corresponding questions. All items used

within the survey are listed in the Appendix 2. Since all the items were taken from

signiﬁcant previous studies (Coursaris et a1. 2005, Davis 1989) the reliability analysis,

expectably, offered strong results (table 3.) Construct statistics are presented in Table 4.

38

Table 2. Perceived attractiveness Cronbach’s alpha, construct items and their item-total correlations

 

 

 

 

 

 

 

 

Item Question: Likert 7-scale Item-Total Cronbach’s a
strongly disagree to strongly correlations
agree
Aesthetics .9 l 3

Aesthl Clean .775

Aesth2 Clear .763

Aesth3 Aesthetic .766

Aesth4 Pleasant .820

Aesth6 Organized .767

 

 

 

 

Table 3. Usability constructs’ Cronbach’s alpha, construct items and their item-total correlations

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Item Question: Likert 7-scale Item-Total Cronbach’s
strongly disagree to strongly correlation alpha
agree

Efficiency .954
Efﬁciel Easy to learn how to use .892
Efﬁcie2 Easy to use .922
Efﬁcie3 Fast .840
Efﬁcie4 User friendly .897

Effectiveness A _ _______ .962
Effectil Successful task completion .929
Effecti2 Accurate task completion .929

Satisfaction .970
Satisfal Feeling pleased .935
Satisfa2 Feeling satisﬁed .940
Satisfa3 Feeling contended .935
Satisfa4 Feeling happy .902

 

 

 

 

 

39

 

Table 4. Construct statistics

 

 

 

 

 

 

Aesthetics Efficiency Effectiveness Satisfaction
Arithmetic means 5.405 5.041
(all items) 5.444 5.7278
Arithmetic means 5.405 5.041
(used items) 5.486 5.7278
Cronbach’s a .913 .954 .954 .970
reliability
Standard 1 232 1.512 1.906 1.490
deviation '

 

 

 

 

 

 

Continuing the discussion regarding the instrument’ validity, Table 5 presents statistics

regarding all the signiﬁcant and validated items and constructs that were used in the

statistical analysis.

Table 5. Items and Construct statistics

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Mean Std. Dev Error Item-Total Alpha Alpha if item
correlation deleted
Aesthetics 5.486 1.232 0.129 0913
Clean. 5.700 1.393 0.146 0.775 0.894
Clear 5.566 1.390 0.146 0.763 0.896
Aesthetic 5.222 1.443 0.152 0.766 0.896
Pleasant 5.41 1 1.549 0.163 0.820 0.884
Organized 5.533 1.375 0.145 0.767 0.895
Efficiency 0- 954
Efﬁciel 5.877 1.534 0.161 0.892 0.938
EfﬁcieZ 5.666 1.682 0.177 0.922 0.928
Efﬁcie3 5.811 1.592 0.167 0.840 0.953
Efﬁcie4 5.555 1.642 0.173 0.897 0.936
Effectiveness 0. 962
Effectil 5.411 1.999 0.210 0.929 N/A
Effecti2 5.400 1.883 0.198 0.929 N/A
Satisfaction 0. 970
Satisfal 5.066 1.613 0.170 0.935 0.958
Satisfa2 5.088 1.583 0.166 0.940 0.957
Satisfa3 5.011 1.624 0.171 0.935 0.958
Satisfa4 5.000 1.390 0.146 0.902 0.969

 

 

 

40

Chapter 4 - Results and Discussion
Results

The ﬁrst hypothesis stated that “The more the utilized space approaches half of
the total area of the Web pages of a website, the greater the perceived attractiveness of
the website will be. " Table 1 depicts the ANOVA test results, which suggested that there
was no signiﬁcant difference among the three groups (p = 0.161). Thus within the
context of this study, white space does not appear to have a signiﬁcant impact on how
attractive the design was perceived by the subjects. However, comparing the means of the
three groups (table 6), a difference between the 50% and the 75% groups was revealed.
The directionality of the study follows the pattern proposed by the hypothesis. The
perceived aesthetic appeal decrease once the percentage of white space increases higher
than 50% of the total area. The Tukey test results shown in Table 8, illustrate these
differences between the three groups. Also, although there is no statistical signiﬁcance, it
can be seen that the p value is lower (therefore more signiﬁcant) when the white space
deviates from the optimal point (50%), and especially when it goes over 50%. Thus, it
could be implied that differences occur as the white space is drastically increased,

although the ﬁndings of this study do not offer statistical support.

Table 6. Perceived attractiveness rankings between youps

 

 

 

 

 

White space used N Mean Std. Dev. Error
25% 30 5.580 1.151 0.210
50% 30 5.733 1.078 0.196
75% 30 5.146 1.409 0.257

 

 

 

 

 

41

 

 

 

 

 

Table 7. ANOVA for relationships between white spacwou as and perceived attractiveness
Mean
Sum of Squares df Square F Sig.—
Between Groups 5.555 2 2.777 1.863 .161
Within Groups 129.729 87 1.491
Total 135.284 89

 

 

 

 

 

 

 

 

Table 8. Tukey test for relationships between white space groups and perceived attractiveness

 

 

 

 

 

White space Mean difference Error Sig.
25% 9 50% 0.153 0.315 0.878
25% '9 75% 0.433 0.315 0.359
50% -) 75% 0.586 0.315 0.156

 

 

 

 

 

The second hypothesis stated that “The more the utilized space approaches half

of the total area of the Web pages of a website, the greater the perceived efﬁciency of the

website will be. ” ANOVA test results offer support to this hypothesis (table 10).

According to the Tukey test results (table 1 1), there seems to be a signiﬁcant negative

effect on perceived efﬁciency when white space increases from 50% to 75%

(p = 0.007), and from 25% to 75% (p = 0.010). On the contrary no signiﬁcant difference

occurs when the white space drops from 50% to 25% (p = 0.986). It seems that the users

have adapted the currents trends of travel agency website design is of a high level. The

vast majority of such websites utilize a minimal amount of white space, thus users seem

to be used to that trend and perceive less white space as efﬁcient.

Table 9. Perceived efﬁciency rankings between groups

 

 

 

 

 

White space used N Mean Std. Dev. Error
25% 30 6.075 0.924 0.168
50% 30 6.133 0.962 0.175
75% 30 4.975 2.087 0.381

 

 

 

 

 

 

42

Table 10. ANOVA for relationships between white space groups and perceived efficiency

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Sum of Squares df Mean Sq. F Sig_._
Between Groups 25.551 2 12.776 6.243 .003
Within Groups 178.029 87 2.046
Total 203.581 89
Table 11. Tukey test for relationships between white ﬂee groups and perceived efﬁciency

White space Mean difference Error Sig.

25% 9 50% 0.583 0.369 0.986

25% 9 75% 1.100 0.369 0.010

50% 9 75% 1.158 0.369 0.007

 

 

 

 

 

The third hypothesis stated that “The more the utilized space approaches half of

the total area of the Web pages of a website, the greater the perceived eﬂectiveness of the

website will be. ” AN OVA test results offer support to this hypothesis by giving a p value

of 0.004 (table 13). After running a Tukey test, (table 12), there seems to a signiﬁcant

negative effect on perceived effectiveness when white space increases from 50% to 75%

(p = 0.015). On the contrary, no signiﬁcant difference occurs when the white space drops

from 50% to 25% (p=0.925). Once again, a negative effect seems to occur, when white

space increases over the optimal point.

Table 12. Perceived effectiveness rankings between groups

 

 

 

 

 

White space used N Mean Std. Dev. Error
25% 30 5.916 1.358 0.248
50% 30 5.816 1.511 0.275
75% 30 4.483 2.387 0.435

 

 

 

 

 

 

Table 13. ANOVA for relationships between White space roups and perceived effectiveness

 

 

 

 

 

 

 

 

 

 

Mean
Sum of Sjuares df Square F Sig.__
Between Groups 38.422 2 19.211 5.864 .004
Within Groups 285.025 87 3.276
Total 323.447 89

 

 

43

Table 14. Tukey test for relationships between white space groups and perceived effectiveness

 

 

 

 

 

White space Mean difference Error Sig
25% 9 50% 0.100 0.467 0.975
25% 9 75% 1.433 0.467 0.008
50% 9 75% 1.333 0.467 0.015

 

 

 

 

The fourth hypothesis stated that “The more the utilized space approaches half of

the total area of the Web pages of a website, the greater the perceived satisfaction of the

website will be. ” AN OVA test results also offer support to this hypothesis (table 13).

Comparing the means of the three groups with Tukey’w test (table 14), there seems to a

signiﬁcant negative effect on perceived satisfaction when white space increases from

50% to 75% (p = 0.007) and from 25% to 75% (p = 0.006). On the contrary, no

signiﬁcant difference occurs when the white space drops from 50% to 25% (p = 0.997).

Therefore, a pattern seems to be emerging regarding a higher than 50% white space usage

in terms of perceived usability. The users seem to prefer lesser amounts of white space

(always in the context of e-commerce website designs, and speciﬁcally online travel

agencies).

Table 15. Perceived satisfaction rankin s betweegroups

 

 

 

 

 

White space used N Mean Std. Dev. Error
25% 30 5.433 1.090 0.199
50% 30 5.408 1.188 0.216
75% 30 4.283 1.823 0.332

 

 

 

 

 

Table 16. ANOVA for relationships between White space

groups and perceived satisfaction

 

 

 

 

 

Sum of Sguares df Mean Square F SiL
Between Groups 25.888 2 12.944 6.551 .002
Within Groups 171.894 87 1.976
Total 197.781 89

 

 

 

 

 

 

 

44

 

 

Table 17. Tukey test for relationships between white space groups and perceived satisfaction

 

 

 

 

 

 

 

 

White space Mean difference Error Sig.
25% 9 50% 0.025 0.362 0.997
25% 9 75% 1.150 0.362 0.006
50% 9 75% 1.125 0.362 0.007

 

 

The ﬁfth, sixth and seventh hypotheses stated “The greater the level of perceived
attractiveness of a website is, the greater its perceived efficiency, effectiveness and
satisfaction will be. ” A regression analysis was run to identify potential connections
between perceived website attractiveness and perceived website usability. Table 18
shows the Pearson correlations between perceived attractiveness and each of the usability
constructs. An array of potential connections among perceived attractiveness and
perceived usability seem to emerge. All three usability constructs appear to be correlated

with how perceptually attractive the website was, according to the subjects.

Table 18. Pearson’s correlations between perceived attractiveness and perceived usability

 

 

 

 

 

 

 

R R2
Efﬁciency 0.657 0.432
Effectiveness 0.620 0.385
Satisfaction 0.709 0.505

 

 

The R squares indicate that in this study, 43.2% of the variance in Efﬁciency, 38.5% of
variance in Effectiveness and 50.5% of variance in Satisfaction were explained by
perceived attractiveness. While the 5th and 6th hypothesis (p. efﬁciency and p.
effectiveness) were not statistically supported, there was strong support regarding the
relationship between perceived attractiveness and perceived satisfaction. Therefore, it is
found, that perceived attractiveness may explain to a large extent variance in perceived

usability of a website, particularly in terms of user satisfaction.

45

An ANOVA test was run to ensure the signiﬁcance of the regression model (table 19). In

addition, the Table 20 presents in more details the results of the regression analysis.

Table 19. ANOVA for the signiﬁcance of the regression model

 

 

 

 

 

 

 

 

 

Sum of Squares df Mean Square F Sig.
Regession 58.385 1 58.385 66.814 .0008
Residual 76.899 88 0.874
Total 135.284 89

 

 

 

Table 20. Regression analysis model between perceived attractiveness and usability

 

 

 

 

 

 

 

 

 

 

B Error Beta t Sig.__
H5 Attractive 9 Efﬁcient 0.149 0.121 0.182 1.229 0.222
H6 Attractive 9 Effective 0.057 0.088 0.088 0.644 0.521
H7 Attractive 9 Satisfactory 0.406 0.116 0.491 3.489 0.001

 

 

 

Lastly, a regression analysis was run, to identify the relationships among the

constructs of usability. The results indicate that almost 72 percent of the variance in

satisfaction was explained by perceived effectiveness and efﬁciency (R2 .719). Findings

(shown in Table 21), support existing literature (Coursaris, 2005) by showing a strong

linear relationship between perceived efﬁciency and satisfaction, and also between

perceived effectiveness and satisfaction.

Table 2]. Regression analysis model between perceived efﬁciency, effectiveness and satisfaction

 

 

 

 

 

 

 

 

B Error Beta t Sig._
Efﬁciency 9Satisfaetion 0.537 0.095 0.544 5.625 .000
Effectiveness 9 Satisfaction 0.269 0,076 0,345 3,560 .001

 

 

 

46

 

Discussion

The ﬁndings of this present study extend prior research in HCI concerning the
role of aesthetics in User Experience and particularly in usability (Tarasevich 2001, Lavie
and Tractinksy 2004, Nakarada and Lobb 2005, Coursaris 2008). This study examined
the role of white space utilization in website design by testing three different version of a
website. Across the three versions, white space was manipulated to occupy 25, 50 and 75
percent of the total area of the pages, respectively.

This study presents a series of ﬁndings showing that variations in white space
usage could impact the perceived usability of websites. The empirical evaluation showed
that deviation from the optimal point (50% white space) as stated from the literature
(Harrington et al. 2004) is able to alter the users’ perceptions of usability. The greatest
negative impact seems to be when the white space increases to occupy 75% of the total
area of the pages. In this case, the analysis indicated that all three usability constructs
were affected. Perceived satisfaction appeared to experience the greatest negative effect
due to white space ampliﬁcation. Perceived efﬁciency and effectiveness followed a
similar pattern of decline, when white space was increasing.

On the contrary, there was no signiﬁcant alteration in terms of perceived usability
when the usage of white space decreased under the optimal point. It seems that the users’
adaptability to the currents trends of website design is high. The website genre tested
(travel agency) in this study, is characterized by its minimal usage of white space.

The vast majority of such websites tend to utilize a minimum amount of white space, in
order to condense and include a maximum amount of content So it could be argued that

users seem to perceive lower amounts of white space more usable than higher ones.

47

That could be explained, when considering the context of use. Users seek detailed
information for effective decision making regarding their potential bookings or
purchases. When that amount of information is decreased in favor of white space and
other principles interconnected with white space such as clarity and cleanliness, the users
do not appear to perceive it favorably. Thus, it is suggested that context of use is critical
when considering web aesthetics. It could also be argued that the impact of aesthetics will
differ signiﬁcantly across different contexts.

In addition, ﬁndings of this study offer further support to existing research
regarding the relationship between perceived attractiveness and perceived usability. An
array of potential connections among perceived attractiveness and perceived satisfaction
emerge. Perceived satisfaction appeared to be correlated with how perceptually attractive
the website was, according to the subjects’ self-reported evaluations. Findings indicated
that perceived attractiveness considerations are able to inﬂuence judgments regarding the
perceived satisfaction with a website.

Furthermore, the results did not indicate any signiﬁcance between perceived
efﬁciency, perceived effectiveness, and perceived attractiveness. It could be argued that
perceived attractiveness, which mainly deals with the hedonic aspect of user experience,
does not inﬂuence the utility (efﬁciency/effectiveness).

While other studies found effects of aesthetics on the perceived attractiveness of
websites (Lavie and Tractinksy 2004, Coursaris 2008), this study did not offer statistical
support about the proposed relationship between white space and perceived
attractiveness. At ﬁrst glance, it seems that manipulation of white space did not have a

signiﬁcant impact on the perceived attractiveness of the website. However, it became

48

apparent that despite the absence of statistical signiﬁcance, the directionality of the study
followed the pattern illustrated in the theory from Harrington et al. (2004). Therefore,
within the context of travel agency websites, white space did not appear to have a
signiﬁcant impact of how attractive the design was perceived. Nevertheless, the
perceived aesthetic appeal seems to decrease once the usage of white space deviates from
the optimal point. Thus, this study argues that differences may occur as the white space is
drastically increased, although the statistical analysis does not offer signiﬁcant support.
Another plausible explanation for this observation is that aesthetics, both classical and
expressive, are always applied in combinations, thereby creating cohesive visual units
throughout the pages. In this case, the combinations might ﬁmction in favor of white
space, thus no signiﬁcant alteration in terms of perceived attractiveness seemed to
emerge. These current ﬁndings yield to a need for a more in-depth exploration of the
manipulation of white space, especially in an era that users seem to adapt current design
trends, which are characterized by a higher concentration of information and a lower
usage of white space.

In closing, this study pursued the extension of the ﬁndings of previous studies
(Lavie and Tractinsky 2004, Brandy and Phillips 2003, Coursaris 2008, Cai 2008,
Hartmann et al. 2007, Lindgaard et al. 2007), about the understanding of how the
manipulation of visual design elements may impact users’ perceptions of usability and

perceived attractiveness.

49

Chapter 5 — Contributions and limitations of this research
Contributions of this research

A user’s given impression (or more precisely a ﬁrst impression) of a website
design is heavily dependent on aesthetics. Aesthetics can generate positive emotions,
which can impact a user’s mood and consequently his/her perception of the website.
Recently, a few theoretical frameworks have emerged out of research into the effects of
emotions created by artifacts. For example, Tractinsky (2004) cites Norman et al. (2002)
who suggest a three-level theory of human behavior that integrates two information-
processing systems, namely the affective and the cognitive. In each level, the world is
being evaluated (affect) and interpreted (cognition). The lowest level processes take place
at the intuitive level that surveys the environment and quickly communicates affective
signals to the higher levels. The behavioral level is where most of a person’s learned
behavior occurs. Lastly, the reﬂection level is where the highest-level processes take
place.

Current efforts in HCI research are differentiated from previous ones, where
human decisions were assumed to be consequents of strictly cognitive processes. Since
initial aesthetic impressions are affective, they are formed quickly at a low level and
therefore inﬂuence cognitive processes (Tractinsky 2004). Hence, the immediate
affective reactions can potentially control successive cognitive processes (Duckworth et
al. 2002). Early judgments inﬂuenced by beauty may lead to later perceptions about
deeper characteristics of the system (Tractinsky 2004). F ernandes et al. (2003) found that
evaluations of Websites’ attractiveness to which users were exposed for only ﬁve 0.5

second were highly similar to those of users who were exposed to Websites for longer

50

 

time periods. Thus, sufﬁcient evidence is provided for the importance of affect in the
context of usable interactive systems. By considering the emerged research framework,
affect becomes a critical factor and complements the ergonomic considerations that
typically drive the design decisions of telecommunication products. This study calls for
the integration of aesthetics in usability engineering and in particular prototyping.
Feedback sessions should probe for affective outcomes as well as performance-related
considerations typical of usability evaluations. Current subjective usability measures
capture user attitudes of working with systems by evaluation satisfaction, acceptability
and comfort (Gleiss et al. 2004). A natural extension to these dimensions would be the
inclusion of aesthetic appeal in the usability evaluation process.

There is sufﬁcient evidence to suggest a relationship between aesthetics and
usability. This study suggests that successful combinations of visual elements, which
obey basic rules of aesthetics, can enhance the usability of a website along with its
intended message. It seems that beauty plays a critical role in users’ perceptions of a
system both before and after using it.

There will be signiﬁcant implications for theory, as the traditional scope of
utilitarian usability will be expanded to include hedonic dimensions emerging from the
realm of aesthetics. A clearer understanding of the relationship between aesthetics and
usability is emerging, as increasingly more studies contribute in this area of HCI.

This study presents a set of ﬁndings regarding the effects of white space that may
be used in future research that seeks to empirically validate the effects of aesthetic
dimensions on usability. Implications to practice also emerge, starting with those on User

Experience Design (UXD). Our understanding of UXD and all of the related ﬁelds such

51

as User Interface Design (U1) and Interaction Design (IxD) is expected to shift by
heightening the role of aesthetic dimensions in contextual design. Furthermore,
implications for practice are also found in the context of improving Marketing

Communications by advancing the effectiveness of organizations’ website designs.

Limitations of this research

As it has been mentioned several times thus far, this study involves users’
perception. The study was conducted exclusively online in the form of a task completion
and a post-experiment survey that measured various subjective perceived evaluations of
the users’ perceptions. Many factors could not be controlled, such as different browsers
and connection speeds. A potential transfer of this study into a lab setting may generate
more accurate results in terms of the white space effects on perceived attractiveness and
usability.

A critical limitation for this study and also for other similar studies conducted, is
that the User Experience in the context of websites does not consist only of usability and
aesthetics. Other factors may inﬂuence it and put the aesthetic considerations aside.
Factors such as connection speeds, servers’ errors, content quality, writing, advertising,
and several others may inﬂuence the overall experience and do not allow any margins for
aesthetic explorations. This study assumes that the studied websites met many of these
standards expected by their potential users. It is given that factors such as functionality
and accessibility are greater concerns. When a website does not function properly or
when it is not sufﬁciently accessible to its audiences, aesthetics may play a less

signiﬁcant role.

52

 

Also the scope and purpose of different Websites could be critical factors when it
comes to assessing and evaluating Web aesthetics. When the need of transferring
important and “raw” information over the Internet is the number one priority, it is greatly
possible that aesthetics would not even be considered.

Culture is another limitation of this study. The Internet has enabled numerous
corporations and institutions to expand their target audiences across the globe. At his ﬁrst
study, Tractinksy (1997) expanded the study of Kurosu and Kashimura (1995) regarding
aesthetics and usability in the context of ATM machines. Although, the study occurred in
a different cultural context than the previous one, the results were similar. Nevertheless,
conclusions could not be made reliably since websites are more complicated than just
ATM interfaces. Designing across cultures may be complex since many factors should be
under varied consideration and interpreted, such as color combination, symbols,

alignment styles, and many others.

53

 

APPENDIX 1

Questionnaire:

Demographics
1.What is your gender? ( Male ) ( Female)
2. What is your age?
3. What is your highest level of education?
High school
Some College / University
College / University Graduate
Graduate Degree

Other

Likert 7-point from I strongly agree to strongly disagree
Perceived Attractiveness:

My perception of this websites is that it is...

clean

clear

aesthetic

pleasant

symmetrical

organized

54

 

1""

Effectiveness:
My perception of this websites is that...
I was able to complete all the tasks on the web site successfully.
I was able to complete all the tasks on the web site accurately.
Efﬁciency:
My perception of this website is that
It was easy to learn how to use it
It was easy to use
It was fast.
It was user friendly.
Satisfaction:
My perception of this websites is that...
I feel satisﬁed with my use of the website.
I feel pleased with my use of the website.
I feel contended with my use of the website.

I feel happy with my use of the website.

55

 

APPENDIX 2

Website:

 

Packages Contact

BOOMF‘QS and Reservations
I V I don-b

Hawaii Flight 4-
S-Niqht Hotel
« ‘frnm $529

.. iir‘xt 1.11!

 

" lmnolnobdno ablaze
:- s sprlmtimeln

' Rom...

”biomass; apply
val .

{3 Harman Tra Agency

 

Figure 4. 75% White Space used

56

 

Destin tions Cruises

I i right; I 40521
From:

Hawaii Flight +

S—Night Hotel

from $679

 

Cruises from ‘3"
5239‘ L '

. v ‘ ' ‘ was 'Ifltl‘y
20011 {I Mﬂ'Mrbfpf‘. Travel theory

 

Figure 5. 50% White space used

57

Home

‘ .......LL LL , .-..L..LL. _..--L-.L ....-L.
i Destinations Cruises 1 Packages g Contact

1 Bookings and Reservations
. . . l I Harms .Ho'els .Crmses
Hawaii Flight + ”m
5-Night Hotel ‘
from $679

1‘1“”:

' Imagine balm able to
;- soar-Id mysprimtim in
Rome "Valle-or

 

‘ 3: , M'J‘J
. 08 C Mun 'Mfttﬂﬁ'l I’raml Array

 

Figure 6. 25% White space used

58

BIBLIOGRAPHY

Balinsky H. (2006). Evaluating interface aesthetics: a measure of symmetry. Digital
Publishing Conference (E1126) Part of the IS & T/SPIE International
Symposium on Electronic Imaging, 15-19 January 2006, San Jose, California,
USA

Banker, RD, and Kauffman, RJ. (2004). The Evolution of Research on Information
Systems Management Science 50(3), 281—298.

Bennett J. G. (2005). Design Fundamentals for New Media. Thomson Delmar Learning,
USA. ISBN: 1-4018.3779-4.

Bevan, N. (2001). International standards for HCI and usability. International Journal of
Human-Computer Studies, 55, 533-552.

Brady, L. and Phillips, C. (2003). Aesthetics and usability: A look at color and balance.
Usability News, 5.1, Retrieved on October 15, 2006, from http://psychology.
Wichita.edu/surl/usabilitynews/S 1/aesthetics.htm.

Cai, S. Yu, J ., Xu, Y. (2008). The effects of Web site aesthetics and shopping task
consumer online purchasing behavior. In the proceedings of Computer Human
Interaction, Florence, Italy

Carroll, J. (1997). Human-computer interaction: psychology as a science of design.
International Journal of Human-Computer Studies. 46, 501-522.

Cooper, M. (1989). Computers and Design. Design Quarterly, No. 14, pp. 1+4-3l

Coursaris, C. (2005). Expectancy-Disconﬁrmation, Usability, and Adoption: A Study on
Mobile Devices. Proceedings of the Doctoral Consortium, 26th World Congress
on the Management of e-Business (MWC), Hamilton, Ontario, January 19-21,
2005.

Coursaris C., Swierenga. S., Watrall. E. (2008). Effects of Color Temperature and Gender
on Website Aesthetics. Journal of Usability Studies, Vol 4, Issue 2, February
2008, pp. 211-224

59

Davis. F. (1989). Perveived Useﬁrlness, Perceived Ease of Use and User Acceptance.
MIS Quarterly. September 1989, 13, 3.

De Angeli, A., Sutcliffe, A., and Hartmann, J. (2006). Interaction, Usability and
Aesthetics: What Inﬂuences Users’ Preferences? DIS.

Duckworth, K. L., Bargh, J. A., Garcia, M., and Chaiken, S. (2002). The Automatic
Evaluation Of Novel Stimuli. Psychological Science, 13(6), 513-519.

Dunlap, R. (1997). The golden ratio and Fibonacci numbers. World Scientiﬁc Publishing
Co. Pte. Ltd. ISBN 9810232640

Eysenck, H. J. (1983). Visual Aesthetic Sensitivity and its Measurement. In M. Russ
(Ed.), The Arts: A Way of Knowing, Oxford: Pergamon Press, 105-125.

Fernandes, G., Lindgaard, G., Dillon, R., and Wood, J. (2003). Judging the Appeal of
Web Sites,” in Proceedings of the 4th World Congress on the Management of
Electronic Commerce, McMaster University, Hamilton, ON, January 15-17.

Gleiss, N., Havard Skjetne, J ., Richardson, S. and Heim J. (2004). Usability of
Telecommunications. Retrieved on February 1, 2007, from
http://spccch.di.uoa.gr/hcstia/books/telecomm/clrapZ-4.html

Preston, A. and Dick, D. (2001). Does Usability Have a Role in Telecommunication?
Usability Interface, 7(4), April.

Harrington, S., Naveda, R, Price Jones, R., Roetling, P., Thakkar, N. (2004). Aesthetic
Measures for Automated Document Layout. In the Proceedings of Document
Engineering, Milwaukee, Wisconsin, October, 28—30, 2004.

Hartmann, J. (2006). Assessing the Attractiveness of Interactive Systems. In Proceedings
of Computer-Human Interaction, Montreal, Quebec, Canada.

Hartmann, J., Sutcliffe, A., De Angeli, A. (2007). Investigating Attractiveness in Web

User Interfaces. In the proceedings of Computer Human Interaction, San Jose,
CA, USA

60

 

 

Hassenzahl. M. (2004). Emotions can be quite ephemeral. We cannot design them.
Interactions. Oct. — Nov. 2004, 46—48.

Hoffman, R., and Krauss, K (2004). A critical evaluation of literature on visual
aesthetics for the Web. Proceedings of SAICSIT, 205-209.

Huh. J., Ackerman. M., Douglas. R. (2007). The Use of Aesthetics in HCI Systems.
Proceedings of Computer Human Interaction, San Jose, CA, USA

ISO 13407 (1999). Human centred design processes for interactive systems. Retrieved on
February 1, 2007, from http://www.usabilitynet.org/tools/l3407stds.htm

Karvonen. K. (2000). The Beauty of Simplicity. In Proceedings of CUU, Arlington VA
USA.

Klett, F. (2002). Visual Communication in Web-based Learning Environments,
Educational Technology & Society 5(4), 38 - 48.

Kim J., Lee J., Choi D., (2003). Designing emotionally evocative homepages: an
empirical study of the quantitative relations between design factors and emotional
dimensions. Int. J. Human-Computer Studies, 59, pp. 899—940.

Kirsanov, D. (2007). Contrast. Retrieved on February 1, 2007, from
http://www.wcbrcfcrcnce.com/d1ab/9702lcontrasthtml

Kurosu, M. and Kashimura, K. (1995). Determinants of the Apparent Usability.
Proceedings of IEEE SMC. 1509-1513. 27.

Kroski, E. (2007). Information Design for the New Web. Retrieved on May 22, 2008
from http://www.masternewmedia.org/information_design/information-design-
principles/web-ZO-design-simple-social-design-components-2007101 7.htm

Krug, S. (2000). Don’t make me thing. A common sense approach to web usability. New
Riders, Publishing, USA.

61

Kyrnin, J. (2008). Mathematics, Seashells, and Web Design
Using the Golden Ratio, Phi, or Fibonacci Numbers in Web Design. Retrieved on
May 27, 2008, from
http://webdesign.about.com/od/webdesignbasics/a/aa071607.htm

Lavie, T. and Tractinsky, N. (2004). Assessing Dimensions of Perceived Visual
Aesthetics of Web Sites. International Journal Human Computer Interaction.
60(3), 269—298.

Lim. Y., Stolterman. E., Jung. H., Donaldson. J. (2007). Interaction Gestalt and the
Design of Aesthetic Interactions. Designing Pleasurable Products and Interfaces,
Helsinki, Finland.

Lindgaard, G. (2007). Aesthetics, Visual Appeal, Usability and User Satisfaction:
What Do the User’s Eyes Tell the User’s Brain? Australian Journal of Emerging
Technologies and SocietyVol. 5, No. 1, 2007, pp: 1-14

Loewen, J. (2006). Design & Branding / Basic Design Principles for the Web. Retrieved
on January 29, 2007, from http://www.locwendbs.com/wcbdcsign/

Lottridge D. (2008). Emotional Response as a Measure of Human Performance. In
proceedings of Computer Human Interaction. Florence, Italy

McClurg-Genevese, D. J. (2005). Principles and elements of design. Digital Web
Magazine. Available at http://wwwdigital-
web.com/articles/principles_and_elements_of_design/

 

Nakarada-Kordic, I. and Lobb, B. (2005). Effect of Perceived Attractiveness of Web
Interface Design on Visual Search of Web Sites. In Proceedings of CHI, New
Zealand.

Ngo, D.C.L., L.S. Teo, and Byne. J .D. (2000). A mathematical theory of interface
aesthetics. Visual Mathematics 2(No. 4). Retrieved on February 1, 2007, ﬁom
http://www.mi.sanu.ac.yu/vismath/ngo/index.html.

Ngo, D.C.L. (2001). Measuring the aesthetic elements of screen designs. Elsevier

62

Science.

Nielsen, J. (1993). Usability Engineering. Academic Press/AP Professional, Cambridge,
MA ISBN 0-12-518406-9.

Norman, D. A. (1998). The Invisible Computer: Why Good Products Can Fail, the
Personal Computer Is So Complex, and Information Appliances Are the Solution,
MIT Press, Cambridge, MA.

Norman, DA. (2002) Emotion and Design: Attractive Things Work Better. Interactions,
July - August.

Norman, DA. (2005). Emotional Design. Basic Books, p.114. ISBN 0465051367.

Ortony, A, Norman, D.A. & Revelle, W. (2005). Affect and proto-affect in effective
functioning in J .M. Fellous & M.A. Arbib, Who needs emotions: The brain
meets the machine. Oxford University Press.

 

Palmer, SE. (1999). Vision Science: Photons to Phenomenology. Cambridge, MA: MIT
Press.

Papachristos. E., Tselios. N., Avouris. N. (2005). Inferring relations between color and
emotional dimensions of a Web site using Bayesian Networks. Proceedings of
Interact 2005.

Petersen. M., Iversen. O., Krogh., P., Ludvigsen. M. (2004). Aesthetic Interaction — A
Pragmatist’s Aesthetics of Interactive Systems. In proceedings of 2004
Conference on Designing Interactive Systems: processes, methods and
techniques. Cambridge, MA, USA

Payne, J. W., Bettman, J. R., Johnson, E. (1993). The Adaptive Decision Maker.
Cambridge University Press, Cambridge, UK.

Pham, M. T., Cohen, J. B., Pracejus, J. W., Hughes, G. D. (2001). Affect Monitoring and
the Primacy of Feelings in Judgment. Journal of Consumer Research, 28, 167-
188.

63

Rubin, J. (1994). Handbook of usability testing. John Wiley and Sons, New York, NY,
ISBN 0-471-59403-2.

Sautter, P., Hyma, M. R., Lukosius, V. (2004) E-Tail Atrnospherics: A critique of the
literature and Model Extension. Journal of Electronic Commerce Research 5, 14-
24

Saw J. T. (2001). Mini Lesson: Aligment.Ret1ieved on February 1, 2007, from
http://daphnc.palomar.edu/dcsign/glignhtml

Schenkman, B. N. and Jonsson. F. U. (2000) Aesthetics and preferences of web pages.
Behavior and Information Technology, 19(5), 367-377.

Schmidt, K., Bauerly, M., Liu, Y., Sridharan, S. (2003). Web Page Aesthetics and
performance: a survey and an experimental study. In proceedings of the 8th
Annual International Conference on Industrial Engineering — Theory,
Applications and Practice, Las Vegas, Nevada, USA, November 10-12.

Shusterman, R. (1992). Pragmatist Aesthetics. Living Beauty, Rethinking Art. Blackwell.

Skaalid, B. (1999). Gestalt Principles of Perception. Retrieved on February 1, 2007, from
http://www.usask. ca/ education/ coursework/ skaa‘l id/ th eory/ gestalt] gestalt. 111m

 

Slater, H. (2006). Aesthetics. The Internet Encyclopedia of Web. Retrieved on February
1, 2007, from http://www.iep.utm.cdu/a/acsthcti.htm

 

Sutcliffe, A. (2002). Assessing the Reliability of Heuristic Evaluation for Website
Attractiveness and Usability. In Hawaii International Conference on System
Sciences.

Tarasewich, P., Daniel, H.Z. and Grifﬁn, HE. (2001). Aesthetics and Web Site Design.
Quarterly Journal of Electronic Commerce, 2(1), 67-81.

64

 

 

l?“

Thorlacius, L. (2004). Aesthetics and function in web design. CADE 2004 Web
Proceedings of Computers in Art and Design.

Tittel, E., Price, 8., Stewart, J. (1997) Web Graphics. Wiley Computer Publishing.
ISBN 0-471-15692-2

Tractinsky, N. (2004). Toward the study of aesthetics in information technology.
Proceedings of the 25th International Conference on Information Systems.

Tractinsky, N. (1997). Aesthetics and Apparent Usability : Empirically Assessing
Cultural and Methodogical Issues. In Proceedings of CHI, Atlanta, GA, USA.

Usability Association Professionals (2008). What is Usability. Retrieved on May 25,
from http://www.upassoc.org/usability_resources/about_usability/index.htrnl

Veen, J. (2000). The Art & Science of Web Design. New Riders ISBN: 0789723700

Vega-Riveros, J. F. and H. J. Santos Villalobos (2006). Graphic design principles for
automated document segmentation and understanding. SPIE Electronic Imaging
2006 El 2006 — Document Recognition and Retrieval XIII, San Jose, California.

White, A. (2002). The Elements of Graphic Design. Allworth Press. ISBN 1-58115-250-7
Williams, R. (2004). The non-designers design book. Peachpit Press, USA

Wroblewski, L. (2002). Site-Seeing: A Visual Approach to Web Usability. Wiley, ISBN-
13: 978-0764536748

Zettl, H., (1999). Sight, Sound, Motion: Applied Media Aesthetics. Wadsworth
Publishing Company, USA.

65

IIIIIIIIIIIIIIIIIIIIIIIIIIIIII

lllllllllllIll‘llllllIlllllllllllllllll‘llllllll