First, I chose the library website for Reading Public Library, where I used to work. Viewing the website now in 2019 (link to 2019 site) today, it looks very well-designed. The contact information, “we are open!” sign, directions, catalog, events, kids and teens section, “about us,” and login option are on the top bars. The focus of the page is a picture of the building celebrating a 150-year anniversary, with colorful squares giving links to community events, library events, and museum passes.
Below that are “new arrivals,” a slideshow of book covers. Below that is a short line of links to DVDs, fiction, mysteries, and more, and below that are 2018 library use infographics, library news articles with pictures. At the very bottom are the library’s hours, directions to it, an advertisement for the weekly newsletter, and quick links to what’s already on the top bar of the page. It has big images and icons with a bold blue, red, yellow and blue-gray color scheme. It also says “website by Bartlett Interactive.”
Secondly, viewing the first available version in early January in 2014 (link to 2014 snapshot), it looks more textual than visual, and is mainly beige and light blue with a little red. The hours, address, and search bar are at the top, right above the bar of events, services, etc. The events are listed in separate entries on a scrolling menu to the right, rather than being in a “find events” link like the 2019 site.
Images with links for info about the building project, genealogy sources and library news are below what once was likely the main image for the page, now sometimes blank in the snapshot. Drop-down titles of museum passes, book clubs, staff picks, survey and “ask a librarian” sections are at the bottom (along with directions, “contact us,” and a font size adjustment), some of which are not readily available on the current site. Also, the 2014 site is less eye-catching and lacks the big images and bold blue, red, yellow and blue-gray color scheme of the present iteration. This one was “powered by Wordpress.”
Thirdly, viewing the first available version in 2008—because there were no saved points/snapshots in 2009 (link to 2008 snapshot), it looks a lot more simplistic in yellows and reds (the old library building’s main colors) with large white margins. Volunteer applications and subject guides are on the right, library photos and hours are in the middle, and the catalog search bar, E-newsletter, “ask a librarian,” request/renewing online, “what’s new,” and login links are on the left.
Below that on the left are a “quick find” drop-down menu and calendar highlights. At the bottom, there are links to the library’s hours, catalog search, and requesting/renewing.
In conclusion, navigation is fairly straightforward with all 3, even though a lot of links appear in more than one place on the page. Each has pretty much the same kind of content. However, a big change is that the 2019 site drops the staff picks and “ask a librarian” options, adding instead 2018 library use statistics. Another big change is that images became more of a focus over the years, starting with a slideshow of photos as opposed to a few static ones, then becoming mostly images, along with bold color schemes and larger text in the present. Another big change is that the 2019 website adds a section under “the latest library news” that looks a lot more like the articles section of a modern online newspaper, providing online articles about wordless books, 19th century arts in Reading’s schools, advertising the free student resource LearningExpress, and advertising the “library of things,” a recent development where patrons can check out objects like Roombas, laminators, sewing machines, ukuleles, and telescopes.
Year | Aesthetic Feel | Navigation Options | Content |
---|---|---|---|
2008 | Simplistic, yellows and reds, static photos | Event calendar highlights, quick find, catalog search bar | Volunteer applications, "ask a librarian," subject guides |
2014 | Beige and light blue with a little red, more text than images | Events in scrolling menu, font size adjustment, link to building project | Staff picks, "ask a librarian," museum passes, genealogy sources |
2019 | Bold blue, red, yellow and blue-gray color scheme, big images and icons | Events in clickable square icons, top and bottom quick links to "about us" and login, text links to DVDs, fiction, mysteries, etc. | Library use infographics, museum passes, library news articles, new book slideshow |
To reflect on lab 2, I definitely had the most fun scrolling through the list of colors with fun names to pick out what color to make my background and headings. I also liked changing the font, though having more font options would be more fun. I found the most difficulty in inserting screenshots, since they have locations on my computer rather than online to start with. Inserting a table in HTML was also something new and unfamiliar, and took me a while to feel comfortable with. Overall, I learned a lot about changing the look of a webpage with HTML code, using a lot of different tags within other tags to change the look of bullet points, fonts, and colors, in addition to inserting graphics like screenshots and tables.
Link to usability test of Reading Public Library current 2019 website
Link to treemap graphics of Reading Public Library's website