Document 16930127

advertisement
Spring 2015, IS 598, Web Design
Report on revising the Jefferson County Public Library System’s Website
Anjanae Brueland, Ryan Congdon, Mary Rayme, Angela West
For our final project for this class, we decided to redesign Group 2 Assignment two’s
website, now relocated to www.web.utk.edu~awest. In that assignment the overall objective
was to present the Jefferson County Public Library System (JCPLS) as a unified system,
starting the educational process that the four county libraries are connected and support
each other. The actual JCPLS website is:
http://www.jeffcountylibraries.org/jefferson/
Analyzing this site, Group 1 was quick to identify that outside of the homepage it looked like
four separate websites. For example, the site required the user to visit four different
locations if the user wanted to know the hours at each location. A minimum of eight clicks
was required to meet this information need. So for Assignment Two, the focus was on bring
similar features together.
For this Assignment, Group 1 met, and a group member asked that the Assignment two site
be considered as she was able to perform usability testing on this site and would like
another opportunity to improve on the site prior to sharing the site with follow directors and
possibly, the library board. Realizing that this assignment had the potential to improve a
library’s perception within the community, Group 1 accepted the suggestion.
Group 1’s redesign is located at http://www.jeffcountylibrary.org/
Top Five Usability Issues with Website For Redesign
1. The Look and Feel of the site - More Photos For Visual Appeal
In evaluating the site, we all found it rather generic and in need of some supplemental
information and photographs. The Usability Testing performed in Assignment three on this
site confirmed Group 1’s assessment. It was also identified that terminology such as
“Homework Help” needed to be easily accessible which would then redirect the user to a
resources logo. Information was reorganized to increase accessibility and usability.
2. The Layout of the Site
Some of the pages were formatted as one long page while others were divided up into a
grid. This inconsistency in format was confusing visually for the user and gave users (Group
1 members) the impression of a lower standard of professionalism and attention to detail. It
also raised doubt in the user as to whether or not their information would be found here. We
decided that we prefered the gridded structure of images and text as it gave the site
organization and a pleasing visual rhythm.
3. The Color Scheme
We changed the font color from a sage green to black for readability. While the sage green
font was readable, combined with a light purple accent font the color scheme lacked in
contrast for easy readability. We chose a blue and teal color scheme with a clean, white
background as a way to provide a color palette that is pleasing to most.
4. The Organization of the Content
We also evaluated the site in terms of what we viewed as essential elements of a welldesigned website: the logo, colors, branding, format, and footer. This was accomplished
by the creation of an external style sheet, global navigation tabs and a consistent footer on
every page. It was also agreed that text should be matched with an image as much as
possible and where appropriate.
5. The Write-up of the Content
Tabs represented similar areas of services, resources, etc., for each library. The home
page slider would be the place for the visual promotions of what is happening at the
library. The events page allowed the user to gather all activities taking place throughout the
system. Content was added to the website to provide more information for users as well as
for SEO optimization.
Why did you choose these issues as Top 5?
Group 1 derived the Top 5 issues based on the website analysis and the usability studies of
Assignment 3. Each issue was a distraction to the successfully completion of meeting the
user’s information need.
What Did We Like About the Old Site?
When viewing the Assignment two version of the JCPLS website, we all agreed that we
liked the overall layout. The tabs above the main content area organized the information
very well and divided the website into several intuitive, compartmentalized sections. We
also liked the logos simplicity and basic design. The stylized book image created a fluid,
recognizable symbol that was modern and sleek. The website was, for the most part, well
organized and easy to navigate. Although some pages needed a different layout, they
generally had all of the information together and in one place.
We also liked the inclusion of several social media links (Facebook, YouTube, Pinterest,
and Instagram). This helps link the website to a much larger community of users and
increases usability by allowing others to connect to the library via social media.
What Did We Want To Change and Why?
One of the biggest problems with the original design of the website was the emphasis on
text, which led to a lack of graphics and other visuals/multimedia. More graphics would
give the viewer’s eyes a rest as they scan the web page. Studies have shown that people
tend to prefer images over text, and that “37% of the population are visual learners.” (Idler,
2012) Studies have also shown that 90% of the information processed in our brains is
visual, therefore a website that features a balanced use of images and graphics can be
more effective than text alone. (Customer Magnetism, 2015)
We also decided that we didn’t like the sage green color scheme of the original site. By
making the background colors white and lighter blue, it gives the website a much more
open, airy appearance. Many of the biggest websites online, such as Paypal, Facebook,
Twitter, and Skype, use a blue color scheme. According to studies, blue conveys a sense
of calmness and serenity, which in turn cultivates trust among web users. (J. Smith,
2014.)
The black-and-white book pages logo for the JCPLS site seemed a bit rough and sketchy,
so it was redrawn in PhotoShop with updated colors of green and blue, reflecting the
beautiful landscape of the region. The logo was also redrawn to be more horizontal to better
accommodate that format. Location is also included with the logo and the addition of USA
as a way to include the library in the global marketplace.
Logo - Before
Logo - After
Methodology - How Did We Proceed?
Collaboration was accomplished through the use of Google Hangouts to meet, chat and
screen share. The Google Docs apps were used to build a wireframe and assist in the
divvying up of responsibilities. The Jefferson County Public Library System website was
selected, as it was a Group member’s Assignment 2 and from the usability studies of
Assignment 3, had room for improvement. It also meant that we had the opportunity to work
on a meaningful project for a classmate, that had a real world impact.
This Assignment requires the redesign of a website and so changes were made by applying
the findings for the usability studies, and the opportunity to compare between the very
crowded and complicated website of www.jeffcountylibraries.org to the overly parred down
Assignment 2 version www.web.utk~awest, and finally, this groups analysis of that site.
Creating an Excel spreadsheet, Group 1 analyzed each page discussing the likes, dislikes
and overall purpose of the information being shared or assigned to that page. Group 1
reviewed other websites like: Chattanooga Public Library website www.chattlibrary.org and
Lonesome Pine Regional Library http://lonesomepine.boundless.ly/ to convey the ideas and
features of sites and to clarify. From there, Group 1 members selected the pages that they
were interested in working on.
CPanel is the web hosting control panel used for this assignment. It was selected as
Assignment Two was completed on this interface and each member felt on review of the
interface that it would be easy to use. A web hosting control panel ‘is a web-based interface
provided by the hosting company that allows customers to manage their various hosted
services in a single place (Wikipedia, 2015).’
What Challenges Did We Face?
Perhaps the biggest challenge faced in this project was for four people to talk about a visual
problem remotely and not in the same room. We also agreed that it is also difficult to have a
website that represents four different libraries, where the libraries acted
independently. Group 1 would recommend that the Jefferson County Public Library System
recognize the opportunities in being part of a system and begin to make changes in
branding and marketing their System.
We faced challenges in pulling together photographs of the libraries and the librarians.
We faced a formatting issue in that we wanted to organize the pages into a more gridded
structure so that users don’t have to scroll down a page to get all the information. The grid
system on a page gives organization and structure that this site really needed.
Front Page - Before
Front Page - After
Before & After Conclusions
Through much trial and error and discussion, we came to find visual, verbal, and
html solutions that brought the whole website to a meaningful and satisfying
design. Usability tests applied to the redesign of the JCPLS site reveal far fewer
mouse clicks to get to information and fewer pages to dig through. Perhaps the
greatest change to the website is the overall visual appeal. A new format added to
the various pages provides an easier to navigate website organized in a grid.
Photos of staff members, particularly on the About Us page (see below), help to
put a human face on this vital public library system. The cleaner, more elegant
overall design creates an updated professional and pleasing image for the
Jefferson County Public Library System.
About Us page - Before
About Us page - After
At about 1,500 words...5/1
References
Smith, Jeremy. "How to Use the Psychology of Color to Increase Website Conversions."
How to Use the Psychology of Color to Increase Website Conversions. N.p., 1 Apr. 2014.
Web. 28 Apr. 2015.
Wikipedia. (2015, January 7). Web Hosting Control Panel. Retrieved from Wikipedia:
http://en.wikipedia.org/wiki/Web_hosting_control_panel
Download