Spring cleaning your LibGuides

I'm in the process of revamping my library's LibGuides, and I've come across a few small changes you can make to your guides that make a world a difference for design and usability. First of all, as far as headers/banners go, I am NOT a graphic designer, so I kept it simple, with just the school logo, and "Library Research Guides" in our official font. I don't recommend random images and color-fading if you're not really, really good at it. Otherwise it looks like a page for your local pre-K, coded with Microsoft Word.

old design

new design

Second, take advantage of SpringShare's excellent documentation. As a company that markets guide-creation software, they really put their money where their mouth is. Seriously, they've created a guide for pretty much everything. Here are some I found particularly useful:

• Changing your banner/adding an image map to your banner
• Customizing LibGuides CSS
• Creating a database A-Z guide with the Serials Solutions importer
• Creating search boxes for your catalog/individual databases

As the library's LibGuides admin, I'm currently building a template that all librarians can start from when creating new guides. They are free to not use it if they don't want to, but if the majority of them do use it, this will ensure some consistency across guides. It also acts as a repository for all the custom search-boxes I've built, so other librarians can pick and choose which ones they want to add to their guides.

I've also created a hidden tab (hidden from public view, that is. It's visible to anyone signed in through the admin interface.) I'm using this tab to post instructions, screenshots, and tips for guide creators. I'm also using it as a content repository for boxes I want to be available, but that don't necessarily have a logical home in the template itself (more on this in a minute...)

I've recommended that users link to boxes in the template, rather than copying them, so the template can also act as a content hub, where changes can be made in one place and pushed to all guides linking to the content. This is also why it's a good idea to import your database A-Z list into LibGuides, even if you have one on your library website. If librarians link to links in the database A-Z guide, it will automatically pull the description (which can be hidden or changed if they want) and it will allow you to make changes to database links and names in one place, that, again, will be pushed to all guides that use those links.

I've also noticed that most libraries that use LibGuides just use the default homepage options, which include a list of guides (featured, popular or recent,) a random user profile, email sign-up and/or a tag cloud. But you can choose instead to display a box from elsewhere in the site, by just entering the box id. So, on my hidden template page, I created a box of popular links (I called them "quick links") and put that on the homepage. I also replaced one of the boxes with our "help" box, that contains our various methods of contact. A good example of a nice customized LibGuides homepage is Worcester Poly's site: http://libguides.wpi.edu/

I also like how Rutgers made their homepage a complete list of guides, listed alphabetically on one tab, and by discipline on another: http://libguides.rutgers.edu/home

This is still a work-in-progress, so if anyone has any other helpful hints, please leave them in the comments!

Crappy image maps messing with my mind

Please, for the life of Brian, give adequate thought to creating image maps (images that contain multiple links, mapped to different areas of the image.) While they can be useful, and even creative, they can also be confusing. (The one in the linked Wikipedia entry is a good example of a creatively-designed image map, that has some functional issues.)

In web design, you rely on certain conventions to indicate to the user what can be clicked on (ie-a link.) If you use an image as a link, users can see the image is click-able by mousing over it, and seeing if the pointer changes from an arrow to a hand. However, if you make an image into an image map, but divide the entire image into click-able sections, it can be hard to tell the different areas of the image link to different places. You can help alleviate this problem by restricting the click-able areas to distinct areas, separated by some non-click-able space, and also by using tool-tips or title tags to describe the link hidden in that part of the image.

My motivation for this post? My own damn library's website. Check out the header on this page: http://www.library.csi.cuny.edu. It took me a moment to realize that the entire header didn't link back to our website, but also contained a link to the school's website. After much clicking and confusion, I realized that the bottom part of that image not only contains a link to the *school's* website, but also the school *system.* Now, maybe you got that at first glance, but I honestly didn't, and I highly doubt I'm the only one to make that mistake. Part of the problem is that the site was created years ago, and as I mentioned in the Harvard Library website post, alt tags are no longer rendered as tool tips by all browsers (I'm using Chrome, and they don't show up when you hover over the links in it.)

