MW Ctac 495l Asl Project Research Report

Running head: SUCCESSFUL WEBSITE CHARACTERISTICS 1
Successful Website Characteristics Pertinent to

Eastern Michigan University’s Equality Research Center Website
Meagan Winkelseth
Eastern Michigan University
Author Note
Meagan Winkelseth, Undergraduate Senior, Department of Communication, Media, & Theatre
Arts, Eastern Michigan University.
This research report is a product of the CTAC 495L Communication Capstone Academic Service
Learning (ASL) Project (2017).
Contact Information: mwinkels@emich.edu (email)
SUCCESSFUL WEBSITE CHARACTERISTICS 2
Table of Contents
Title Page (1)
Table of Contents (2)
Brief Description of the Equality Research Center (3)
Introduction (3)

Eastern Michigan University’s Equality Research Center Website (5)
Structure (5)
Content (11)
Appearance (17)
Usability (22)
Suggested Revisions that Could Be Made to the Equality Research

Center Website (26)
Closing Statement (35)
Notes (36)
References (37)
Brief Description of the Equality Research Center
The Equality Research Center (ERC) at Eastern Michigan University (EMU) was established by
the Department of Communication, Media & Theatre Arts in 2010 thanks to EMU alumnus and
former regent Dr. Timothy Dyer and the John and Genevieve Dyer Education Foundation. The
ERC’s mission is to advance Lesbian, Gay, Bisexual, and Transgender (LGBT) equality by
honoring its renewed commitment to fostering and disseminating EMU faculty and student
research centered on LGBT human rights (specifically focusing on the areas of LGBT youth,
civil rights, and wellness). As a wealth of information for public policy and education for public
audiences, the ERC raises awareness of, expands knowledge on, and sparks conversation about
LGBT social justice issues in everyday civil life. Linking academic research and resources to
community action, civic procedures, and curricular novelty, the ERC specifically serves policy
makers, advocates, educators, professionals, practitioners, service providers, and as many
communities as possible by providing them with relevant LGBT information (Equality Research
Center, 2017)
Introduction
“Your website is your greatest asset. More people view your webpages than anything else.”
-Amanda Sibley, Director of Acquisition at Namely (Kolodynska, 2016)
This quote by Ms. Sibley is especially true for the ERC, as it constantly strives to bolster “broad,
online public access to information, research and resources” via its website in order “to help
people become more engaged in creating inclusive communities” (Equality Research Center,
2017). In other words, the ERC’s website is the hub for information about the center’s upcoming
events (such as lectures, forums, seminars, workshops, and conferences), current happenings
(such as research and project updates, awards, funding, etc.), and past and present research
reports, reviews, projects, programming, and fact sheets. The ERC’s website is where people go
to learn about the ERC and what it has to offer, making it “the first and only impression
potential” (Spritz Web Solutions, 2012) supporters will receive of the center (i.e. people evaluate
the ERC and its “brand based almost entirely on what they can see on the internet” (Polaczyk,
2016)). Therefore, the ERC’s website must essentially be the ERC’s “business card;” not only
should it provide people with basic contacts and information, but it should also efficiently
“convey the spirit of the ERC’s culture” (Schnotz, 2017) and personality in a way that’s credible,
professional, and engaging (Kokemuller, 2017).
This means that it’s crucial for the ERC’s website to effectively reverberate what said potential
supporters should know and remember about the ERC (Strickler, 2016)—it’s a nonprofit
organization devoted to combating heterosexism, homophobia, and all discrimination based on
Sexual Orientation and Gender Identity (Equality Research Center, 2017) by engendering
research and producing subsequent “educated enlightenment” (as “education and knowledge are
key to a safer, more open world” (EMU Foundation, 2017)) within the public sphere; by creating
a platform from which LGBT people’s voices, stories, and experiences are accurately and
thoughtfully represented; and by recognizing the current societal zeitgeist as one that persists, in
many ways (despite improvements), to consider LGBT people as second-class citizens, but still
having the courage to envision the cultivation of a society (and world) in which LGBT people
can openly partake in all aspects of their communities’ social living without the hindrances of
inequality (Equality Research Center, 2017).
Here, we can see that the ERC’s website serves a dual purpose as it’s not only a “powerful
presentation” (Strickler, 2107) or digitized reflection of the ERC and what it does, but also of
LGBT people, their communities, and the lives they lead. It’s for this reason, that the ERC’s
website must establish an enduring “online presence” (M5 Design Studio, 2017) that will
resonate with public audiences. Specifically, it’s important for the ERC’s website to appeal to
audiences who have “personal relevance” with the ERC’s work (e.g. people who identify as
LGBT, advocates of LGBT rights, etc.; these people are more likely to “carefully scrutinize the
ideas” and information (logical appeals) the ERC presents, judging their merits and implications
with much “cognitive effort” in order to “seek truth”), as well as those who don’t and who may
have unfavorable “predetermined conclusions” about LGBT people and the importance of
securing equality for LGBT communities, which will affect how they perceive the ERC and its
work (e.g. people who are against LGBT civil rights due to certain heteronormative values and
beliefs, people who have little knowledge on LGBT issues and thus maintain irrational fears,
people who are in a position to assist in the advancement of LGBT causes—such as educators
and service providers—but are skeptical due to prejudices, etc.; these people are likely to view
the ERC’s website from an antagonistically biased standpoint, causing their elaboration of the
ERC’s ideas and information to be skewed and possibly directing them to focus on the site’s
credibility and appearance over all other aspects) (Griffin, Ledbetter, & Sparks, 2015).
Consequently, the ERC’s website must construct a well-designed, organized interface with
succinct, persuasive content and attractive graphics that will ultimately cause public audiences to
adopt favorable positions on the ERC and LGBT civil rights that can “persist over time, resist
counterpersuasion, and predict progressive future behavior” (Griffin, Ledbetter, & Sparks, 2015)
geared toward advancing LGBT equality. Audiences who have personal relevance with the ERC
are more likely to adopt these positions than those who don’t and who may have unfavorable
predetermined conclusions about LGBT people and the importance of securing equality for
LGBT communities due to their unwillingness to objectively examine the ERC’s ideas and
information.
However, the latter can be disillusioned (momentarily, at the very least) from said conclusions
and tap into more sympathetic frames of mind from which to judge the ERC if the site portends
an upstanding character, an aesthetically pleasing guise, and/or provides emotional (pathos)

appeals (e.g. promoting and discussing research and other projects that address the seemingly
immovable, situational determinism of LGBT youth bullying, LGBT workplace discrimination,
LGBT elder abuse, etc.), via graphics or short bits of powerful content, that humanize LGBT
people’s experiences in ways that they can identify with and “that inspire reasoned, [unbiased]
decision making” about supporting LGBT civil rights through the juxtaposition of the following
emotions: “love or friendship versus hatred” for LGBT people (i.e. feelings of solidarity with
LGBT people due to similarities in experiences, versus feelings of extreme aversion towards
LGBT people due to their unconventional identities) and “indignation versus pity” (i.e.
recognizing that discrimination against LGBT people is culturally, socially, and politically unjust
and thus making lasting alterations to one’s values, beliefs, and attitudes in ways that consider
LGBT people as equal, versus feeling sorry for LGBT people and possibly extending some sort
of help but only on a superficial level without immediate, lasting alterations to one’s values,
beliefs, and attitudes—“compliance without inner conviction”) (Griffin, Ledbetter, & Sparks,
2015).
Such acts of persuasion would hopefully cause said audiences (particularly those who are in a
position to assist in the advancement of LGBT causes but are skeptical due to prejudices) to
experience cognitive dissonance (or inconsistency between their state and vocational obligations,
cultural assumptions, and personal ethicality as they pertain to seeing LGBT civil rights as basic
human rights) and a successive sense of guilt and personal responsibility that could be redeemed
through supporting the ERC (i.e. making donations, employing research on LGBT issues in
practical ways, utilizing ERC workshops, attending ERC events and sharing what was learned,
etc.) (Griffin, Ledbetter, & Sparks, 2015). To begin to achieve such a website, I first had to
determine which successful website characteristics would be pertinent to the ERC’s site and its
purpose.

Eastern Michigan University’s Equality Research Center Website
After conducting extensive secondary research, I concluded that there are four successful website
characteristics pertinent to the ERC’s website: Structure, Content, Appearance, and Usability. In
the following, I will address these four characteristics by providing a brief description of each
along with a bulleted list of their concepts that are most applicable to the ERC’s website.
I. Structure: A successful website is organized and founded on a structure that caters to the
how visitors view interfaces (M5 Design Studio, 2017). Specifically, generating a solid
website structure involves the construction of an overall “design with good visual
hierarchy” that allows visitors to follow the content effortlessly and receive the most
prominent information first (Babich, 2017).
a. According to various scientific eye-tracking studies, specifically those conducted

