Website Audit and Usability Test · 2017. 1. 3. · Website Audit and Usability Test Introduction A...

Website Audit and Usability Test Jessica Kleean, Victoria Haynes, Anna Monroe, Egle Vinickaite, and Quinn Millar

"If you want a great site, you've got to test."

Steve Krug

December 5, 2016

2

Website Audit and Usability Test

Table of Contents

Summary ............................................................................................. 3

Researchers ........................................................................................ 5

Introduction ......................................................................................... 6

Goals ................................................................................................... 7

Website Audit ...................................................................................... 8

Results .............................................................................................. 31

Participants and Usability Test ......................................................... 32

Methodology ..................................................................................... 33

Results .............................................................................................. 35 Task Completion .................................................................... 35

Errors ...................................................................................... 36

Recommendations ............................................................................ 37

Conclusion ........................................................................................ 38

Appendix A, B, C ............................................................................... 39

3


Summary

After spending the semester learning about web content, design, and

accessibility we put our knowledge to use by analyzing farmcafe.org.

After carefully choosing tasks that visitors face while using the website,

(described in the section “tasks”, we’ve gathered a group of 5 technologically

adept students to navigate the website.

On November 22 and 29 we invited students to our classroom and conducted a usability test during which we recorded their interaction with the website

while they were performing a series of basic tasks.

Analysis of the audit and test showed clearly that:

• Consistency is the greatest issue with F.A.R.M. Café. Implementing a

consistent layout and design throughout all platforms (social media, formatting and accessibility) would create readable copy with relevant

information.

• Updating and deleting old content and replacing it with new is essential.

There are menus and sections which appear “current” but are from

several years ago. Keeping the site up-to-date would make it more relevant and concise.

• A heavier emphasis on social media would reach a greater audience

and create more traffic to the website. Work on posting relevant

information and integrating the platforms more fluidly into the site.

4


Further recommendations can be found in the “recommendations” section.

The following document details the way we have conducted the research,

describes the results, and provides a list of recommended changes.

If you have any questions or comments, please feel free to contact:

• Anna Monroe – [email protected], 9197441991

• Egle Vinickaite – [email protected], 9416268172

• Jess Kleean – [email protected], 3364092507

• Tori Haynes – [email protected], 3365295157

• Quinn Millar – [email protected], 9194527491

5


Researchers

The audit and test was prepared and conducted by:

Anna Monroe

Senior Marketing major.

Egle Vinickaite

Senior Professional Writing major and general business minor.

Jess Kleean

Junior Professional Writing major and marketing minor.

Tori Haynes

Junior Professional Writing major and communication minor.

Quinn Millar

Senior Literary Studies major and political science minor.

6


Introduction

A usability test is a method of evaluating a product by testing it on users. It

has many variations. The method we chose to follow involved a controlled,

timed environment where selected users were prompted with several

questions about the site, which required in-depth navigation. We had a total of

five subjects participating in the usability test.

This test was conducted in order to aid F.A.R.M. Cafe in increasing traffic to

their site, ultimately helping their total revenue, donations, and volunteer support. Usability testing is a good way to test the usefulness and complexity

of a website by having objective users complete tasks and come to specific

conclusions which can serve as recommendations for site improvement.

These tests were carefully recorded and timed for quantitative and qualitative

purposes.

A group of five people for our research was considered sufficient for

conducting the test and coming to effective recommendations, which will be

listed in the “recommendation” section of our report. After thorough

preparation, the test was conducted on November 22, 2016 in Sanford Hall

room 304, beginning at approximately 12:45 p.m.

User interaction with the interface was recorded and analyzed by the team of

researchers, which informed our recommendations for improving the overall

product usability.

7


Goals

Goals of the audit and test:

1. Discover aspects that are most crucial to website improvement and

visibility. 2. Give a series of helpful recommendations for improving usability and

accessibility of the site.

3. Analyze social media and provide strategies for improving digital

presence.

8


Website Audit Using the website audit guide found in the Appendix A, our team assigned

scores to each page of the website according to the grading criteria. Our audit

is comprised of five parts: page content, design, SEO, social media, and lead

generation. In addition to assigning a numerical score the team has also come

up with specific recommendations through conducting in-depth analyses for

each section.

Page Content Does the content have lots of spelling errors or grammar issues or translation problems? Home page

o On the homepage, there are a several spelling and grammar errors, but

not enough to cause confusion for the reader.

Media page

o There are no spelling issues present on the media page.

Documents page



Menu page



Volunteer page



9


Are the paragraphs dense and hard to get through with little white space? Home Page

o While the paragraphs are informative and contain good information,

almost the entirety of the homepage is made up of dense text which

allows very little rest for the eyes.

o The sheer amount of text on the page actually puts off the viewer,

making them more likely to leave the page out of frustration.

o The minimal white space leaves the page looking cluttered and is likely

to confuse someone who is not willing to put in the time to read the text.

Media Page

o The media page is the opposite extreme of the home page. On the initial

page (which is navigated to by clicking the “media” tab directly, not the

pop up options below) there is no text, aside from three sections which

say “photo”, “video”, and “press”.

o Navigating to the press section of the drop-down menu takes the user

to a long, bulleted list. While bulleted lists are helpful for readability, too

many bullets can cause disinterest. The video page has little text to

explain the content, and the photos page has no text, except the header

“photos”.

Documents Page

o The paragraphs in this section are very well organized and utilize proper

white space for readability. Each section provides a concise explanation

of the headline.

Menu Page

10


o This section has a hundred-page archive of every day’s menu dating

back to August 2014. The archive is a large wall of text that is not

separated by photos or other media, which makes it difficult to read and

search through.

Volunteer Page

o The paragraphs are well separated and allow for a decent amount of

white space. Bulleted lists are utilized, along with bolding for new

sections.

o Links are scattered throughout to allow for ease of use and access to

information.

Is there any bolding, underlining or other embellishment that makes the content pop? Home Page

o There is bolding and underlining throughout, but there is no consistency

in its use or any sort of pattern that dictates what should be bolded or

underlined and what should not. The content “pops” but in all the wrong

places.

Media Page

o On the initial media page, the words “photo”, “video”, and “press”, are

stylized and more pleasing to the eye than traditional text. Press has

colorful hyperlinks which allow the user to know where exactly to click if

they wish to read an article. The word “press” is also centered at the top

of the page, and is bolded and underlined.

11


o In the video section, the text “F.A.R.M. Cafe Videos” is underlined and

bolded, which is consistent with the other pages. The “photos” section

utilizes the same pattern.

Documents Page

o Bolding is utilized throughout, with the page divided into three sections:

governance, volunteer forms, and volunteer information. However, the

latter two could be effectively combined into section.

o There is also use of color to create separation between text, which is

implemented very effectively.

Menu Page

o All of the text in this section is bold, and blends together with no

identifiable separations between the menus.

o Color transitions could be implemented, along with simple lines dividing

the menus for each day.

o The archive could be better organized with an interactive “choose your

date” tab, instead of an endless list.

Volunteer Page

o The text appears in varying sizes throughout each sentence, which is

meant to point out important information but instead serves as a

confusing point for the reader. As with the rest of the website, there is

bolding used, and some bold and underlined headlines. However, the second headline on the volunteer page is larger, bold, underlined, and

italics, which makes the user question which information item is most

important.

Are the headlines easily organized, easy to read and relevant to the copy below?

12


Home Page

o The headlines are consistent in the sense that they relate very well to

the copy they are summarizing, but there are far too many, and the

disorganization of the site makes the user unsure which headlines are

completely relevant, and which are not.

Media Page

o The headlines for all pages under the media tab are formatted in the

same way, and are located at the top middle of each page. They are

relevant to the copy, but could be more descriptive of the content

below. Capitalization is also nonexistent.

Documents Page

o The headlines for this page are well organized and relevant.

o They provide a readable pathway from section to section, and give the

user a clear idea of what they are looking for.

Menu Page

o No headlines are present on the menu page, which makes the entire

page difficult to navigate.

Volunteer Page

o The headlines are easy to read and relevant, but could be ordered by

importance.

o Some headlines are larger and more emphasized than others, and these

should be listed first if F.A.R.M. believes they are the most important

and relevant to users.

Are there images to support the content? Home Page

13


o There are images scattered throughout the homepage, but the text still

heavily outweighs the rest of the multimedia content.

o The homepage could be improved by being more media/image-heavy,

saving the text for specific sections and subheads on the site.

Media Page

o This section of the website is image heavy. There is not enough text

present to support the amount of images. The balance could be better

achieved with the implementation of an interactive gallery format which

included short descriptions below each photo.

o The “press” section includes no images, only a long bulleted list. There

are no breaks from the dense block of text. Recommendation would be

to highlight influential feature pieces done on F.A.R.M Cafe to allow the

most relevant information to stand out. This would also allow breaks between the many hyperlinks.

Documents Page

o There is only one image included throughout the entire documents

section, and it is not relevant to the copy. The image relates to the “giving tree,” which should have its own section in the “donate” tab.

Menu Page

o There is a small gallery of images at the top of the menu page, but no

context behind them aside from aesthetic appeal. They are photos of food, but do not have captions which would tell what specific meals

they reflect that F.A.R.M provides.

Volunteer Page

o There is a centered image at the top of the page, but that is the only image present. There is no strategy for the placement of images, and no

14


break for the reader after reading one of the many bulleted lists

provided.

Recommendation Summary

o Balance images with content. After a particularly information-heavy

section of each page, provide a relevant image that gives the reader an

alternate way to interpret or “clear up” the information.

o The media section should highlight specific features that F.A.R.M has

been mentioned in that are the most influential, and display these on the

main page of the section. This will garner interest from the reader and

cause them to want to read more about the cafe.

o Have consistency in headlines. If all headlines are to be bolded and

underlined, bold and underline every headline. Mixing up the format of the page confuses the reader and causes them to navigate away from

the page.

o Utilize more tables and bulleted lists to break up dense paragraphs. This

makes information more easily digestible and pleasing to the reader. It

also makes certain information easier to find, which is convenient for the

user.

o Hire an experienced copy editor to look over the text for errors that may have been overlooked. Even small spelling errors can cause a decrease

in professionalism and cause the organization to lose credibility.

15


Design Is there continuity between text and images on the home page and internal pages? Homepage

o The images match the text although some of them could have higher

quality to make the website more professional. o The F.A.R.M. Cafe’s cookbook picture is so blurry that the cover is

illegible. o Although the cover photo for the homepage goes with the theme of

the cafe it could be changed into an image that would peak the viewer’s interest more. A rotation of several images could make the homepage more inviting.

Menu page

o Includes nice photos of the food at the top of the page.

Events page

o This page includes pictures of flyers for an event happening in March without specifying a year which could confuse the visitor.

o The picture and link for the giving tree seems out of place on this

page.

Volunteer page

o The top of this page includes a picture of smiling volunteers which is inviting to the visitor. It could be bigger in size.

Contact page

o The page includes pictures only for two staff members which throws off the balance of the page.

16


o This is the only page displaying the map and address of F.A.R.M. cafe which could be difficult to find.

Do the links/menus and paths to get from A to B make sense as a user?

o It is easy to mistake the “media” tab which the website utilizes to store any media exposure and photos/videos for a way to get to the cafe’s social media links. This could potentially frustrate the site user.

o If the site user clicks the “media” tab, a page with 3 dead links opens

up. To actually access the material in the media tab, the user has to hover over the tab and select either “press”, “video”, or “photos” option.

o The documents tab contains different statistics about the cafe. The visitor probably does not expect that from the documents tab

therefore it would be a good idea to rename it in order to avoid confusion.

Is there consistency in the design, fonts, styles, images and colors? Are they “on brand”? Homepage

o The design is inconsistent throughout the homepage as well as the rest of the website.

o There are at least five different color fonts throughout the page.

o Font sizes and styles are inconsistent. o Some blocks of text are italicized while others are bolded. o The green parts of the logo blend in too much into the background. o The columns are not aligned.

17


o The right column of the homepage changes between center aligned text and left aligned text making it look inconsistent because they vary

in size and don’t seem to be aligned.

Media page

o The video page under the media tab seems unorganized. o Only the first video has a description which makes the page

inconsistent.

o The first video on the page is a lot bigger than the rest and is left aligned while the rest of the page is split into two columns with center aligned videos.

o The photos page has some nice high-quality pictures but their

placement is awkward and inconsistent.

Documents page

o The text seems to be a lot smaller compared to the rest of the pages on the site.

Menu page

o The menus are listed in different colors. o The middle of the page contains empty bullet points making it look

unprofessional. o The page does not seem to follow any format.

o The middle of the menu page features the giving tree, the twitter account, and a link to register for an event which happened in March of 2015 which makes the website look very unorganized.

Volunteer page

o All of the information on this page is in different fonts, sizes, and colors making it look unorganized and hard to follow.

18


Are the headers and links clear and relevant? Homepage

o Top right corner has a small dead “connect” link. o It includes descriptive links such as:

o ...Check out this article by HCPress featuring the Pariso Family Donation of $30,000 to support F.A.R.M. Cafe’s Mission

o Support F.A.R.M. Cafe o Follow F.A.R.M. Cafe on Instagram o F.A.R.M. Cafe Trip Advisor Reviews

(TripAdvisor should be one word) o F.A.R.M. Cafe Yelp Reviews o F.A.R.M. Cafe on Facebook o F.A.R.M. Cafe’s Latest Video

Media page

o The media page includes three dead links

Donate page

o The page about the renovation campaign takes the visitor to a

donation site which is now closed and the featured video is not available

Events page

o One of the event’s links is not effective because it does not provide any explanation: http://video.pbs.org/video/2365310378/

o There is a header for Indiegogo on the events page with nothing else written about it

Volunteer page

19


o The volunteer spotlight includes a link at the bottom of the page for a volunteer of the month archive which hasn’t been updated since 2013

Does the website translate across devices seamlessly?

o The site looks a lot different on an iPhone o When accessed on an iPhone, the video links under the media tab

take the visitor to Facebook which is misleading

Recommendation Summary

o Update the site to include information about upcoming events o Upload higher quality photographs and logos to increase

credibility

o Improve consistency throughout o Reorganize the media tab to avoid confusion

20


o Match the styles, fonts, and sizes of text throughout the site o Eliminate dead links/links for expired events

o Eliminate the volunteer of the month archive because it hasn’t been updated since 2013

o Improve the mobile site to make it more user-friendly

Lead Generation

What is lead generation?

o Lead generation is the consumer interest in products of a

business. F.A.R.M. cafe is a business even though they help the

community. F.A.R.M. cafe is a restaurant first and a non-profit kitchen

for the community second.

F.A.R.M. cafe is to build a healthy community by providing good meals

with local foods.

o The goal for F.A.R.M. cafe is to help the community by ending hunger in the community. One way for F.A.R.M. cafe to help the community is

providing meal tokens in exchange for working with F.A.R.M. cafe. The

token can be exchanged for one meal provided from the

restaurant. F.A.R.M. cafe has raised over $11,000 and is attempting to

reach $50,000 to stop hunger in Boone and in Watauga County as a

whole. F.A.R.M. cafe’s mission is to stop hunger, by feeding everyone.

o Roughly 20% of the Watauga population live below the poverty level

and F.A.R.M. cafe wants to decrease that percentage. Providing food

for people that need a hand is a positive way to help the community

with the issue. F.A.R.M. cafe is part of the One World Everybody Eats

21


Movement which consists of up to 30 cafes with the same mission to

help beat hunger in the United States.

o The cafe recommends for people above the poverty line to pay a little

more for their meals to help with their movement. In doing so F.A.R.M.

cafe will renovate the restaurant so the cafe can be open longer during

the day.

o The cafe is open from 11 am to 2 pm Monday through Friday. The

volunteers and people who work there want the work day to be longer

so they can help more people. Building a healthier and more nourished community is the important task F.A.R.M. cafe wants to tackle.

o Roughly one in six people do not know where their next meal will

come. F.A.R.M. cafe wants hunger to diminish in the community and

wants a better and more nourished community.

o The cafe depends deeply on donations and encourages customers to

pay a little more for their meals to help their cause and

renovations. Financially abled customers should donate money to this

cafe to help with their cause. Ending hunger is a positive way to help

the community, help local people, and F.A.R.M. café.

Recommendation Summary o Extend business hours to attract more customers and donators.

o Emphasize the problem of food insecurity to make potential customers

aware of the problem.

22


SEO Search engine optimization (SEO) is the process of maximizing the number of

visitors to a particular website by ensuring that the site appears high on the list of results returned by a search engine. We recognize that F.A.R.M. Café is a

non-profit with solely relying on organic search results. That’s why it’s so

important to get SEO right. Using SEOptimer.com, a website review and SEO

audit tool, I gathered data analytics shown below.

23


24


The number of backlinks, or incoming hyperlinks from one page to another

website, is high.

25


Source: ContentForest

26


None of the images on the website have alt tags, or image alt-text. Alt-text is

crucial for the blind and visually impaired people to tell them what is on the

image. Google places a relatively high value on alt texts to determine what is

on the image but also to determine the topic of surrounding text.

Recommendation Summary o Fix meta description tag

o Distribute keywords amongst the website

o Get an analytics tool

o Make links readable

o Add image alt text

Social Media Are social media or blog icons used on the page? Do they work?

o On the homepage, there are links to the various social media accounts,

however, they are not consistent in placement or design.

o When one first accesses the page they are met with the word “connect”

in the top right corner of the banner, parallel to the logo that one would

assume would be a link to the social media pages, but it actually has no

function.

o The actual links are spread out across the homepage, and it is difficult

to access them.

27


Are they in the best position (above the fold)? o As stated earlier, the icons are spread out across the page. The first

time one sees anything regarding social media on the page is under the

large banner photo at its bottom left corner, still below the fold.

o The only links seen here are icons for Facebook, Twitter, and an Email

Icon that you cannot tell who you are contacting until you click on it.

o As you can also see, the icons are not in differentiated by color or size

so they disappear into the green background of the rest of the

webpage.

Is there a call to action to follow on the main social channels?

o If you continue scrolling down the webpage you encounter about

halfway down the call to action that should have been higher up on the

page.

28


o Here, there is an embedded black tweet box that updates every time

@FarmCafeBoone tweets. The box itself is awkwardly place in the

middle of the page, and the tweets do not actually fit in the small space

so the viewer has to awkwardly scroll in the embedded widget to view

the message in its entirety.

o Immediately following the awkward twitter widget are other links to

connect with FARM Cafe on other social media sites. These links are

green boxes that are also not consistent in phrasing or design.

o There are four other social sites as seen below, and these again, unfortunately blend in with the rest of the homepage and are not

consistent, as they should be with the icons used earlier. The Instagram

is hidden below all other links, and the Facebook link is unnecessarily

repeated.

o The phrasing of the text based links is not consistent, as two of the four

begin as commands, and the other two are just links.

Recommendation Summary o Place Social Media icons at the top of the banner and make the word

“Connect” an actual call to action, for example, “Connect with Us!”.

This is where the social media icons should be, as this would be

easily accessible as soon as you access the page. This would also

serve to break up the massive block of green on the front page and

prevents cluttering the home page with the same social media link

multiple times.

o The links work however, and they need to be emphasized with a

different color, size, or some kind of call to action on the page that

draws the audience to those links.

29


o This box should be larger on the page, and a different color that

matches the scheme of the homepage better, that way it looks less

obtrusive on the page.

o The other icons should also be in a central location, in a brighter

color to draw your eye to the icons at first glance. o If designers would rather use a text based icon, there needs to be a

consistent call to action in the design. For Example: If you want to

say “Like us on Facebook”, there should then be a corresponding

command for each icon, like “Follow us on Twitter”, “Follow us on

Instagram”. Or under one banner of “Connect with us!”, have the

various icons. There just has to be consistency in the layout.

30


31


Results

According to SEOptimer.com, a website review and SEO audit tool, the

website earned a B, a good grade.

According to our team, the website received a score of 16 out of 25 possible

points.

32


Usability Test Participants: We recruited five participants to conduct the usability test. The selection of

users was random. In the table below, we present the details:

Each participant signed a form of consent which can be found in Appendix B

of the report.

33


Methodology The study was conducted in two parts, one on November 22, 2016 at 12:45 pm

and the second on November 29, 2016 at 12:45 pm. This separation was due

to availability of subjects for the study. Four participants completed the test on

the first date, and the final participant completed it on the second. Regardless

of the date, the test and the circumstances in which it was given in were

identical.

The test took place in Sanford Hall, Room 304. The participants were brought

into the room and given consent forms to sign (scans of these forms are located in the appendix). The researchers conducting the study then went

through the steps that we would be taking in order to gather our information,

explain the project, and how we planned to use the data that was gathered.

Each participant was partnered with a member of our research team and

taken to a separate section of the room and placed at a work section with a

computer. This was done in order to guarantee that the data collected from

each participant was unbiased and separated from the influence of the other

people performing the study.

The test given was a task-based study. We asked each participant to perform

specific assignments that would examine the usability and accessibility of the

website. These tasks are detailed in full in the “Task and Scenarios” portion of

the report.

While the task was being performed, we timed how long it took a task to be completed, took notes on specifics of the study, and created an audio

recording of the question being asked and the person being interviewed. We

34


set up an audio recorder and asked our participants to vocalize their thought

process while working so we could get a clear picture of exactly what was

easy about performing the task and what proved challenging. This all helped

to ensure that we had plenty of data to base our recommendations and

conclusions, which are detailed at the end of the report.

35


Tasks Basing on our initial research, we have formed a set of tasks that were read

and assigned to users during the test. 1. Make a donation.

2. Volunteer for work.

3. Access the social media accounts.

4. Find giving tree.

5. Find current events.

6. Find location.

7. Contact someone.

8. Look up today’s menu.

*Transcription of each test can be found in Appendix C.

Below is a chart of the time, in minutes, that it took each participant to

complete the tasks.

Task 1 tt Task 2 Task 3 Task 4 Task 5 Task 6 Task 7 Task 8

Subject 1 2.31 3.07 5.31 2.16 7.04 1.52 0.55 2.12

Subject 2 2.44 1.02 4.41 1.48 6.02 0.58 0.44 1.24

Subject 3 0.05 4.34 2.11 2.09 1.30 1.12 0.05 0.03

Subject 4 0.45 2.09 1.06 1.08 0.12 1.13 0.11 0.08

Subject 5 0.27 0.56 2.25 2.17 0.40 3.20 0.15 1.34

Average 1.10 2.22 3.03 1.80 2.98 1.51 0.26 0.96

36


Errors

o Subjects got off topic at times, which increased the length of

time it took to complete a task.

o Task 6 & 7 were on the same page of the website, which made

the times very short.

o The tasks were not planned out a reasonable time beforehand.

37


Recommendations

38


Conclusion

The audit and usability test results of farmcafe.org shows that there are severe

issues with navigation, readability, consistency, and social media. Participants

of the test experienced difficulty even when trying to complete the most

standard tasks.

The situation is difficult but can certainly be improved. Implementing the

recommendations and continuing to work with users will give us the insights

needed to continue improving your product and increasing traffic and revenue

to F.A.R.M. Café’s website.

39


Appendix A

40


41


42


43


B

44


45


46


47


48


C Subject 1 Make a donation:

• easily finds and clicks the donate button

Try to volunteer: • volunteer tab - sign up - if volunteering for an organization participation section is

confusing - weird that birth year is optional - if there is no star by the question the subject wouldn’t fill it out

Try to find their Instagram page: • Difficult to click media - photos

- media - press - menu *scrolls down* does anyone actually go that far

back? - about us - contact - home *scrolls down* - clicks “follow F.A.R.M. Cafe on

instagram”

Try to find the giving tree: • *scrolls down the homepage*

- volunteer - menu - events -donate - wish list Try to find some upcoming events

• Cannot find the events

Try to find their where F.A.R.M. Cafe is located • *scrolls down the homepage* - maybe at the bottom of the page? No

- maybe in the documents? No - *scrolls across all tabs looking for an “about us” tab - back to home – contact

Try to contact someone: • Home - contact - emails and location should be separate

Try to find today’s menu:

• Home - menu Subject 2: Make a donation

• scroll down and click on the donate button under donate to farm cafe • choose an option

49


• enter all your info, address, card number, monthly donation would you say that is clear

• very clear, very straightforward what would you change?

• not much, it’s pretty clear, maybe have your own option of how much to donate Figure out how to volunteer

• go to all the tabs at the top and click volunteer • scrolls down uncertainly • “volunteer forms” “volunteer information” which one do I click on? • It’s a little confusing at first, but there is an option to sign up today in two easy

steps, so I guess you fill out the forms o there are a lot of different choices o I guess then you’ll get an email with your username and password o and then you’ll sign in to the volunteer information center

Would you say finding this out is clear and straightforward?

• it’s a little wordy for today’s generation, but I clicked on volunteer and held the mouse over. If you hold the mouse over there is a sign up, and that is a lot clearer.

Do you think that should be the primary way to find out this information?

• yeah, just clicking on volunteer was too wordy and it had too many options to look at. Just holding the mouse and clicking sign up was more straightforward.

So, say you want to find last Thursday’s menu -- had to scroll down a while; took about a minute and a half to find

• I assume I would just go to the menu • and then archive • there are no days of the week — it just says September 20, 2016. So you would

have to go into the calendar app on your phone or your computer and figure it out.

Would you say that’s an unnecessary step?

• yeah, and this page is so long, it would be easier to have a drop down menu where you choose the date and then it would pull up what you picked. make it easier for the user. user friendly

• it’s all listed, really wordy, if it had something where you picked the date it wouldn’t be so wordy.

• And it says “check out what’s cookin’” after every one, which shouldn’t be necessary.

How would you find out how to navigate to their social media?

• tab that says media • three options: i clicked photos — oh! goes straight to Facebook without a link or

anything.

50


• it’s weird that both their photos and video portions are both Facebook. they should combine photos/video if they’re thinking something different

• press just stays on their page with a bunch of hyperlinks which i guess is fine. When you press on press, it has everything listed which is a little wordy again, I’m too lazy to look at it, there could be a more efficient way to do this — but everything is hyperlinked so that’s good, i don’t have to do any work. Everything should be updated. I clicked on a link and it said “the page you are looking for cannot be found” so i guess it expired. It is going back all the way to March 25, 2010, which is six years ago, almost seven. So it isn’t very necessary, I think. So I would suggest clicking back through the pages to make sure they are all updated. Would you say it’s pretty straightforward?

• it kind of confused me. Under photo/video you could tell that it is taking you to Facebook. Because personally when I clicked photo I thought it would be taking me to Instagram or a gallery.

• Video I thought would go to Youtube. How would you improve?

• for media you could put Facebook, and then have press articles. • get more social media for Facebook, because a lot of people don’t use Facebook

anymore. Could you look around for any other ways to access social media?

• Maybe I’m dumb? I don’t know. • oh! on the homepage, if you scroll down a bunch, there are tweets, so they have

a twitter I guess. And they have videos, UNCTV did a video on them. So that would be nice to have on press instead of searching around for it. I guess this is their most impressive stuff so they put it on the homepage, but if I’m looking just for media, ill click media, because it’s the most obvious thing. It should be there too.

• They have a cookbook? I didn’t know they had one. Aesthetically, how would you rate this site?

• personally, I’m a big fan of design — I’m the visual managing editor at the Appalachian and a graphic arts and imaging minor. I’m really into simplistic design and this is just really wordy

• all their fonts are different and different sizes, which is confusing to the eye and makes me kind of not want to read it.

• I just default look at the visuals • today’s generation, we just look at the visuals, not the words • if it was mainly photo based, with the easy tabs at the top, that would be easy. • Make the homepage less wordy — a lot of the time people don’t even look at the

homepage — they go straight to the tabs. So I’d have a really clean design and not be so wordy.

• Everything is so cluttered, which makes me want to leave. • I didn’t even notice these small social media icons

51


• it’s not necessary to have multiple tracks on the pages to do a task — it just needs to be simple.

• make the social media icons more prevalent, you know, put them at the top or something

Details about the site

• I guess home, about us, maybe? • What is farm cafe? • home should just have a bunch of photos, not all of these words — it’s just not

needed, really. So many hyperlinks everywhere. Hyperlinks are fine, but don’t put them everywhere.

Subject 3

Make a Donation

• I clicked the donate button on the home screen, and then I just select the amount, fill out my information, and that looks to be it!

• It looks really easy to use, I like that it tells you the what your donation goes to and it’s equivalency food wise.

Volunteer for Work

• Okay, so I clicked the volunteer button on the homepage, and then it’s pretty straightforward because it tells you how to sign up in two easy steps and explains the two options really well so it’s nice, and that’s before you even click the form so that’s easy.

• Oh! They have a dress code policy, a health policy, so everything is really detailed and it explains all the jobs which is useful so you don’t have to hunt down specific information anywhere else.

• It’s nice that it’s all right here. I clicked on a Volunteer Form, it looks pretty easy to fill out as well, there is a lot of questions, wow this is really in-depth.

• I like that you can choose to receive a reminder about when you are working, that’s a really cool feature.

Access Their Social Media

• Okay, so I clicked the twitter first. Is this the menu for the day? Oh they have the menu that’s really nice. That would make ordering really easy if you know in advance which is cool.

• Alright, now I’m going to their Facebook, oh wait, they have a snapchat? I wouldn’t have known that they have a snapchat until I went on the Facebook. I like that the twitter has the menus, and the Facebook has more information. It’s kind of weird that the Facebook uses more hashtags than the twitter.

• [After scrolling down the page Nichole found the Instagram.] It’s strange that the Instagram, Trip Advisor, and Yelp Reviews are separate from the rest of the links. I would have completely bypassed the Instagram, which is nice and is good for the company, but I never would have known they had it.

52


• [Nichole scrolled to the bottom of the page and found the promotional videos.] Wait what is this video for? Why is there a promo video in the bottom of the screen, it should be a main feature. I also wouldn’t know which video to click first, and if you want to feature Farm Cafe’s story this should definitely be higher up as a better media resource.

Find the Giving Tree

• Like the wish list? I went to the about us page, the community page, I’m still really not seeing it? Is the giving tree the same as the wish list? I mean the only thing I can see is that it says Giving Tree in really small letters on the tiny icon.

• Alright so I clicked on it and they sent me to an amazon wish list. There’s a bunch of items, but that’s all that I see of it on the about us page, that small icon in the corner.

• I don’t see it on the home page or the documents page which is kind of weird. I feel like having the wish list on the homepage would be a good idea, or they could at least explain exactly what the wish list is, so people know what they are donating towards.

• Overall everything on it is such a small font and small design that I just found the tree.

Find the Current Events Page - 2 seconds.

• Okay, so go to the event page. • Oh they have FARM Cafe pop up Saturdays, wait are these all past events? Has

this been updated at all? Why are they recording events in a current events section that happened in 2013?

• It would be a better idea to have an archival section separate from this because this is all very misleading. It makes it look like these events are going on and they aren’t.

• Even the old events don’t have photos or quotes from anything? Like they should have really expanded on the events more if they are going to insist on keeping these events online.

• Overall, this is just really confusing. Find Location of the Restaurant - 41 seconds

• I would go to Frequently Asked Questions, but I’m not seeing it at all. You would think that would be in there.

• I would go to the Facebook, okay so the Facebook page has the address, but that’s a really long way to go to find that.

• My first impulse would have been to scroll all the way to the bottom of the page where it would be centered in a bottom banner of some kind like normal, but there was nothing there.

• Oh I found it on the website it is on the Contact Us page. It should be on the homepage so anyone can see it. It does link you to a map here though which is kind of nice.

Contact Someone - 1 second

53


Subject 4 Make a Donation:

• I clicked the donate button on the home screen, and then I just select the amount, fill out my information, and it is pretty straight forward.

• It looks really easy to use, I like that you can select the amount I can donate.

Volunteers to Work: • I clicked the volunteer button on the homepage, it tells you how to sign up in two

easy steps and explains the steps well., . • They are pretty strict for who can work at F.A.R.M. cafe. Health codes and dress

codes are listed. • II clicked on a Volunteer Form, it looks pretty easy to fill out as well, there are a

few questions.

Access Their Social Media:

• Twitter mentions what is available on the menu for today. Easy accessible. • Facebook tells me more about what is on the menu. There is more depth and

detail on Facebook than twitter. • Not really interested in Instagram, but they have some cool pictures of what they

cook there. • The promotional video was pretty useless. Not very informative and I do not

know what the use for it is. Find the Giving Tree

• What is it and where do I find it? I found it, is it a wish list? • I clicked on it and it is an Amazon wish list. • I do not think many people come to this part of the website.

Find the Current Events Page

• It is pretty straight forward • I would use the site if I had to volunteer which is pretty easy to find • The menu is really cool too. • I think on the main page there should be a map of where to find the restaurant

Find Location of the Restaurant - 41 seconds

• I found this once I clicked on Events • Once one of the events said king street lead me to the location of the restaurant

Contact Someone

• I started to go to the bottom of the homepage, and there was nothing there • Then I go to “Home” on the menu bar and then click on contact. • After that it is straight-forward.

Details about the site (Like/Dislike)

• I think the site is useful in the sense of clarity (I can find out the menu for today and also know where to go if I want to volunteer)

54


• I was a little confused on how the Cafe tokens worked and the menu bar was a struggle (Do I click on the tab or not?)

• The site can be better, but for the sole purpose of getting their message across seems successful.

Subject 5 Make a Donation:

o Went directly to donate tab and filled out information. Try to volunteer:

o Went directly to volunteer tab, then to volunteer form. Hesitated on the participation part. Kind of confused through this part.

Find the Giving Tree:

o Found Facebook button relatively quickly, completely missed Instagram button. Went to the media tab instead which has nothing to do with social media. Asked subject her opinion on the Instagram and Facebook and she liked them both, stating that they were “colorful” and had “yummy pictures of food”.

Current Events:

o Told subject to donate to the wish list. Found it faster than other subjects who were told to find the giving tree.

Location:

o Events tab Contact someone:

o Home, scrolls down, about us, scrolls through all tabs, goes to contact button. Today’s Menu:

o Access page

Website Audit and Usability Test · 2017. 1. 3. · Website Audit and Usability Test Introduction A...

Documents

Transcript of Website Audit and Usability Test · 2017. 1. 3. · Website Audit and Usability Test Introduction A...