I opened the page in Dreamweaver to be able to visualize where the links were mapped to (see below,) and I can honestly say that they tried to keep the links tight to the text, but I think that the bottom two links are just too close together for it to be quickly apparent to the user that they link to two separate places.

How would I have done it? I would have probably made the "CSI" part link to the school, and the rest would link to the library. I'd probably add the "City University of New York" as a regular text link, underneath the header image, or possibly just in the footer.

Just remember when creating image maps: unless the user hovers over various areas of the image to find the links/tool tips, there is no external indicator as to what part of the image links to what (ie-you can't tell just by looking at it.) You have to rely on visual cues and web design standards to cue the user in to the fact that the image contains a.) a link and/or b.) multiple links. They may not take the time to wave their cursor across the whole image to discover just how many links there are, and what they link to.*

*Some cues that there are multiple links are:

• Scrolling over the image and noticing that the entire image is not click-able. Many developers will not bother creating an image map to insert a single link in an image, unless they have a good reason to; they'll just make the entire image the link.
• Patterns... If it's a picture of the solar system, and the first two planets are links, the user will guess that the rest of the planets are too. Same thing with maps where more than one location is linked, or groups of people where more than one person is linked. (etc, etc...)
• Added visual cues such as numbers, letters, or symbols that indicate where the user might find a link. (Example: http://www.frankmanno.com/ideas/css-imagemap/#ex)

Just one more thing...

One thing I forgot to mention in yesterday's post on Harvard's library site... They have a really sleek user feedback system. When you click on the "Tell Us" button at the top of the page, you get the following javascript pop up:

I love that it not only gives you a place to provide feedback, but also tracks and reports on known issues. This saves time for both the user, and the helpdesk, since the helpdesk is used to receiving untold numbers of reports on the same printer being broken, or the wireless being down. This system allows users to see what issues are currently being dealt with before submitting their comment. Users can also comment on or "vote up" issues without having to submit a new ticket.

I did a little snooping around in the code, and it would seem that they are using (and correct me if I'm wrong here) an online helpdesk system called UserVoice. I like not only the functionality of the software, but also the sleek way it integrates into your website, and provides a social aspect to the online helpdesk. Nicely done, all around!

Bridging the gap from Wikipedia to scholarly sources: a simple library bookmarklet

So I know I have been alluding to a fancy-shmancy "project" for awhile now, and it's finally at a point that I can show it off! Barbara Arnett and I (mostly Barbara, but I set the project in motion, so that counts for something I guess) have created a javascript bookmarklet that can be used in any browser to execute a search in Ebsco Discovery Service from any web page.

The impetus for this project was a tendency for novice researchers to rely on internet sources that may not be up to the standards required by their professors for college-level research (read: Google & Wikipedia). Unfortunately, those users were not only beginning, but ending their search with those websites, without ever trying the library’s subscription databases, or even making it to the library’s website.

Stevens is currently undergoing a trial of Ebsco Discovery Service (EDS), a federated search tool which includes the library catalog data. To make it easier for students to search the library resources, we decided to create a bookmarket that eliminates the step of having to go to the library website first before searching library resources.

The bookmarket provides an important bridge between common search behaviors (especially among undergraduates), and the "deep web" content located in library-funded, proprietary databases, thus easing their transition into scholarly research. You just drag-and-drop it into any browser, after which a search can then be initiated from any webpage the user visits. When the bookmarklet is clicked, the search terms default to the title of the page (so it works especially well with Wikipedia articles), and a prompt is displayed that allows the user to edit the terms, if so desired. When they press the OK button, the search is automatically executed in the Discovery tool and the results are displayed in a new browser window.

The bookmarklet is written in simple Javascript code, which resides on the library’s server, so it can be edited or updated without the user having to reinstall it. It works on all major browsers, and can also be edited to work with various search tools, such as specific databases, library catalogs or competing federated search tools (such as Serial Solutions’ Summon.)

A short demo:

Barbara and I will be participating in a webinar for the Metro New York Library Council in December, demonstrating various tech tools for libraries. See here for details: http://bit.ly/aYud4Q

11/19/10 - NOTE:

Ken Varnum at the University of Michigan has used our code to create an ArticlesPlus bookmarklet for their users. To make it easier for other developers to adapt our code for their projects, here it is, in its entirety. You'll have to edit it to use whatever search tool you want it to run, and change it to link to your own Google Analytics account (or just take that part out if you're not using GA), and we ask that you keep the attribution statement in there.

Thanks!

~val

Viewing e-books on an iPad

This month, my library purchased an iPad for the staff to try out. We were contemplating initiating an iPad lending program for students, and wanted to play around with one ourselves before committing to such a large purchase. A large part of the discussion about whether or not to invest in the program was if the device would work well as an e-reader for the electronic books in our collection.

With this in mind, the Web Services Librarian, Barbara Arnett, and I decided to make a little video demonstrating how various e-books in our collection display on the iPad. (This was also inspired by conversations with iPad owners on Twitter and Facebook, who did not seem to quite believe me that PDF files did not always display well within a browser.)

The following is the video we made. It's not fancy, and by no means comprehensive, but was just the best way we could find to truly convey an actual user experience with the device. Neither of us had ever used an iPad before this one, however Barbara had taken it home for the weekend, so she had a (very) little experience with it, and I have had an iPhone for over a year now, so I am familiar with Apple's touchscreen techniques.



Our findings: For most of the e-book databases, the books displayed fairly well, but the PDFs lost most, if not all, of their functionality. As far as we could tell, you could not search within them, jump to different sections or download them. For the Knovel and ProQuest databases, the PDFs did not work at all (they just opened the first page of the document, and you not view the rest of it...)

We found that you could get around this problem by going onto a regular computer or laptop, accessing the PDF through the database there, then downloading it and adding it to the Bookman app in iTunes. You then need to sync your iPad to iTunes on the computer, and you can access the full PDF through the iPad's Bookman app. This is a somewhat cumbersome process, especially since most of our e-book databases break the book into sections, so you would have to download multiple PDFs for each book (up to 20 or 30 for an entire book.)

The iPad's native e-reader app, iBooks, has a very nice display, but I'm not sure how practical it would be to build an academic e-book collection in a propriety, device-locked format...

So there you have it. I know that there's no love lost between Apple and Adobe, but it would seem to me that if you work at an academic library that licenses most of its electronic content through databases, where that content is available mainly as PDF files, Apple is going to have to work on a better browser-based PDF reader, or it pretty much kills it's usefulness for us. (Or, on the other hand, perhaps publishers will need to change how the make e-content available...)

Either way, we will not be making any large iPad purchases at this time...

Panic, Setting In...

Well, it's already two weeks into August, and I'm officially starting to freak out. I can't believe the fall semester starts in two weeks! On top of planning our library instruction sessions for the term, as well as our outreach and promotion, we just found out that we are a go on the new website, but the person who will be designing the CMS template (and so basically, the site) will be leaving at the end of September, so we need to be ready to launch by the end of August.

Wait, what?!!! You'd think with all my complaining and scheming and daydreaming that I would be ready for this by now, but when you actually start to put your ideas in motion, all sorts of problems and issues arise. Suddenly we are getting very critical of our planned navigation, and how will we deal with third and fourth-level nav, and what about server stuff, and what are our online forms coded in?! Oh, and we want to overhaul the content too, so new pages have to be created for all the first and second-level links. Yikes!!!

Some issues we've already encountered:

• What to call that pesky database page? People obviously get confused by the term (and rightly so, in my eyes.) So far we've settled on Online Resources.
• What links should go down the left-hand side of the page? These will be our main navigation, and will stay consistent on all pages, so they need to be helpful and fairly self-explanatory. (Right now we're thinking of using Research Tools, Library Services, Special Collections, About the Library, FAQ, and Contact Us.
• What size screen/resolution to design for? Too big and there will be side-scrolling, too small and there's way too much white space. We're thinking 1024x768 might be a good middle ground...

The homepage will also feature a box that gets populated from our blog, and a MeeboMe widget for IM reference.

So, yeah, I'm definitely freaking out a bit here. But alas, my dream of a site redesign is finally being realized, so the scary deadline is also a sign that we will actually get the new site we were hoping for in the foreseeable future.

If anyone has any insight on good library website design, or sites they think are particularly well-done, please send them this way, I know for a fact that I am in over my head, and would be so thankful for any tips!

Hakia: Semantic Search Engine

From ars technica:

Search engines generally don't understand either content on the Web or the content of user queries; they work through keyword analysis, link weighting, and other statistical methods that allow an engine to produce more or less relevant results without ever needing to understand the implicit question in the search query. [Hakia] recognizes the concepts that lie behind the search terms and attempts to match those rather than keywords. Read more...>>

Why My Library Should Invest in Overhauling Its Online Presence

How is it that, in today's technological atmosphere, where users expect to be able to access virtually everything online (no pun intended, but a good one nonetheless, haha...) it is such a struggle to get the administration to realize the importance of our website? Why am I practically begging for them to at least provide me some support in my effort to streamline and enhance our digital presence, and to see our website as a branch of the library, offering all services the physical branch offers?

My justification to them for such an expense? Here goes...

First and foremost, the library’s website is long overdue for an update, ideally including a redesign. Although the redesign of any website inherently carries some risks, probably the most notable of which is making major changes to a resource that is already familiar to its users, the ever-evolving nature of the internet and the emergence of web 2.0[1] concepts makes an update desirable, if not necessary. Website success can often be traced back to several important concepts, including simplicity in design, logical organization and navigation, media richness, and interactivity[2]. In that vein, the new site should be more intuitive to navigate, and organized to facilitate ease of finding information for all levels of user experience. There should be a focus on technologies enabling communication and interactivity throughout the site, and access to resources and services should be seamless[3].

The chief goals of the new site would be:

- Optimize space on homepage
- Improve navigation
- Integrate web 2.0 technology (interactability)
- Clean up content
- Improve access to resources and services

These changes would make the site more intuitive to navigate, and support users of varying levels of expertise:

- Guided navigation for new users (on homepage only)
- Logical hierarchical navigation for normal users (on left-hand side of each page)
- Quicklinks – direct to resources – for expert users (on top right of every page)

The site would also make better use of web 2.0 technology, featuring a news blog to relay important information about the library and information resources in general. The blog would be updated regularly and be featured on the library’s homepage.

A library blog can be a very useful tool for reaching all of the academic community, not just regular library users. It can be used to draw attention to information about library services and resources that might otherwise be buried in the library’s regular website content. It will also act as a witness to how active and necessary the library is, and can promote the role of the library as an information source and guide even to those not currently using “traditional” library services, by also focusing on general web resources, services and applications. In other words, the blog will seek to make the library visible to faculty and students who have “forgotten” about it.

To better reach the students, care must be taken to keep current on what technologies they are currently using, and to integrate those technologies into library services. For example, instant messaging (IM) could be for reference, and social networking software (such as Facebook and Myspace) can be used for outreach and promotion.

Some guiding questions for integrating technology into library services:

- What technologies are the students and professors already using? Let’s bring the library to them (without investing in new technology just because it’s “new and cool”)…
- Can we find a way for professors to create course/subject pages with important links, or a way for professors to contribute to our “resources by discipline” (since they are the subject-specialists)
- Is there some way to allow users in general to identify relevant resources?

Another important issue is online access to library resources and services. The library currently uses a proxy server to authenticate off-campus users, and users also have to register with the library (with their student ID number) to receive a PIN to access certain services. Ideally, they could log in with their username and password and that would provide seamless access to all library resources and services.

[1] McFedries, P. (2006). The Web, Take Two. IEEE Spectrum, 43(6), 68-68. Retrieved April 2007 from the IEEE database.

[2] Palmer, J. (2002). Web Site Usability, Design, and Performance Metrics. Information Systems Research, 13(2), 151-167. Retrieved April 2007 from the Business Source Premier database.

[3] See ACRLog: Formula for Academic Library Success (http://acrlblog.org/2007/05/14/formula-for-academic-library-success/academic-library-success/academic-library-success/)

For my super-awesome powerpoint presentation for this proposal click here.

Designing for the New Web

Ok, I am officially going crazy. The other night I was up until 3am because I couldn't stop my brain... With my library's proposed website redesign (which I am somehow in charge of, simply because I suggested that perhaps an institute of technology should not have a library website that looked like it was done in 1993...) and also my obsession with optimizing web 2.0 concepts for the new site and for our library, I just couldn't make my damn internal voice shut up! Grrr... But thankfully, tonight I am heading off to Vegas for the weekend, and I am leaving all logical, library-related thought blissfully behind.

In my absense, I leave you this post from Ellyssa Kroski at InfoTangle on designing for the new web. It is from her CIL presentation on the topic, and it put into words a lot of what I have been considering for our new site design. I think I had been absorbing all that advice from playing with web 2.0 apps, but it's really great that she put it all down in words and organized it for me :) Anyway, I attended one of Ellyssa's workshops at METRO and I'm so glad I redescovered her blog through the Library2.0 network.

If You Build It, Maybe They Will Come...

http://acrlblog.org/2007/05/14/formula-for-academic-library-success/

My library has heretofore been focusing on outreach, but my position is this, we need a user-friendly, intuitive product to promote, or all the awareness in the world is not going to help us. Users have been known to simply ignore software and apps that they find difficult to use. And facing such popular rivals as Google and Wikipedia, we can't afford to send our students elsewhere for their information.

I Dreamed a Dream...

My coworker and I were discussing online services the other day, and we decided to get all wacky, and describe the attributes of our dream academic library website. So, here goes...

1.) Authentication through username and password, NOT a proxy server that requires you to configure your browser or a VPN. I know this is not a crazy wish, just a little beyond our over-worked IT department right now (and by that I mean the university's IT dept., we don't have our own, so you can see why they're so over-worked). Once logged in, the users would not only have accesses to all online resources, but also all features of the OPAC, instead of needing a separate PIN number, like they do now.

2.) One interface. Uno. Un. Solamente. Dream big, right? The interface would be Ebscohost-like, for no other reason than I like that particular interface. Through this interface, students can access our books, books elsewhere, e-books, journals, journal articles, newspapers/articles, etc. etc. They would be able to customize their search through a series of checkboxes that allowed them to choose which databases they wanted to search, and/or what kind of results they wanted (what format/media, that is).

The results would be sorted not by database (unless they wanted them that way), but by format (I'm sure most users don't care what database the journal article is contained in, so why not put all the journal articles together in the results, thereby allowing for sorting across all of them, and eliminating duplication?)

This interface would also contain links or buttons that allowed students to immediately request an item through ILL/DDS directly from the record (like in WorldCat). For requests that require a fee, students would be given an option to immediately charge their student account (or credit card or whatever...) In the case of requested articles, once the fee is paid, the PDF is immediately e-mailed to the user (one of the complaints we get most often is from users wanting immediate access to articles... No big surprise there.)

You'll note here that I am not a propronent of a simple, Google-like interface that searches everything. I know that such an interface as I propose would be very complicated, and have a steep learning curve, but it would be so much easier to teach only one interface in our library instruction sessions than 5, or 12, or 20... and it would be so much more useful if the user had control over what they were searching in, what they were searching for, and how they wanted their results displayed/sorted.

I'm definitely not techie enough to know just how much of this is currently possible, but I am internet-obsessed enough to know that this is what users will come to expect, and hopefully the direction we are going in.