by the Nielson Norman Group which specializes in Evidence-Based User
Experience Research, Training, and Consulting, internet users scan and/or read
website content and web pages in either a Z- or F-Shaped Pattern. Regardless of if
users follow a Z- or F-Shaped Pattern, their eyes are drawn to the “top, upper left
corner and left sides of their screens the most” (they will “only occasionally take
glances towards the right side of the screen”), which means that “the most
important elements of your site” (e.g. your organizations logo, your website’s
navigation menu, essential content and/or messages, etc.) should not only be
placed at the top but also “on the left side of your design” so that visitors will see
them (Jones, 2012). Knowing all of this gives you, the website designer, “a lot of
control over where” visitors look upon accessing your website (Babich, 2017) and
it allows you to set your overall website design up for success as you’ve built its
structure around the natural behaviors and needs of your site’s audiences (i.e. it
gives you an advantage) (M5 Design Studio, 2017)—as the creator of your
website you are essentially the puppeteer in charge of guiding and leading internet
users, or your puppets, through your website (emphasizing the most important
parts) which means that you must strategically manipulate your design in ways
that will generated desired effects. In the following, I will address both the Z- and
F-Shaped Patterns.
i. The Z-Shaped Pattern “traces the route” visitors’ “eyes travel when they
scan the page—left to right, top to bottom,” then left to right again.
Specifically, visitors first “scan from the top left” (or Point #1) “to the top
right” (or Point #2), “forming a horizontal line;” next, they scan “down
and to the left side of the page” (or Point #3), “creating a diagonal line;”
and lastly, they scan “back across to the right” (or Point #4), “forming a
second horizontal line” which ultimately creates “an imaginary “Z” shape”
(Babich, 2017). See Figure 1 and Figure 2 to get an idea of what the Z-
Shaped Pattern is and what it looks like when applied as the structure of a
web page.
1. You should place information in order of importance all along the

Figure 1. The Z-Shaped Pattern Skeletal
scanning path from Point #1 to Point #4 (like that of the inverted
Structure (top image: bare Z-Shaped
Pattern skeletal structure; bottom image: pyramid writing style discussed in the Content Section of this
bare Z-Shaped Pattern with the addition of report), beginning with essential, primary information you want
potential elements at each point. visitors to see and followed by helpful details or secondary
information that all build up to the finishing “call-to-action” (e.g.
making a donation, moving to a specific section of your website,
filling out a form, participating in a project, etc.) (Jones, 2010)—

It’s all about introducing visitors to “the right information at the
right time” (Babich, 2017).
2. The Z-Shaped Pattern works because it’s intuitive; most visitors

(who are likely “Western readers”) that see the portion of your
Figure 2. The Z-Shaped Pattern website’s content that’s structured in the Z-Shaped Pattern will
Skeletal Structure imposed on a
web page. “scan it the same way that they would scan a book - top to bottom,
left to right.” Therefore, the likelihood of visitors answering your
call-to-action or “doing what you want them to do” is increased
because you’re catering to their subconscious behaviors, making
the scanning and/or reading of your design’s content simple and
easy which they view favorably (Jones, 2010).
3. The Z-Shaped Pattern should be employed on your website’s

“minimalist” web pages that “aren’t centered on” an ample amount
of “text,” but rather on “a few key elements.” Before executing
your Z-Shaped Pattern on said pages, you should consider
answering the following questions to make sure you’re getting the
most out of this structure: “When visitors land on your web page
that adheres to the Z-Shaped Pattern, “what information do you
want them to” receive? “In what order do you want them to see the
information?” “What do you want them to do” as a result of seeing
the information you presented or what should they do next? While
pondering these questions, you should think about forging a flow
via the “combination of visual weight and visual direction” (visual
weight is “a measure of the force that an element exerts to attract the
eye;” “the more an element attracts the eye, the greater its visual
weight” (visual weight is about adding effects to certain elements of
your website design that you deem important and thus want to draw
visitors’ attention to) and visual direction is “the perceived direction
of visual forces” that you should think of as “the direction you would
expect an element to move if it were in motion” (visual direction is
about getting visitors to look toward certain elements of your website
design) (Bradley, 2014)—it would be wise to consider referring to
Steven Bradley’s article Design Principles: Visual Weight And
Direction to gain additional insight about how to use visual weight
and direction to improve your website design and reap the desired
effects of their application, but this could be done after your website’s
design has been established since they are secondary characteristics
that can easily be arranged). This means that throughout the Z-
Shaped Pattern on your web page, you want to give some elements
of your chosen information more visual importance than others by
making them bold, bright, colorful, of a different typographic form
or font, larger, etc. so that you can “get visitors’ attention and
guide them along” the imposed direction of the Z-Shaped Pattern.
General guidelines to create flow include placing a noticeable (i.e.
larger size which gives it more visual weight) version of your
organization’s logo at Point #1 because “it’s the starting point of
visitors’ journey;” placing the most important information along
the first horizontal line at the top of the “Z” and a “secondary call-
to-action” at Point #2 that asks visitors doing something useful to
the website, like following a certain link (this should have fairly
significant visual weight most likely in color or boldness); placing
stirring content that excites visitors’ minds and simultaneously
“urges their sight downward” to the second horizontal line at the
bottom of the “Z”—this content serves to divide the top and
bottom of the “Z,” thus “guiding visitors along the Z-Shaped
Pattern;” placing helpful details or secondary information (that
have a light visual weight) at Point #3 and along the horizontal line
between it and Point #4 that will lead visitors to the “call-to-
action” and convince them to answer it; and placing your “primary
call-to-action” at Point #4 with much visual weight in size, color,
brightness, etc. (Babich, 2017).
ii. The F-Shaped Pattern is the most common eye-scanning or dominant

reading pattern for viewing website content according to the Nielson
Norman Group’s “eye-tracking study,” which “recorded how 232 users
looked at thousands of web pages” and successively discovered that the F-
Shaped Pattern was the “main reading behavior” users consistently
followed while looking at “many different sites.” Generally speaking, the
F-Shaped Pattern consists of “two horizontal lines followed by a vertical
stripe.” More specifically, visitors to a website first scan “in a horizontal
movement…across the upper part of the content area” from the top left (or
Figure 3. F-Shaped Pattern Skeletal Point #1) to the top right (or Point #2), forming “the F’s top bar;” next,
Structure. they scan down a bit to a spot on the left side of the page (or Point #3) and
“read across in a second horizontal movement that typically covers a
shorter area than that of the” first horizontal movement to a spot on the
right side of the page (or Point #4), forming “the F’s lower bar;” and
lastly, they scan (either in a “slow and systematic” or faster manner) “the
content’s left side in a vertical movement” to a spot down toward the
bottom of a web page, forming the “F’s stem” (Nielson, 2006). See Figure
3 above and Figure 4 below get an idea of what the F-Shaped Pattern is
and what it looks like when applied as the structure of a web page.
1. It’s important to keep in mind that internet users’ F-shaped eye-

scanning patterns ‘aren’t always comprised of exactly the three”
aforementioned parts (i.e. they “are a “rough, general shape rather
than a uniform, pixel-perfect behavior”). Sometimes, internet users
will “read across a third part of the content” which makes the
pattern appear like an “E” more than a “F” or “only reading across
once” which makes the pattern appear more like in “inverted L
with the crossbar at the top” than an “F.” Figure 5 below displays
Figure 4. F-Shaped Pattern Heatmaps “from user eye-tracking studies of four websites” that
Skeletal Structure imposed on a reveal where users looked most while viewing web content. The
web page.
red areas are “where users looked the most,” the yellow areas
“indicate fewer user views,” the bluish areas show the “least user
views,” and the gray areas show where users didn’t look and/or
pay any attention to. Here, if you “focus on the red (most viewed)
areas,” each of the four heatmaps have “the expected F-Shaped
Pattern” (Nielson, 2006).
2. The F-Shaped Pattern, like the Z-Shaped Pattern, is intuitive

because most visitors (who are likely “Western readers”) that see
the portion of your website’s content that’s structured in the F-
Shaped Pattern will “scan it the same way that they would scan a
book - top to bottom, left to right” (Jones 2010). Also, the F-
Shaped Pattern should be employed on web pages that are “text-
heavy” because “users will respond better to a layout that’s been”
structures according to their natural scanning behaviors. As
mentioned previously within the Z-Shaped Pattern content (please
refer to the information above this portion covering the different
Figure 5. Heatmaps from user eye-tracking
studies that show “the abstract F-Shaped ideas of the Z-Shaped Pattern, specifically parts 1 and 3 because it
Pattern that internet users generally gravitate applies to the F-shaped Pattern as well and can be adjusted to
towards” in their scanning behaviors (Jones, accommodate the F-Shaped Pattern’s proneness to text-heavy
2012).
content), you want to “prioritize the most and least important” bits
of information in order all along the F-Shaped Pattern’s “hot spots”
(using visual weight and direction via the creation of a flow to
emphasize certain elements you want visitors to see more than
others), so that visitors see and interact with them in ways that
create desired effects (Babich, 2017).
3. Within the F-Shaped Pattern, you want to make sure that “the first
two paragraphs,” in particular, “state the most important
information” that you want your website visitors to know because,
according to the Heatmaps in Figure 5 above, it is an area that they
will pay attention to the most (Nielson, 2006).
4. You should “start subheads, paragraphs and bullet points with

information-carrying words” so that visitors will give them
attention” when scanning “down the left side of your content in the
final stem of their F-behavior.” It would also (if applicable) serve
you well to employ images (they receive more attention than text)
that supplement the text and encourage visitors to scan and/or read
it, or to use typographic tricks (e.g. placing words and/or phrases in
bold, highlighting certain elements, using color, capitalizing entire
words that carry meaning, etc.) that make visitors notice specific
elements of your content (both of these ideas will also keep your F-
Shaped Pattern from becoming boring and subsequently unable to
make an impact on your website’s visitors) (Nielson, 2006)—keep
in mind that “images and headlines are only reliable if they’re
engaging” (Jones, 2012).
5. It’s important to know that the F-Shaped Pattern has a

“predisposition to monotony,” as it’s “easy to bore your visitors
with repetitive and similar content in rows.” To combat this and
keep your visitors from “dulling everything out,” add an “awkward
element within the scanning area to keep visitors engaged” and
interested. Said method of “breaking the expectations of the
layout” comes in handy when your content takes the form of “long
vertical spans” and becomes hackneyed after scanning and
scrolling past the “first couple headlines.” Employing an awkward
element, such as an image or quote, will “keep visitors moving
around your website” with a desire to learn and scan more—
“breaking the rhythm of a design by limiting repetitious elements
is a crucial technique that you’ll want to design into your site to
bring your work to the next level” (Jones, 2012).
6. Incorporate a sidebar or sub-navigation within your F-Shaped

Pattern “as a tool for visitors to find specific content” that you
want them to see but doesn’t “fit in organically with the primary
content” (e.g. links to different pages, articles, projects, “social
media widgets,” etc.) (Babich, 2017). The purpose of a sidebar is

to “drive visitor engagement” and get them “involved on a deeper
level,” so place it on the left side of your main content and
“leverage the fact that visitors will gravitate towards” it because of
its positioning along “the stem of the F”—a spot that visitors’ eyes
track to naturally (Jones, 2012).
a. Sidebars are used for “secondary content purposes,”

specifically to draw attention to “sections of your website
that need to gain more attention” in order to achieve your
organization’s goals (Knight, 2011).
b. The Z- and F-Shaped Patterns inherently give your website visual hierarchy and
the elements of size, color, emphasis via bolding and highlighting, etc. However,
it would be wise to consider referring to Branden Jones’s article Understanding
Visual Hierarchy in Web Design, Jerry Cao’s article The 5 pillars of visual
hierarchy in web design, and Francisco Inchauste’s article Designing for the Mind
to gain additional insight about how to use visual hierarchy to improve your website
design and reap the desired effects of its application.
II. Content: A successful website helps visitors accomplish their chief objective of “finding
useful information as quickly as possible” by providing them with succinct and relevant
content (i.e. a website’s content should drive visitors to take action and be constructed
with internet user’s needs and goals—as they pertain to the site’s particular field of
information—in mind (M5 Design Studio, 2017)). For virtually all website users,
“content is king” (or “the most important trait of a great website” (webreference, 2017))
and should be presented in a manner that capitalizes on the three pillars (or principles) of
compelling content: “concise, scannable, and objective” (Nielson & Morkes, 1997).
a. The three pillars (or principles) of compelling content:
i. Your website’s content should be concise, meaning it should be “short and

to the point” as visitors don’t have the time to read text that’s extensive,
plus it can be difficult in visitors’ eyes to “read a lot of text on computer
screens” or other digital devices (Nielson & Morkes, 1997).
1. Divide your content into terse paragraphs so that visitors are more
likely to scan and/or read the information you present (i.e. visitor’s
desire to scan the content will be greater if the text is divided into
smaller bits; long bits of information are often “boring and
intimidating’ to website visitors)— “you’ve got less than 10
seconds to hook your visitors” and make a good first impression

(approximately two seconds to be more exact), “so grab their
attention by being clear, concise, compelling,” and by giving them
the information they are looking for quickly (depending on the
topics and/or ideas of the content, this can be accomplished
through summarizations (Spritz Web Solutions, 2012). Visitors of
your website are likely to be under both “emotional and time
constraints,” which means that swiftly providing them with the
information they need, will effortlessly make them like your site
(Nielson & Morkes, 1997). The goal is to display “short and
simple bursts of information that can easily be digested” by your
website’s visitors because they communicate main points better
(Strickler, 2016).
ii. Your website’s content should be scannable. Internet users “do NOT read
while on the web” they “scan the pages” and “try to pick out a few
sentences or even parts of sentences to get the information they want” (i.e.
when it comes to internet users scouring websites for information,
“scanning is the norm” because it “can save” visitors “time”). Visitors will
only read text when it captures their attention and interests (Nielson &
Morkes, 1997).
1. Consider applying the “one idea per paragraph rule” or “limit each
paragraph” of information to one main idea because internet users
that visit your site are likely to read only “the first sentence of each
paragraph” while scanning the content. Therefore, it would be wise
to create topic sentences that clearly express the paragraphs’
content and touch on their main idea (Nielson & Morkes, 1997).
2. Consider applying the “inverted pyramid writing style” (Nielson &

Morkes, 1997), also known as front loading your content, which is
an analogy suggesting that you should place your website’s content
in “descending order of importance”—organizing the content in
such a way that makes the most essential “information easy to
find” in a timely fashion. It involves putting the most important
information that visitors to your site must know first (i.e. the who,
what, when where, why, and how of your website and
organization; for example, a description of the organization,
mission statement, work, goals, purpose, summaries of important
Figure 6. The Inverted Pyramid information that express the main points quickly and allow visitors
for Web Writing.
to decide whether or not to keep reading and/or scanning further

down for more details, etc.), putting additional information that
could assist in comprehension but isn’t crucial for them to know
second (i.e. providing visitors with background information,
details, etc.), and putting information that doesn’t carry much
importance but would be nice to have last. Using this style means
that even is a visitor only reads or scans half of a page on your
website, they still will have “consumed your key messages.” As
was discussed in the Structure section, internet users look at the top
left corner of a web page then follow the F- or Z-pattern layout
while viewing the subsequent content; applying the inverted
pyramid writing style ensures that said visitors will see the
messages, ideas, etc. you want to communicate to them (see
Figure 6 above for a visual representation of the inverted pyramid
writing style) (Richards, 2015).
3. Present or write your content in ways that encourage scanning by

applying “headings, large type, bold text, highlighted text, bulleted
lists, graphics, captions, topic sentences, and tables of contents.”
The use of these elements interrupts the flow of the content in an
effective manner that gives visitors a more satisfactory experience,
keeps them sharp (and thus likely to remember the information
and/or content being given to them), and maintains their interests
(Nielson & Morkes, 1997).
a. Making your headings, in particular, dominant and clear is

crucial in determining whether or not visitors will go on to
scan and/or read your website’s content. This is because
visitors “don’t view entire headlines,” they instead see if
“the first few words engage them” or not and then act from
there. This means that the initial words in your headings
“need to be real attention grabbers if you want to draw and
keep viewers’ attention.” It would also serve your website
well if you make introductory paragraphs (which often
present the most important information) “visibly bigger”
with boldface font or larger font size because it will capture
your visitors’ attention and encourage them to scan your
content further (Laja, 2017).
iii. Your website’s content should be objective, meaning it should be

displayed “without exaggeration, subjective claims, boasting,” and fluffy
or “overly hyped” language (internet users don’t like that). Instead, your
content should present information in direct language that’s simple and
easy to grasp—you should “use words and categories of information that

make sense to” your audiences (Nielson & Morkes, 1997).
1. Internet users connect better when a website’s language is informal

(to a certain degree; a balance should be achieved between casual
conversation and decorous discourse) or “more down-to-earth so
that…anybody could read it and understand.” Writing that’s formal
often requires visitors “to read every word” which impedes their
ability to survey the content as quickly as they would like.
However, informal writing allows visitors to read and/or scan
content with greater speed, thus expediting their progress toward
accomplishing their chief objective of “finding useful information
as quickly as possible” (Nielson & Morkes, 1997).
b. A good way to apply the three pillars (or principles) of compelling content (and
their various components) to better organize, prioritize, and exhibit your
information is by (of course) making it concise, scannable and objective, and then
dividing it into separate web pages within your website via links. Doing this
would “move less important material from primary pages to secondary pages,”
making the more essential pages shorter and thus more alluring and less
intimidating for visitors to view (Nielson & Morkes, 1997).
c. Where and when appropriate (on a regular basis—weekly, bi-weekly, monthly,

etc.), refurbish your content because visitors get tired of repeatedly viewing the
same information, especially if it’s no longer relevant to current events. Keep in
mind that certain information should stay the same because its consistency creates
trust and/or reliability with visitors and is required in order to clearly
communicate what they should know about an organization. For example, an
organization’s mission statement, goals, description of overall work, etc. will
likely stay the same. Otherwise “static content will not bring visitors back to your
site!” (Spritz Web Solutions, 2012).
i. A few things you can do to freshen your website and simultaneously keep
and/or invite visitors’ involvement include creating a blog about
significant topics; a monthly (or otherwise) newsletter about upcoming
events and current issues; or a page and/or area of content devoted to
providing visitors your organization’s current news, fun facts, bits of
information, relevant things that you learn and that visitors should know,
etc. (Snell, 2015).
d. The content of your website should be presented in a “variety of formats” (e.g.

useful and important information exhibited via videos, images, infographics,
interactive or motion graphics, etc.) in order to keep your visitors interested and
involved (Strickler, 2016).
e. The content of your website should not only provide the information visitors are
seeking, but also serve to demonstrate your organization’s credibility as an
educated resource. Your organization’s website should display its expertise in the
field in which it’s established; this will in turn cause visitors to view your website
and its’ content as valuable (it’s good to keep in mind that your content is the
agent through which your website’s “tone and impression is carried;” if
constructed with care, your content can do wonders for your site’s overall image
as a credible source (Nielson & Morkes, 1997)) and portray your organization’s
personality in ways that visitors can connect with, relate to, and thus form a bond
with (Snell, 2015). One way to achieve this is by making sure that all pages of
your website has “a clear purpose” and “fulfills a specific need for” visitors
(Woods, 2014). Another way to achieve this is by making sure that a good portion
of your website’s content is original, meaning that you are providing visitors with
information, articles, ideas, projects, etc. that are unique to your site and
organization, rather than just listing links to or citing information from other
sources (webreference, 2017).
i. When it comes to conveying your organization’s personality in your

website design, you should do certain things that give off a strong sense of
authenticity and/or the feeling that there are real people behind the content
on your website. For example, you can provide a page that introduces your
organizations team which would present the opportunity to build trust and
a connection with visitors, prove your likability, entertain visitors, and so
on (Idler, 2012). Another way to approach the task of conveying your
organization’s personality is by imaging your website as a platform from
which you “construct and perform” particular personae. Using your design
and content, you “speak through” said personae to augment your
organization’s character (i.e. credibility, “virtue,” “goodwill,” and
validity) and persuade your visitors to view your site and organization
favorably, as well as become a supporter of your organization’s work. The
persona you perform depends on the audience you’re speaking to (or
addressing) or the present situation you’re in (i.e. you would present
content that’s more focused on figures and practical solutions through a
professional persona (delivered in the form of a polished report with
images of relevant data, graphs, etc.) to a service provider and content
that’s more focused on creativity and ideas through a theatrical persona
(delivered in the form of a brightly colored infographic that tells a story

and works to create a connection with its audience through conversational
language and emotionally charged images) to educators looking for new
ways to address certain topics) (Palczewski, Ice, & Fritch, 2012).
ii. It’s important to mention that the act of incorporating your organization’s
personality within your website design is something that would be most
effective to do after the design has been firmly established through
employing the other components of Structure, Content, Appearance, and
Usability (which is why I haven’t gone into great detail about it here).
Nonetheless, I’ve mentioned it here because I believe it’s an element that’s
extremely important to a website’s success and should therefore be
included in its design at some point. With that being said, it would be wise
to consider referring to the following articles about the intricacies of
personality to gain additional insight about how to present it in your content
to improve your website design and reap the desired effects of their
application (I also included articles pertaining to creating emotion in your
website design because it plays a significant role in website design
personality):
1. Sabina Idler’s How to Add a Personal Touch to Your Web Design.
2. Aaron Walter’s article Personality in Design.
3. Aaron Walter’s article Redesigning with Personality.
4. Sabina Idler’s article Not Just Pretty: Building Emotion into Your
Websites.
5. Aaron Walter’s Emotional Interface Design: The Gateway to
Passionate Users.
6. Shell Greenier’s article Optimizing Emotional Engagement in Web

Design Through Metrics.
7. Trevor van Gorp’s articles Design for Emotion and Flow and
Emotional Design with A.C.T.- Part 1.
f. Be sure to repeatedly use keywords in your website’s content as it’s “crucial for
getting high search engine rankings” and subsequently increasing the number of
internet users who visit your site because most people rely on and/or trust search
engines (and their rankings of most to least relevant sources) to guide them to the
information they’re seeking—producing “high quality content can have huge

payoffs through increased search engine rankings” (Snell, 2015).
III. Appearance: A successful website is a “visually appealing, polished, and professional”

reproduction of your organization in digital form. It captivates visitors’ minds through the
balanced use of color, meaningful graphics, and so on. In order for a website to produce a
propitious effect and maintain visitors’ attention and presence upon accessing the site, it
must be attractive and inviting (Spritz Web Solutions, 2012). The appearance of a
website is essentially the culmination of the time and effort spent building the various
components of its structure, content, and usability; it’s the finished design that visitors
see. Therefore, it’s important that a website’s appearance be topnotch so that visitors
develop positive perceptions of it and its organization as a whole— “the perception
[people] get from looking at” a website’s “design is [basically] what [it’s] communicating
to them” (Bradley, 2010). This means that an organization must ensure that the
message(s) it wishes to share with people via its website are not only expressed in words
but also in the overall design of its site.
a. Utilize colors (primary, secondary, and/or intermediate) and/or color schemes (i.e.
complementary, analogous, monochromatic, and/or triad) to “create a desired
mood and/or tone for your” organization. The use of color plays a significant role
in extracting raw human emotions and, when paired with compelling graphics and
cogent content, can be manipulated to persuade visitors into viewing your website
and its content favorably. Be careful not to overindulge in the use of color as it
shouldn’t distract visitors from primary aspects of your website (Spritz Web
Figure 7. The Color Wheel. Solutions, 2012). “Bold colors can have a powerful impact on” website users
(Strickler, 2016) (see Figure “Color wheel” to get familiar with primary,
secondary, and intermediate colors as well as color schemes). See Figure 7 to get
an idea of colors and color schemes that can be employed on a website.
b. You should more than consider incorporating enough images in your web design
because more often than not they speak louder than words. This is most likely due
to the fact that human brains can decode images immediately whereas decoding
language and/or text happens over a “linear and sequential” period of time
(Hawkyard, 2017). This is because images “possess the characteristic of
presence” or the ability to construct something, such as an event or people and
their actions and/or behaviors, directly “in front of” visitors’ “consciousness” (i.e.
images make that something present in time), thus providing said visitors with a
virtual experience by causing “them to feel…they were present to witness” an
event or people and their actions and/or behaviors as it was happening. Here we
see that because images give presence to the events or people they display, they
create a “particular reality,” understanding, and attitude toward society and/or the
world that the creator of said images wants visitors to adopt and devote their
attention to. This makes images a powerful tool of persuasion, as they can be
employed to manipulate your website’s visitors to think in a certain way and
develop certain beliefs (Palczewski, Ice, & Fritch, 2012). Specifically, the
“human brain can process images up to 60,000 times faster than words” which
means that you can communicate more information and messages with images
than with words. Also, images can make lasting impressions on our minds with
greater speed and accuracy than words can (Arnold, 2015) and they “facilitate the
learning process,” which confers visitors the power to choose what portions of
your website’s text they need to scan and/or read (Carlson, 2009).
i. Be strategic in your use of graphics—apply an appropriate number of

images (e.g. no more than three; they should be large enough for people to
understand them and should be clear, not fuzzy (Laja, 2017)) that “lend
visual variety” to a page of text and make sure that they “add meaning or
context to your written content.” When images capture and visually
contextualize the mission of an organization and the messages of its
website’s content, they “become a source of emotional information” that
helps communicate ideas and convince visitors that the website is worth
exploring (Robin, 2012). If you want your website to be visually
charming, then the images displayed should be high in caliber (Spritz Web
Solutions, 2012). This not only refers to the images’ appearance but also
their content. Visitors “prefer genuine, high quality photos,” meaning they
want to see images of “real people” (i.e. normal looking people not
models) because they are “real people who can relate to real images”
(Strickler, 2017). Also, it would be beneficial to position these images in
places where the real people are facing or looking toward your content,
specifically headings and other important bits of text. This relates to back
to the idea of visual direction because doing so would guide visitor’s gaze
toward the important content you want them to see—human beings
“automatically want to look” and/or face “where other human beings are
looking” and/or facing, so positioning these images in places where the
real people are facing or looking toward your content will subsequently
direct visitors to look and/or face your content (Morr, 2016). Additionally,
images that feature real people who are square to visitors are perceived as
more accessible and attractive (Laja, 2017). It’s important to remember
that graphics aid in communicating messages to visitors. If they add
nothing to the text that they are in proximity to, then they distract from the
content and keep messages from being received (Snell, 2015).
ii. It’s important to mention that the act of incorporating well-planned,

purposeful images within your website design is something that would be
most effective to do after the design has been firmly established through
employing the other components of Structure, Content, Appearance, and
Usability (which is why I haven’t gone into great detail about it here).
Nonetheless, I’ve mentioned it because I believe it’s an element that’s
extremely important to a website’s success and should therefore be
included in its design at some point. With that being said, it would be wise
to consider referring to the following articles about the power of visual
representations to gain additional insight about how to properly incorporate
well-planned, purposeful images in your content to improve your website
design and reap the desired effects of their application:
1. Gabe Arnold’s article 5 Reasons Why Images Speak Louder Than

Words.
2. Adrienne Carlson’s article Why Pictures Speak Louder than

Words.
3. Jen Hawkyard’s article Professional Imagery: Why it is Important

for Your Website.
4. Jessica Benton’s article Getting visual with content: Are images

more powerful than words?
5. Peter Temple’s article Why Visuals Are More Powerful Than

Words.
6. James Balm’s article The power of pictures. How we can use

images to promote and communicate science.
c. Be sure to create captions for your graphics (if applicable) and/or reference them
in your text (e.g. “see Figure 1. Caption and/or Reference your Graphics”), so that
visitors have no questions about what they’re seeing and so that they understand
how the content (i.e. graphics and text) works together as a whole (Nielson &
Morkes, 1997).
d. Graphics should be added to your website to “entertain and enlighten” visitors, as

well as enhance your content; short and informative videos, an animated banner,
and interactive pieces are great graphics to utilize because they will contribute to
your “site’s interest quotient” (Spritz Web Solutions, 2012). 360-degree videos of
venues relevant to an organization and its work are great for capturing visitors’
interests. These videos can be “viewed on any device;” are “controlled by their
creator;” and they give visitors an interactive experience within a fixed, visual
framework that they have some control over (i.e. they can explore the digital
space that has been delineated for them by the creator). 360-degree videos can
help you create “personalized and intuitive user experiences” that will help cause
visitors’ to view your website favorably (Strickler, 2017).
e. Another medium that can provide visitors with an engaging, interactive

experience is storytelling. People in general are “naturally greedy for stories”
because “they have a unique ability to seize and rivet our attention” by activating
different parts of our brains (Gottschall, 2013). In fact, if we relate in any way to a
story that’s being told, our “brains can become synchronized with the
storytellers’” and we can end up experiencing the storytellers’ emotions (i.e. we
can end up experiencing and/or seeing the world through the storytellers’ eyes) as
a result, which has the ability to cause us to think in different ways and persuade
us to alter our values, beliefs, and attitudes (Deutschendorf, 2014). Here, we see
that storytelling seemingly providers visitors with the ultimate interactive
experience as it cognitively and/or psychologically and/or emotionally places
them in the new, unique situations and/or worlds of particular others, thus
allowing them to explore different ideas, beliefs, attitudes, behaviors, etc. within
the storytellers’ structured tales. When it comes to website design, you can
incorporate stories throughout your content, in blog posts, newsletters, general
interface content, infographics, videos, images and other graphics, etc. It’s
important to keep in mind the great persuasive power that stories have—stories
“have a unique ability to infect minds with ideas and attitudes that spread
contagiously,” causing us to think in ways that agree with the values and beliefs
portrayed in them and quite possibly adopt them as our own (Gottschall, 2013).
i. It’s important to mention that the act of incorporating stories within your
website design is something that would be most effective to do after the
design has been firmly established through employing the other
components of Structure, Content, Appearance, and Usability (which is
why I haven’t gone into great detail about it here). Nonetheless, I’ve
mentioned it because I believe it’s an element that’s extremely important
to a website’s success and should therefore be included in its design at
some point. With that being said, it would be wise to consider referring to
the following articles about the intricacies of storytelling to gain additional
insight about how to harness the power of stories in your content to improve
your website design and reap the desired effects of their application:
1. Jonathan Gottschall’s article The Science of Storytelling: How

Narrative Cuts Through Distraction Like Nothing Else.
2. Harvey Deutchendorf’s article The Simple Science to Good

Storytelling.
3. Leo Widrich’s article The Science of Storytelling: Why Telling a

Story is the Most Powerful Way to Activate Our Brains.
4. Rachel Gillett’s article Why Our Brains Crave Storytelling in

Marketing.
5. Jonathan Gottschall’s article Why Storytelling is the Ultimate

Weapon.
6. Jonathan Gottschall’s article Infecting an Audience: Why Great

Stories Spread.
f. Consider creating Design Personas for your website or fictional, “archetypal users
of a…website” that are derived from information and research about actual
internet users (i.e. they “represent the needs,” objectives, and personalized
character traits of “larger groups of” actual “users”) so that they don’t reflect “the
opinions” of the website creator(s) who constructed them. These personas operate
as “‘stand-ins’ for real users,” assist in the guiding of “decisions about
functionality and design,” and determine what fuel’s actual users’ behavior
online. Design Personas ensure that actual users’ “goals and needs become a
common point of focus” for the website creator(s) (Calabria, 2004).
i. It’s important to mention that the act of incorporating Design Pesonas

within your website design is something that would be most effective to
do after the design has been firmly established through employing the
other components of Structure, Content, Appearance, and Usability (which
is why I haven’t gone into great detail about it here). Nonetheless, I’ve
mentioned it because I believe it’s an element that’s extremely important
to a website’s success and should therefore be included in its design at
some point. With that being said, it would be wise to consider referring to
the following articles about the intricacies of Design Personas to gain
additional insight about how best to create and employ them in your site’s
content to improve your website design and reap the desired effects of their
application:
1. Tina Calabria’s article An Introduction to personas and how to

create them.
2. Aaron Walter’s article Redesigning with Personality.
3. Aaron Walter’s article Design Personas: Excerpted from

Designing for Emotion.
IV. Usability: A successful website is usable, meaning it’s can be read and/or scanned and
understood effortlessly (Spritz Web Solutions, 2012). For a website to be usable, it should
have lucid navigation that’s companionable so that visitors can access what they need
efficiently without having to scroll or rummage through extraneous information, links,
tabs, etc. (M5 Design Studio, 2017). Usability is about creating a user-centric experience
for website visitors that gives them “instant gratification” which means that they don’t
have to think about the information presented or go searching for it, but rather are given it
quickly and obviously—the design or a website should be intuitive to reduce the amount
of work internet users have to do (Friedman, 2008)—It would be wise to consider referring
to Vitaly Friedman’s article 10 Principles of Good Website Design to gain additional insight
about principles of effective web design to improve your website design and reap the desired
effects of their application. Also, when it comes to user-centric design, you should “always
think from the perspective of your users. This is particularly important if you offer a lot
of content on your company's website” (Singh, 2013).
a. Use black colored text against a white background with readable fonts and font
sizes (for paragraphs, use 10-point to 12-point font size or slightly larger—don’t
go larger than 14-point font), as this it will be intelligible to virtually all visitors
(Spritz Web Solutions, 2012).
b. Your website should possess a “theme of simplicity and minimalism” (Strickler,

2016)—providing “valuable content, good organization, and attractive design” via
in simplistic ways makes using a website fun and addictive, which keeps visitors
intrigued and coming back for more (Spritz Web Solutions, 2012).
c. Find a balance between positive space and negative space (or whitespace, which
is a foundational part of any web design). Positive space “contains all of the
elements of your site, content, navigation, images, etc.,” whereas negative space
is “the empty space in between” that divides said elements while also “helping to
structure and define” how visitors “interact with the content in the positive
space.” Achieving this balance results in an “uncluttered layout” that accentuates
the content presented (“the more we leave adequate room and spacing, the more
purposeful our inclusions seem”) and that “allows viewers to focus on [the
website’s] messages” (Bowen, 2013).
i. There are two types of negative space:

1. Micro negative space—the “space between the smaller elements of
design,” such as space between paragraphs and headers, images
and their captions, individual lines of type, words, and letters,
which can be integral to a site’s readability and/or how easy it is to
scan, understandability, and overall ambiance (creating an
appropriate levity amid content that’s both visually dense and
emotionally intense). The micro negative space within blocks of
text should be tight “in an aesthetically balanced and open way”
(Bowen, 2013).
2. Macro negative space—the “space between larger, core elements

of design,” like the “header and footer.” It is common for people to
view the headers, footers and sidebars of a design as “content
catch-all” areas or domains in which “to shove and dispose of as
much information as possible” because they’re where visitors tend
to frequently look. This is especially true for headers as they are
what visitors see first—it’s important to avoid cramming headers
with a lot of information and only include a select number of
important features so visitors know where they’re located on a
website and don’t suffer from content overload upon accessing the
site. Although you can put more content in footers and sidebars,
you still should determine that there’s enough negative space
around and between them (Bowen, 2013).
ii. The use of negative space is subjective and is all about “designing and
manipulating the space outside, inside, and around your content” in such a
way that will be beneficial to your organization’s website and its goals,
personality, etc. (Boulton, 2007).
iii. Negative space is key to the “effectiveness of a design” (Boulton, 2007).
iv. Negative space is vital to usability because it prevents the occurrence of

clutter (subsequently, helping maintain an appealing appearance) and
makes content easy to read and/or scan, thus permitting visitors to find the
information they need more quickly—negative space allows for better
navigation of a website because it gives content “room to breathe”
(Bowen, 2013). Negative space generates a “visually comfortable…

balanced, [and] harmonious layout” that “just feels right” to visitors
(Boulton, 2007).
v. The employment of negative space and the act of deciding what content to
include in a website are equally significant and often inextricable tasks—
negative space is a vital component to making the content in the interface
“stand out in a clean and professional [digitalized] environment” (Bowen,
2013).and this content cannot affect visitors in a desired way without
emphasized by negative space (without negative space, a website’s design
will be “too heavy and its content too difficult to read” and/or scan
(Boulton, 2007)).
vi. Negative space can be applied to an organization’s website to give it and

consequently its brand a refined feeling that may ultimately boost its
credibility (more white space equates to a luxurious design and less
whitespace equates to a cheap design) (Boulton, 2007).
vii. Negative space can be employed to guide visitors through a website

because it “leaves ‘looking room’” for their eyes to flow in a structured
manner from one element to the next. This sort of negative space that
guides visitors through a website is known as active negative space which
is often incorporated within a design and/or content to “better emphasize
or structure information” (Boulton, 2007).
d. Minimize the amount of scrolling visitors must do by creating hyperlinks and/or

links to other webpages (where they can read and/or learn about particular
projects, research, topics, etc.) from the main website pages as needed. Creating
hyperlinks and/or links may also improve your website’s appearance and overall
functionality because it will reduce clutter and better your site’s standing within
search engines. Make sure that the texts for said links are “long and descriptive”
with the inclusion of your site’s keywords because it will increase the chances of
visitors finding your website via Search Engines (Spritz Web Solutions, 2012)—
“links are an important factor in determining where a website will appear in a
search engine” (M5 Design Studio, 2017). You can also create links that will
quickly scroll and/or take visitors “to locations within the same page,” thus
getting them to what they need quickly (Laja, 2017). Any links to your website’s
“most important pages should be easily found on” each of your site’s pages (a
good principle to keep in mind is that “every page” or relevant source to your
website “should be accessible in two clicks from your” website’s “home page”—
which may not work of your website is bigger) (Snell, 2015).
i. Another way you can use links to optimize your rank in Search Engines
and increase the number of internet users accessing your website is by
“submitting articles” or other educational materials to websites that are
similar or related to yours and the field of information you are in. These
other websites are likely to “allow a link back to your website from your
articles.” So, when searches are conducted for information that your
articles address, your website is more likely to rank higher in Search
Engines making it more likely to be seen by internet users (see the third
image on the right of Figure 5 p. 9 which shows that internet users pay the
most attention to the first four results that Search Engines produce for
them on a given topic) (M5 Design Studio, 2017).
ii. The creation of links can also play a significant role in improving your
website’s credibility. Backing your information up with links to other
prestigious sources help visitors judge whether the information your site’s
providing is believable. In fact, the act alone of citing other sources via
links gives visitors the impression that the content is composed of
“relatively accurate information” (whether people click the links to view
the other sources or not, you should ensure that they are high in quality
and relevant to your website’s content). Said links also allow visitors to
dig “deeper for more information” (if they desire to do so) and find a
number of similar sources that “pique their interest” or are useful to their
work (Nielson & Morkes, 1997).
iii. If scrolling is inevitable, which it sometimes will be, “guide [visitors’] to

do so” by clearly encouraging them to scroll with a “please scroll
graphic.” All information that’s important for visitors to know (e.g. an
organization’s mission, work, and goals, etc.) should be placed at the top
of your webpages (i.e. visitors should not have to scroll to find an
organization most important information and messages, they should see it
first and foremost) as discussed in the Content section about applying an
inverted pyramid writing style (Laja, 2017).
e. Develop a consistent layout for your website’s structure (Spritz Web Solutions,
2012)—practice repetition in color, font, spacing, headings, links, graphics, etc. as
it will allow visitors to better understand and navigate your site due to their
perception of familiarity and similarity (relation) in overall content (Bradley,
210).
f. Provide your website visitors with intuitively functional, “prominent, [and]
logical navigation” by having no more than ten menu items and putting them at
the top of your site because said visitors want information quickly without having
to scavenge for it (Spritz Web Solutions, 2012).
g. Your website should be well-edited and errorless—review the content to fix any
typos; spelling, punctuation, and grammar mistakes; and misreporting of facts
and/or figures so that visitors can use your site easily and free from any suspicion
about the content’s reliability (Spritz Web Solutions, 2012). Said mistakes distract
visitors from using your website in desired ways. All external websites or sources
you link to from your website should be high in quality with “concise
descriptions. Also, you shouldn’t “rush to publish mediocre or incomplete” pieces
of content for your website—make sure the work you produce is professional and
well-rounded (webreference, 2017).
h. Supply visitors with the option to download pieces of your website’s content (e.g.
infographics, presentations, flyers, forms, etc.) if they want to take information
with them (Spritz Web Solutions, 2012).
i. Use typography to create a visual language (i.e. the “character and significance
created by carefully selected typography) that will captivate visitors’ attention and
spark their interest in your content (Knight & Glaser, 2012). Typography involves
choosing the right fonts and sizes for your website (i.e. the fonts of “serif or sans-
serif fonts” work for both “body copy and headings” (the fonts of “Georgia, Arial,
Verdana and Lucida Grande” also work for body copy), the fonts of “Georgia,
Arial and Helvetica” work for headlines, font sizes for headings “range between
18 and 29 pixels,” and font sizes for body copy “range between 12 and 14 pixels”
(Martin, 2009)); deciding when to bold and/or highlight certain bits of information;
and so on. It would be wise to consider referring to Carolyn Knight’s and Jessica
Glasser’s articles When Typography Speaks Louder than Words and Why Subtle
Typographic Choices Make All the Difference, as well as Michael Martin’s
Typographic Design Patterns and Best Practices to gain additional insight about how
to use typography to improve your website design and reap the desired effects of their
application.
Suggested Revisions that Could Be Made to the Equality Research

Center Website
In the following, I provide a list of suggested revisions I believe could be made to the ERC’s
website based on the secondary research addressed above.
I. The ERC website’s landing or home page follows the Z-Shaped Pattern (see
Figure 8 below); knowing this gives me the insight needed to reconstruct its
design in a way that effectively introduces the ERC to visitors by providing them
with the basic information they should know about the organization upon
accessing the site (Note: the rest of the ERC site’s pages follow the F-Shaped
Pattern and information should be positioned in order of importance).
a. In keeping with the Z-Shaped Pattern skeletal structure (see Figure 1, pg.
6), I want to position said basic information in order of importance all
along the scanning path from Point #1 to Point #4, beginning with
essential, primary information visitors should see and followed by helpful
details or secondary information that all build up to the finishing call-to-
action or point at which visitors are encouraged to take a specified action.
To achieve this, I must first provide answers for the following questions.
Figure 8. The Z-Shaped Pattern Skeletal i. When visitors land on your web page that adheres to the Z-Shaped
Structure Imposed on the ERC’s home Pattern, what information do you want them to receive?
web page.
1. The information I want visitors to receive when landing on

the ERC’s home web page is a statement that says what the
ERC does, a succinct description of what the ERC is all
about, the ERC’s mission and vision statement, graphics
and/or images of the ERC and its people (that may or may
not include annotations), and a suitable logo that
universally captures the ERC and everything in stands for
in one compact image (thus cultivating a powerful first
impression because it will be in the top left corner which,
as we learned in the Structure section of this research
report, is where visitors look first) (see Figure 9).
ii. In what order do you want them to see the information?

1. The order I want visitors to see this information is as
follows:
a. The ERC logo.
Figure 9. Models or brainstorming ideas b. A statement that says what the ERC does.
of what the ERC’s Logo could possibly
look like. c. Graphics and/or images of people involved with the
ERC (that may or may not include brief
annotations).
d. A succinct description of the ERC’s work.
e. The ERC’s mission and vision statement.
iii. What do you want them to do as a result of seeing the information

you presented or what should they do next?
1. As a result of seeing the information presented on the

ERC’s home web page, I would want visitors to feel
intrigued and motivated to explore the rest of the ERC’s
website, or inspired to donate to the ERC.
b. Here, it’s important to mention that there’s an animated banner or

“featured image slider in the center” (Jones, 2010) of the ERC’s home
web page because I would place the statement that says what the ERC
does and graphics and/or images of people involved with the ERC (that
may or may not include brief annotations as slides) within it (Note: this
animated banner serves as a valuable visual tool because it immediately
grabs visitors attention and adds to the website’s interest quotient, thus
generating a strong impression that helps communicate ideas and convince
visitors that its worth their while to learn more about the ERC. It also is in
an internet user scanning hotspot, as we learned from the Structure section
of this report, which means that it’s vital for the ERC to take advantage of
it by positioning important information within it).
i. Below I’ve included, in chronological order, the slides that are

currently shown within the ERC website’s animated banner to help
me describe the revisions I believe should be made to it.
Slide 1 Slide 2 Slide 3
Slide 4
a. In Slide 1, I would replace the new Director’s

introduction (since it’s already been displayed for a
sufficient amount of time) with a statement that says
what the ERC does. Specifically, I would place
something similar to the following in the slide:
Seeking to advance social justice for Lesbian, Gay,
Bisexual, and Transgender people; Connecting
academic, evidenced based LGBT research to
community action, public policy, and curricular
innovation; Expanding public knowledge of
Lesbian, Gay, Bisexual, and Transgender
experiences, stories, and voices; Committed to
amplifying Lesbian, Gay, Bisexual, and
Transgender voices, stories, and experiences. These
statements provide powerful, brief bursts of
information that tease to visitors what the ERC does
and makes them want to find out what the ERC is
about by reading the ERC’s mission and vision
statement that will be placed below the animated
Figure 10. Models if images that could be used in banner. Couple one of these statements with a
the first slide of the ERC website’s animated complementing image (similar to the ones displayed
banner.
in Figure 10) and the slide will become emotionally
charged, as it will provide visitors with a virtual
experience that causes them to feel they were
present to witness or be a part of a LGBT event or
instance of LGBT social justice as it was
happening. Said images give presence to the events
and people they display, thus creating a particular
reality, understanding, and attitude toward society
that’s accepting of LGBT people’s identities and
supportive of their civil rights. This may incite
visitors to tap into more sympathetic frames of mind
from which to judge the ERC and what it stands for
(i.e. LGBT equality). This makes the incorporation
of one or more of these images in the first slide of
the animated banner a powerful act of persuasion,
because they can be employed as the initial spark in
the manipulation of ERC website visitors to view
the ERC and LGBT human rights favorably or to
complete a desired action (e.g. donate to the ERC so
that it may fund significant LGBT research funding,

moving to another page on the website,
participation in a project, etc.).
ii. In Slide 2, I would replace the “Research Is Good” graphic with

images of people involved with the ERC, such as the ERC staff,
(that may or may not include brief annotations as slides) to begin
fostering a relationship with visitors by sharing representations of
the ERC’s personality. Specifically, I would place one or two
images within the second slide—one of the ERC office and one of
people involved with the ERC or two images be of people involved
with the ERC or one image of people involved with the ERC—
with a brief caption describing what the image or images represent,
such as “Who We Are” and/or “Our Staff” and/or “Our Team.”
Putting images of those currently involved with the ERC in the
second slide with a brief caption and possibly their names will
complement the staff sub-page of the contact us page.
1. Images of real people involved with the ERC, as we

learned in the Appearance section of this report, will be
more attractive to visitors because they (as real people
themselves) want to connect with real people. I would also
make sure that the people within the images are square to
the visitors. This is because such depictions are perceived
as more inviting and approachable, which may serve to
Figure 11. Examples of images that humanize LGBT people, civil rights, and experiences in
depict people involved with the visitors’ minds and cause them to identify with them
ERC.
(making sure that the images include smiling people will
also go over well because they will convey warmth and
happiness) (see Figure 11 for examples of images that
depict people involved with the ERC as described above).
1. In terms of depicting the ERC office in King Hall on the

website, the creation of a 360-degree video before and/or
during and/or after it has been cleaned and redecorated (we
could also just post pictures instead of the video) would be
an interesting, interactive experience visitor would
enjoy. This would give people a visual representation of the
ERC as a tangible being—it always has been, however
while viewing the Facebook page I saw images of the
people who’ve worked with the ERC, the projects they’ve

done, their presence as an information booth at conferences
and parades, etc. (which is great because they’re images of
real ERC people advocating for LGBT rights that viewers
and followers can relate to), but I didn’t see any images of
the ERC itself. This, personally, has given me a perception
of the center as an elusive being that I know is there and is
doing excellent work, but that I can’t fully access, connect,
or interact with. Providing people with images of the ERC
in conjunction with images of ERC staff, volunteers, etc.
doing inclusive and innovative work, will play a significant
role in fostering a relationship or connection with friends
and followers, as well as the people the ERC serves (policy
makers, advocates, educators, professionals, practitioners,
service providers, and as many communities as possible).
By doing this, we will be providing relatable content
(textual and visual) that they can interact and become
familiar with and thus motivate them to want to become
more involved in the ERC’s work (not to mention that this
will be helping the ERC achieve its goal of transferring
academic research and resources to the public sphere and
public conversation by creating a partnership between the
private sphere of academia and public sphere of social
living).
iii. I would use Slide 3 and Slide 4 as places to advertise for different
ERC events, projects, etc. that are currently happening and that
visitors should know about. This would serve to keep the ERC
updated and visitors interested in what’s going on. For example,
instead of creating a 360-degree-video for the ERC office in King
Hall, before and/or during and/or after pictures could be placed in
Slide 3 or 4 with a catchy caption thus demonstrating how the ERC
is working to improve itself.
c. Directly underneath the animated banner I would place a succinct

description of the ERC’s work and the ERC’s mission and vision
statement (i.e. moving these sections, “Our Work” and “Our Mission and
Vision” of content from the about page to the home page to prioritize this
important information that visitors should know; if for whatever reason
these two sections of content cannot be placed on the home page they
should at least be prioritized at the top of the about page; the “Our Work”
section should be placed on the home page before the “Our Mission and
Vision” section, meaning that it should definitely be on the homepage so
that visitors will know what the ERC is about—the “Our Mission and
Vision” section, though important, can be placed and serve well on the
about page as long as it’s prioritized as aforementioned). Although the
animated banner will “facilitate [visitors’] eye movement down” (Jones,
2010) to these two pieces of content, I would still utilize some typographic
tricks to make them more eye-catching to visitors (bolding or applying
color or capitalizing some of the key works, making these paragraphs a bit
larger in font size, etc.). Moving this information to the home page will
create more space in the about page for pertinent images and the use of
whitespace (on the right side of these two elements, I would incorporate a
call-to-action that asks visitors to check out the about section of the
website or News & Noteworthy section (discussed in detail below)).
II. The information that the ERC’s website provides in virtually all of its pages is
dense—there’s a significant amount of written content compacted together (see
images below). To combat this and make the written content “more legible,”
giving the website a “lighter overall feeling” micro whitespace could be added to
“individual characters” and the “type could be set slightly smaller” (Boulton,
2007).
III. On three of its sub-pages within the Research tab (Knowledge Project, Research
Reviews, and Research Reports), the ERC website lists past and a few present
research reports (sponsored by the ERC) and reviews (written by the ERC). If
links to these reports and reviews (particularly the past ones) were made on a
separate page or pages from the ERC site’s Research page or Knowledge Project
sub-page, then much needed space for pertinent graphics and new content would
be available. Not only would the creation of links reduce clutter on the ERC web
pages, but it would also, as we learned in the Usability section of this report,
better the ERC site’s standing within search engines, making it more likely for
internet users to access it.
IV. Incorporate images that will supplement the content on the ERC website’s pages
(if applicable); position these images strategically so that they draw visitors’ eyes
to the content (i.e. have the people in the images look toward or face the content).
Also, use typographic tricks as needed to make the ERC’s most information stand
out. Get rid of the large logo type graphic on the about page (see graphic below).
It doesn’t add context to the content provided.
V. I believe the written content has been well composed; it’s direct and free of any
overly-hyped of fluffy language. However, it may reflect well on the ERC and
work to better serve its audiences if the ERC provided a link to or create a source
and/or page with LGBT definitions and descriptions so that its content is
accessible to a wider range of audiences. Not everyone who accesses the ERC’s
site is going to know LGBT terminology and although it could be assumed that
they have the capacity to look said information up, it would benefit the ERC to
provide it because then people won’t feel turned off to the site due to a lack of
knowing and subsequent feeling of otherness. Instead, they will feel like their
needs are being met and that the ERC is a friendly, accommodating organization
(i.e. it’s relationship building via the accentuation of the ERC’s personality and/or
character as a source dedicated to imparting knowledge; this perfectly
demonstrates the idea discussed in the Content section of this report about taking
on different personae to effectively communicate with and assist different
audiences).
VI. I like the LGBT colors image that’s located at the top of each of the ERC site’s
web pages (except for that of the home page); I think the consistency is
aesthetically pleasing and it carries a lot of meaning for LGBT people and their
rights (see image below). However, it may also be a good idea to replace that
image with images of topic, events, people, etc. that are pertinent to the content of
each page.
VII. The “News & Noteworthy” section currently located on the ERC website’s home
page could be converted into a third or fourth slide within the animated banner (as
previously alluded to) or occupy its own space within the left navigation sidebar
as a sub-page that opens up to or provides a link to a newsletter document that
details all of the current events and happenings taking place at the ERC and can
be downloaded so people can use it as needed (a call-to-action and/or links could
be made to this from the home page so that visitors could quickly access it and
discover what’s going on at the ERC).
VIII. One of the most effective and valuable graphics that can (and should) be used to
display research is an infographic—a “visual presentation of information” that
combines elements such as graphs, charts, and other images with “minimal
text…to give an easily understood overview, often of a complex subject”
(Dictionary.com, 2017). This is especially true for the ERC as it strives to connect
academic research on the complex experiences and civil rights issues of LGBT
people to the public sphere (i.e. community action, public policy, and curricular
innovation). This in and of itself can be a complicated task, not to mention the
difficulties that arise from the prejudice, discrimination, and social and political
antagonism that inhibits people and communities from critically and objectively
evaluating pertinent LGBT information. Infographics make the transference of
this information more manageable by serving as a sort of neutral medium that
finds common ground through the creation of an interesting, interactive
experience that combines narratives with factual evidence.
a. An infographic with a strong, balanced combination of story and

evidence-based research, and particularly in this case one that’s addressing
an issue of LGBT social justice, can cause those who are viewing it and
have unfavorable predetermined conclusions about LGBT people and the
importance of securing equality for LGBT communities to “be moved
emotionally, drop their intellectual guard,” (Gottschall, 2012) and
experience cognitive dissonance (or inconsistency between their state and
vocational obligations, cultural assumptions, and personal ethicality as
they pertain to seeing LGBT civil rights as basic human rights). They then
begin to feel a successive sense of guilt and personal responsibility that
could be redeemed through adopting more favorable views of LGBT
people and civil rights and subsequently supporting the ERC (which they
are likely to do in order to relieve said guilt). Here, we see that
infographics are visually and emotionally powerful, which provides them
with the ability to persuade people into thinking in ways that they usually
don’t and into questioning the validity of their beliefs. As a result of this, I
think inforgraphics should be a staple of the ERC website, particularly
within the ERC’s upcoming research project called “Equality Facts” (the
potential infographics the ERC presents should also be made
downloadable so that policy makers, advocates, educators, professionals,
practitioners, and service providers can have access to and use them as
needed (follow this Link to experience the significance of infographics).
IX. The social media icons (i.e. Facebook, Twitter, YouTube, LinkedIn, and Blog
EMU) at the bottom right side corner of each ERC website’s pages all link to
EMU’s accounts, not to the ERC’s accounts; I found that to be confusing and
irrelevant to the ERC’s website. Unless those icons are required to be on all EMU
websites, we should alter them so that they link to the ERC’s social media
accounts (i.e. to those that are applicable) or we can create icons and links to the
ERC’s accounts in addition to EMU’s and just specify which is which.
X. In the future, since the ERC is re-building to conduct and fund internal research
(i.e. research by EMU students, faculty, and staff that’s relevant to the lives
within and surrounding EMU and the ERC), I think it may be beneficial to create
space in the ERC’s website in which visitors can interact with its design in
meaningful ways. In other words, I think it could be useful for both the ERC
website and its visitors, friends, and followers, if monthly (or otherwise) surveys
and online forums and/or discussion threads were incorporated into the site’s
design so that LGBT people and the people the ERC serves (i.e. policy makers,
advocates, educators, professionals, practitioners, and service providers) can share
their voices, stories, and experiences (about particular topics that are pertinent to
the ERC’s latest work) and hold civil, genuine conversations. This will allow the
them to foster relationships and mutual understandings between one another,
which will help progress the ERC’s vision of cultivating a society in which LGBT
people can openly partake in all aspects of their communities’ social living
without the hindrances inequality. It will also help mold the ERC’s website “to
better serve [its visitors’] needs” and generate content for the ERC that could
guide its research or help determine what research needs to be conducted based on
the collected surveys and discussions (webreference, 2017).
Closing Statement
The ERC’s website, like any other website, is a living entity that requires constant maintenance
and alteration to ensure that it’s accurately displaying the ERC’s work and thoughtfully serving
policy makers, advocates, educators, professionals, practitioners, and service providers. This
means that there’s more information beyond this report that is and will be pertinent to the ERC
website, and that the suggested revisions and ideas presented are only preliminary ways in which
to change the site for the better. Nonetheless, this report lays the foundational structure necessary
to build a functional and efficient website that matches the ERC’s profound mission, vision, and
undertakings.
Notes
 Virtually all quotes in this report were used strategically; their wording gave me ideas on
what revisions could be made to the ERC’s website and lead me to other sources of
information that could be useful to the site in the future. Therefore, I didn’t want to alter
them too drastically in case I wanted or needed to refer back them at some point.
 I didn’t provide very many suggested revisions for the research page and its sub-pages
because I know that the ERC is likely to change its research approach and its various
elements.
References
Arnold, G. (2015, September 29). 5 Reasons Why Images Speak Louder Than Words. Retrieved
from https://www.linkedin.com/pulse/5-reasons-why-images-speak-louder-than-words-
gabe-arnold
Babich, N. (2017, April 4). F-Shaped Pattern for Reading Content. Retrieved from
https://uxplanet.org/f-shaped-pattern-for-reading-content-80af79cd3394
Babich, N. (2017, June 16). Z-Shaped Pattern for Reading Web Content. Retrieved from
https://uxplanet.org/z-shaped-pattern-for-reading-web-content-ce1135f92f1c
Boulton, M. (2007, January 9). Whitespace. Retrieved from

https://alistapart.com/article/whitespace
Bowen, R. (2013, December 18). Why Negative is Positive in Web Design. Retrieved from
https://www.webdesignerdepot.com/2013/12/why-negative-is-positive-in-web-design/
Bradley, S. (2014, December 12). Design Principles: Visual Weight and Direction. Retrieved
from https://www.smashingmagazine.com/2014/12/design-principles-visual-weight-
direction/
Bradley, S. (2010). Gestalt Principles: How Are Your Designs Perceived? Retrieved from
http://vanseodesign.com/web-design/gestalt-principles-of-perception/
Calabria, T. (2004, March 2). An Introduction to personas and how to create them. Retrieved
from http://www.steptwo.com.au/papers/kmc_personas/
Carlson, A. (2009, July 26). Why Pictures Speak Louder than Words. Retrieved from
http://ddunleavy.typepad.com/the_big_picture/2009/07/why-pictures-speak-louder-than-
words.html
Deutschendorf, H. (2014, February 21). The Simple Science to Good Storytelling. Retrieved
from https://www.fastcompany.com/3025676/the-simple-science-to-good-storytelling
Dictionary.com (2017). Infographic. Retrieved from

http://www.dictionary.com/browse/infographic?s=t
EMU Foundation (2017). Coming Full Circle. Retrieved from

http://emich.myplannedgift.org/meet-our-donors/coming-full-circle
Equality Research Center (2017). About. Retrieved from

https://www.emich.edu/equality/about/index.php
Friedman, V. (2008, January 31). 10 Principles of Good Website Design. Retrieved from
https://www.smashingmagazine.com/2008/01/10-principles-of-effective-web-design/
Gottschall, J. (2013, October 20). Infecting an Audience: Why Great Stories Spread. Retrieved
from https://www.fastcompany.com/3020046/infecting-an-audience-why-great-stories-
spread
Gottschall, J. (2013, October 16). The Science of Storytelling: How Narrative Cuts Through
Distraction Like Nothing Else. Retrieved from
https://www.fastcompany.com/3020044/the-science-of-storytelling-how-narrative-cuts-
through-distraction
Gottschall, J. (2012, May 2). Why Storytelling is the Ultimate Weapon. Retrieved from
https://www.fastcompany.com/1680581/why-storytelling-is-the-ultimate-weapon
Griffin, E., Ledbetter, A., and Sparks, G. (2015). A First Look at Communication
Theory. Ninth ed. New York: McGraw-Hill Education, 189-197, 200, 205, 288, & 297-
298. Print.
Hawkyard, J. (2017). Professional Imagery: Why it is Important for Your Website. Retrieved
from https://www.treefrog.ca/why-professional-imagery-is-important-for-your-website
Idler, S. (2012, November 20). How to Add a Personal Touch to Your Web Design. Retrieved
from https://www.smashingmagazine.com/2012/11/freehand-style-in-web-design/
Jones, B. (2012, March 7). Understanding the F-Layout in Web Design. Retrieved from
https://webdesign.tutsplus.com/articles/understanding-the-f-layout-in-web-design--
webdesign-687
Jones, B. (2010, October 19). Understanding the Z-Layout in Web Design. Retrieved from
https://webdesign.tutsplus.com/articles/understanding-the-z-layout-in-web-design--
webdesign-28
Knight, C. and Glasser, J. (2012, April 13). When Typography Speaks Louder Than Words.
Retrieved from https://www.smashingmagazine.com/2012/04/when-typography-speaks-
louder-than-words/
Knight, K. (2011, June 13). All Abput Website Sidebars: Content, Design, and Examples.
Retrieved from https://onextrapixel.com/all-about-website-sidebars-content-design-and-
examples/
Kokemuller, N. (2017, September 26). What Is the Purpose of a Business Card? Retrieved
from https://bizfluent.com/facts-4894286-what-purpose-business-card.html
Kolodynska, O. (2016, October 26). Marketing Quotes to Help You Understand What’s
Important for Customers. Retrieved from https://www.livechatinc.com/blog/marketing-
quotes/
Laja, P. (2017). 10 Useful Findings About How People View Websites. Retrieved from
https://conversionxl.com/blog/10-useful-findings-about-how-people-view-websites/
Martin, M. (2009, August 20). Typographic Design Patterns and Best Practices. Retrieved from
https://www.smashingmagazine.com/2009/08/typographic-design-survey-best-practices-
from-the-best-blogs/
Morr, K. (2016). Using F and Z Patterns to create visual hierarchy in landing page designs.
Retrieved from https://99designs.co.uk/blog/tips-en-gb/visual-hierarchy-landing-page-
design/
M5 Design Studio (2017). What Makes a Good Website? Retrieved from

http://m5designstudio.com/what-makes-a-good-website/
Nielson, J. and Morkes, J. (1997, January 1). Concise, SCANNABLE, and Objective: How to
Write for the Web. Retrieved from https://www.nngroup.com/articles/concise-scannable-
and-objective-how-to-write-for-the-web/
Nielson, J. (2006, April 17). F-Shaped Pattern for Reading Web Content. Retrieved from
https://www.nngroup.com/articles/f-shaped-pattern-reading-web-content-discovered/
Palczewski, Helen C., Richard Ice, and John Fritch. (2012). Rhetoric in Civic Life. State College,
PA: Strata Publishing, Inc. 62, 64, 69, & 150-154. Print.
Polaczyk, J. (2016, May 30). What Makes a Good Website: 4 Secrets of Website Design.
Retrieved from https://www.livechatinc.com/blog/what-makes-a-good-website/
Richards, J. (2015, May 27). The ‘Inverted Pyramid’ web content model. Retrieved from
http://blogs.exeter.ac.uk/webteam/blog/2015/05/27/the-inverted-pyramid-web-content-
model/
Robin (2012, February 9). Why Should We Design Emotional Systems? Retrieved from
https://www.smashingmagazine.com/2012/02/the-journey-from-writer-to-reader/
Schnotz, W. (2017). What Is the Purpose of a Business Card? Retrieved from

https://yourbusiness.azcentral.com/purpose-business-card-4556.html
Singh, K. (2013, June 17). Web Design: 11 Characteristics of a User-Friendly Website.

Retrieved from https://www.socialmediatoday.com/content/web-design-11-
characteristics-user-friendly-website
Snell, S. (2015, March 4). Characteristics of a Good Website. Retrieved from

http://www.vandelaydesign.com/characteristics-of-a-good-website/
Spritz Web Solutions (2012). Does Your Website Have What It Takes? Retrieved from
https://www.spritzweb.com/resources/good-website-characteristics.html#content2
Strickler, K. (2017, March 2017). What Makes a Great Website? 6 Web Design Trends for
2017. Retrieved from http://www.commonplaces.com/blog/what-makes-a-great-website-
6-web-design-trends-for-2017
Strickler, K. (2016, January 21). What Makes a Great Website? 10 Website trends for 2016.
Retrieved from http://www.commonplaces.com/blog/10-website-trends-for-2016
webreference (2017). What Makes a Great Web Site? Retrieved from

http://www.webreference.com/greatsite.html
Woods, S. (2014, April 3). 10 Top Principles of Effective Web Design. Retrieved from
https://shortiedesigns.com/2014/03/10-top-principles-effective-web-design/

MW Ctac 495l Asl Project Research Report

Hochgeladen von

Dokumentinformationen

Originaltitel

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

MW Ctac 495l Asl Project Research Report

Hochgeladen von

Copyright:

Verfügbare Formate

Running head: SUCCESSFUL WEBSITE CHARACTERISTICS 1

Successful Website Characteristics Pertinent to

Title Page (1)

Table of Contents (2)

Brief Description of the Equality Research Center (3)

Successful Website Characteristics Pertinent to

Suggested Revisions that Could Be Made to the Equality Research

Closing Statement (35)

Brief Description of the Equality Research Center

an upstanding character, an aesthetically pleasing guise, and/or provides emotional (pathos)

Successful Website Characteristics Pertinent to

a. According to various scientific eye-tracking studies, specifically those conducted

1. You should place information in order of importance all along the

filling out a form, participating in a project, etc.) (Jones, 2010)—

2. The Z-Shaped Pattern works because it’s intuitive; most visitors

3. The Z-Shaped Pattern should be employed on your website’s

ii. The F-Shaped Pattern is the most common eye-scanning or dominant

1. It’s important to keep in mind that internet users’ F-shaped eye-

2. The F-Shaped Pattern, like the Z-Shaped Pattern, is intuitive

4. You should “start subheads, paragraphs and bullet points with

5. It’s important to know that the F-Shaped Pattern has a

6. Incorporate a sidebar or sub-navigation within your F-Shaped

media widgets,” etc.) (Babich, 2017). The purpose of a sidebar is

a. Sidebars are used for “secondary content purposes,”

a. The three pillars (or principles) of compelling content:

i. Your website’s content should be concise, meaning it should be “short and

seconds to hook your visitors” and make a good first impression

2. Consider applying the “inverted pyramid writing style” (Nielson &

to decide whether or not to keep reading and/or scanning further

3. Present or write your content in ways that encourage scanning by

a. Making your headings, in particular, dominant and clear is

iii. Your website’s content should be objective, meaning it should be

easy to grasp—you should “use words and categories of information that

1. Internet users connect better when a website’s language is informal

c. Where and when appropriate (on a regular basis—weekly, bi-weekly, monthly,

d. The content of your website should be presented in a “variety of formats” (e.g.

i. When it comes to conveying your organization’s personality in your

(delivered in the form of a brightly colored infographic that tells a story

1. Sabina Idler’s How to Add a Personal Touch to Your Web Design.

2. Aaron Walter’s article Personality in Design.

3. Aaron Walter’s article Redesigning with Personality.

6. Shell Greenier’s article Optimizing Emotional Engagement in Web

information they’re seeking—producing “high quality content can have huge

III. Appearance: A successful website is a “visually appealing, polished, and professional”

i. Be strategic in your use of graphics—apply an appropriate number of

ii. It’s important to mention that the act of incorporating well-planned,

1. Gabe Arnold’s article 5 Reasons Why Images Speak Louder Than

2. Adrienne Carlson’s article Why Pictures Speak Louder than

3. Jen Hawkyard’s article Professional Imagery: Why it is Important

4. Jessica Benton’s article Getting visual with content: Are images

5. Peter Temple’s article Why Visuals Are More Powerful Than

6. James Balm’s article The power of pictures. How we can use

d. Graphics should be added to your website to “entertain and enlighten” visitors, as

e. Another medium that can provide visitors with an engaging, interactive

1. Jonathan Gottschall’s article The Science of Storytelling: How

2. Harvey Deutchendorf’s article The Simple Science to Good

3. Leo Widrich’s article The Science of Storytelling: Why Telling a

4. Rachel Gillett’s article Why Our Brains Crave Storytelling in

5. Jonathan Gottschall’s article Why Storytelling is the Ultimate

6. Jonathan Gottschall’s article Infecting an Audience: Why Great

i. It’s important to mention that the act of incorporating Design Pesonas

1. Tina Calabria’s article An Introduction to personas and how to

2. Aaron Walter’s article Redesigning with Personality.