Web Design

Internet Librarian 2011: 20 steps to better web services

by David Lee King on October 17, 2011

Sarah Houghton – librarianinblack.net

#1 – where to put your websites.

WordPress. Blogger. Drupal – not really where your website goes… Squarespace – not free, but cheap.

#2 – images.

Gimp. Image editing program.
picasa – edit and host images.
Picnik – simple editing that most people need. Connected to Flickr
Flickr – great place to host, find cc-licensed photos
Pictobrowser – great slideshow for images
Openphoto – free images – high quality

#3 – hot topics

Addictomatic – info gathering place Sarah’s library used this for a local city emergency

#4 – make ur codez priteez

Beautify JavaScript – helps make code pretty – also CSS beautify

#5 – surveys and polls

Google forms – simple and easy
Polldaddy – easy polling

#6 – slider

Wow slider – web based image rotator/slider

#7 – translate

Google translate – easy, adequate.

#8 – remote assistance

Log me in (logmein) – remote access to your pc or Mac – there’s a free version. This is a very quick tool. I sends an email asking for permission to access the other persons computer

#9 – wireframing

Balsamiq – gives pre-made parts and pieces

Wow – 40% of Sarah’s library web traffic is mobile

#10 – testing your mobile stuff

W3c mobileOK Checker

#11 – stats

Google analytics

#12 – Skype

Great place to talk to users, to staff, etc

#13 – social management

Tweetdeck
Namechk – searches dozens of sites to find names that you can use

#14 – webcasts
Slideshares zipcast – works great.

#15 – video

Jaycut – browser based editing tool
YouTube – they have online editing too
Animato
Xtranormal

#16 – audio

Audacity
Podbean – great place to host audio

#17 – learning environments

Moodle

#18 – infographics

Visual.ly

#19 – librarything

#20 – the google

Google plus has some potentially cool stuff…

Helios – from the audience
Cheap calendar … ?

Tagged as: , , , ,

1 comment

Copying Other Websites During a Redesign

by David Lee King on September 16, 2011

During my library’s last website redesign, we went through quite a few design iterations, and we still weren’t happy. Two people in our Creative Group team (more on that in the next post) … ok, our head of marketing and the deputy director … kept sending us website examples they liked. Sites like shoe stores or clothing shops. Yes, they were beautiful websites, and nicely designed. But they weren’t really all that similar to a library website.

One big difference – these attractive websites did one thing well – they sold shoes or clothes. They didn’t have any catalog to speak of. The websites were full of single pages that pointed to single items.

But a library website has at least two basic needs – a site that talks about the library, and shares useful stuff. And we have a library catalog. So it didn’t really make much sense to me to base our library website design around a site that only does half of what we do.

So I started poking around, looking for websites that focus on two things:

  1. stuff, like a storefront.
  2. a “catalog” of some sort.

Amazon and Zappos? Pretty much all catalog. News sites? Pretty much large multi-blog sites – focusing on stuff. Then it dawned on me – library websites are like Apple. Apple essentially has two separate websites – the main site that focuses on their stuff, and their “catalog” – their online store.

We based our redesign around Apple, in these ways:

  • Top horizontal navigation with drop down menus. We also found some “nav bar inspiration” at NPR’s website.
  • Focusing on a single large ad, then a couple of smaller ones, then more detailed content below that – based on many of Apple’s pages. This directs customers to a few things that you REALLY WANT THEM TO DO, while still having easy access to everything else.
  • A prominent link to the store. That’s where you’d click “Find Stuff” to get to our three catalogs (catalog, digital downloads catalog, and DVD dispenser catalog).

So far, it’s working out great – few complaints, lots of compliments. Our public trainers have told us they cut down training on how to use our website from an hour to 10-15 minutes. Fingers crossed that it stays that way for a while!

Tagged as: , , , , , ,

1 comment

Three Questions every webpage should answer, #3: Why should I care?

by David Lee King on August 26, 2011

Why Should I Care?

One more question every webpage should answer – #3: “Why should I care?”

This one comes from my library’s Executive Director, Gina Millsap. Another way to ask this question is “Why would I want to do that?” or “What’s in it for me?”

This is where your PR, marketing and promotion skills come into play. Why? Because you need to sell your content to your customers.

Selling? I hate selling – I’m a librarian, for peet’s sake!

Yep – I get that. But just putting information about something up on a website doesn’t mean people will attend that event, read that blog post, or check out that book. Sometimes we need to go a bit further, and work on convincing our customers to take those next actions I talked about in my last post.

The goal on a website is to move people from point A to point B – from reading a book review to actually checking out the book, for example. This isn’t selling as in “smarmy used-car salesman” selling … but it IS a form of selling, and a good organization learns to do this – on posters, in person, and even on our websites.

Answering “why” can be as simple as a brief explanation on why something is useful. For example – why should I apply for a library card? Because you get to read all your favorite books, and check out movies … for free! And you have already paid for it anyway (via taxes).

Look around your website, and see if you are answering the “why should I care” question. If not – rework your content so this question is answered up-front and often.

Tagged as: , , , , ,

1 comment

Three Questions every webpage should answer, #1: What can I do here?

by David Lee King on August 22, 2011

Question #1Ever visited a webpage, then looked around, wondering “what can I do here?”

If you have … that web designer failed!

I think every webpage should answer the question “what can I do here?” either visually, or by spelling it out:

  • Visually: design in such a way that the stuff you can do on a page, like clicking a button, filling in a text box, or even just reading or watching content, is extremely noticeable. Amazon does this by using complimentary colors that “pop” out on the page. They often use blue as a header or sidebar color, but the buttons they really want you to see (ie, the “buy now” button) are orange – a complimentary color.
  • Spelling it out: Use words, colors, graphics, etc to “spell it out” for people – tell or show website visitors what to do on the page. For example, we try to do this at my library’s website. The main page directs people to “Get a Library Card,” “Donate Now,” “Find Stuff,” “Ask a Librarian,” or Subscribe to our blog posts. People know what to do on our site, because we direct them.

On your library’s website, do people know “What can I do here” when they visit the main page? How about the catalog page, the “you didn’t find anything” page, or on your blog? At the comment box? On your Facebook Page even?

Think about it … and make sure to answer the question “What can I do here?”

Tagged as: , , , , , ,

2 comments

Is the Web Modern Yet?

by David Lee King on August 16, 2011

Today’s web is the “modern web” – css, HTML5 coming soon, websites designed with grids, lots of functionality. Yes-sirree, this is the modern web.

Just like this was a modern car:

This “modern car” could’t move fast enough for today’s modern highways (top speeds of 40-45 mph), wasn’t automatic, and didn’t have a/c, radio, or an iPod hookup. Or windows, for that matter. But I’m guessing that to the buyer back then, it was a pretty modern car, and a major change for them. They had to figure out the details of the change – i.e., what should we do with Bessie the horse? Where do we park it? Where do we get gas? How do we maintain it?

My point? That’s where the web is today – roughly 20 years after the first web page went online, we have today’s “modern” web. It certainly looks pretty modern to us, much like those cars from 1927 probably looked to the buyer.

Guess what? Much like that Model T … I don’t think we’re done yet. With websites or with libraries.

Car photo from Wikipedia

Tagged as: , , , ,

1 comment

Answer these Questions for your Website

by David Lee King on November 2, 2010

We’re in the midst of a website redesign for our library. As we start looking at content, links, buttons, headings, etc – stuff like that – you know what we’re thinking?

We’re thinking this: does this link/content/heading/etc answer these questions for our customers?

  • What can I do here?
  • What can I do next?
  • Why should I care?

Answering these are really hard! Think about it for a sec – take a pretty normal link, like the library web designer’s favorite – “Library Databases.” Answering that “what can I do here” question certainly gets into how you label that section of your website (’cause we all know that “Library Databases” means nothing). Perhaps something like “Find articles” or “do some research” might work better?

Or think about a blog post – answering the “what can I do next” question can be as easy as linking to a set of related articles, topics, or even related books at the end of the post. I do this on my blog – when you’re reading it on the actual website, when you finish reading the article, you’ll see a list of related blog posts I wrote. What’s this get you? Website visitors staying on your site for longer amounts of time. More clicks. Hopefully, more conversions – more people clicking “attend this event” or checking out a book, etc.

“Why should I care” is a favorite one of our library director, and it’s probably the hardest of the three questions to answer. One way to do this is in the content itself. So your first couple of questions get the customer to your content … and then your content itself will need to answer that “why should I care” thing.

The answer could be any number of things, ranging from “because you can borrow it for free” to “because you’re a small business owner, and these resources will help you be profitable.” See where I’m going with this? Another way to say “why should I care” is to ask “what’s in it for me” or “why is this interesting?” Give them that reason.

Give your customers a reason to stay on your site by having great content AND by actually telling them why they might want to stay. Do that, and my guess is that … they actually WILL stay on your site – your digital banch – longer, doing more things.

Could be a good thing!

pic by Marco Bellucci

Tagged as: , , , , , ,

2 comments

Building the Digital Branch – A Webinar for ALA Techsource

by David Lee King on August 4, 2010

Building the Digital Branch: Designing Effective Library Websites

View more presentations from David King.

Yesterday, I gave a webinar for the ALA Techsource folks on building digital branches … and here are my slides for that.

Enjoy!

Update – Slideshare was having problems when I posted this, so I deleted the slideshare version and started over. This time, it works. Yay!

Tagged as: , , , , , ,

9 comments

Does your Website Look Professional?

by David Lee King on May 11, 2010

Would you buy a house from this business? I giggle every time I drive past this sign. It’s in the new construction part of my subdivision. Yes, you read it right – “Hack’s Quality Custom Homes.” Hack’s … as in hacked together. Definitely NOT a name that inspires trust OR quality, to me anyway!

But the sign made me think – how does your organization’s website look? Does it look professional, or does it look like “Hack’s Quality Websites” built it?

Here’s something fun to do – browse through a list of libraries in your state, and poke around on their websites for a bit. If your state is anything like mine, you’ll find some nicely-designed library websites, and many others that … well …  come up a bit lacking.

And I know why:

  • Some libraries, especially small ones, don’t hire web managers. They possibly can’t afford that position, so they have someone on staff do the web stuff as a small part of their many job duties, whether or not they actually have web skills.
  • Some web managers have more of an IT/Technical background rather than an online/web background. It’s really two different skill sets, though both are related to technology.
  • Some libraries simply haven’t yet prioritized their web services. Or it is a priority but there’s not much planning involved. Instead, they keep tacking new things onto an outdated website.

My point? I think this needs to change. If the front door of your physical building were broken, maybe creaky or even coming off its hinges, you’d fix it. No one wants the main entrance of their business/organization to not work right! It gives people a lasting impression … and not a good one, either.

Guess what? Your website is one of the front doors to your library. For many of us, it’s broken. We need to get it fixed! And not by Hack’s Quality Websites, either. Your website doesn’t have to be the most amazing thing they’ve ever seen on the web … but it DOES have to have all the basics, it should be attractive and balanced visually (or at least not be ugly), and shouldn’t cause anyone to stumble.

I think we can do better. I know my library can (which is why we’re redesigning again). I’m certain your library can do better, too. Even if you have little or no dedicated web staff. If you’re small, what can you do? Here are some ideas for starters:

  • Goals come first – figure out what you want your organization’s website to be/do, then work backwards from there
  • Can’t hire? Why not partner – with local ad agencies, with a local media organization, or even with a local school/college.
  • In a regional cooperative/consortium? It’s possible they can help.
  • Start learning! You probably have HTML and basic web-building books – it’s never too late to start learning a new skill.
  • Use a free design template, rather than designing from scratch. In fact, take this time to make your website blog-based, as well. Then it will be easy to update, as well.

What else? Anyone have other suggestions? Please share!

Tagged as: , ,

17 comments

Showing Patrons the Door

by David Lee King on February 3, 2010

First, a funny story. When I lived in Nashville, I frequented a cool used record store. During one trip, I was trying to decide whether or not to buy a couple of old jazz cassette tapes (hey – I was on a tight budget).

The tiny shelf these cassette tapes were on was packed WAY too tightly, so when I tried to pull one cassette out to examine it, 2-3 others would fall out at the same time. And make lots of noise as they hit the floor (it was tile, of course). This happened a couple of times … in a row … and was pretty embarrassing!

So – to ease my embarrassment at not being able to figure out how to successfully pull a cassette tape off the shelf, a “helpful” shop security guard came over to me. He stood behind me, stared at me for a second, and said (and I quote) – “you’ve got 10 minutes, then you’d better be out of my store.” Then he walked away.

Boy, that helped. Thanks :-) That day, the store essentially “showed me the door” in no uncertain terms. Even though the problem wasn’t me – it was their tightly-packed shelf.

Now on to the title of this post, and to my point. Showing patrons the door? Yikes – we’d never do that (under normal circumstances, anyway)! Unlike the silly used record shop, librarians would never consciously walk up to a patron and tell them to leave if that patron was having trouble using something in the library … right?

I think we DO sometimes tell our patrons to leave when we make things difficult for them. We might as well be saying “here’s the door, don’t let it hit you on the way out.”

For example, if your library has a blog, do you moderate those comments? Quickly? I know of libraries that can go 1-2 weeks before they get around to moderating comments. In and of itself, moderating a comment is fine, as long as they are moderated fast (like within 1-4 hours). Blog posts are supposed to be the start of a conversation; comments continue that conversation. If those comments aren’t approved at least in the same day, you have essentially killed that conversation. To me, that sounds like showing patrons the door.

Is your website confusing? Do customers have to puzzle out what they need to do next while on your site? If so … your website is showing patrons the door. Same with our catalogs – a confusing catalog might just steer customers away from checking stuff out – and that’s one of our major, must-have services!

Do you let patrons sign up for a library card online (some libraries don’t)? How about having an online sign-up form that asks for WAY too much info? That’s a sure-fire way to show patrons the door.

What labels and naming schemes do you use on your site? Using heavy-duty librarian jargon might just be a great way to usher patrons towards the door.

How about not having a Facebook Page (or even blocking Facebook altogether)? Or simply doubting that your patrons use Facebook (without actually signing up for a Facebook account and checking)? Yet another way to show a group of very active, involved patrons the door.

Other ways to show patrons the door might include hard to find stuff on your website, hidden content, or even library services that aren’t mentioned anywhere on your website.

So – what do you think? What else shows patrons the door, and how can we fix that?

Pic by Cayusa

Tagged as: , , , ,

12 comments

Time to Update?

by David Lee King on December 8, 2009

Ever seen a library website that had many of the “normal things” in place, like the library catalog, a handy database link, and an easy way to ask questions … but the people in charge of the site had obviously forgotten to update some of the “little details?”

Here’s what I mean – take a peek at these two screenshots. Here’s the first one:

don't do this!

The “site best viewed with…” statement has a problem or two. First of all, it’s simply not true – I was viewing it FINE using Firefox on a much larger resolution.

Secondly (if the statement’s true), it makes “visiting the library” much harder for a pretty significant chunk of people. For example, at my library’s website, 68% of our web visitors use some form of IE – but that’s most likely weighted, since our 177 public PCs have IE installed, and everyone hits our website upon opening the browser. On my blog, only about 30% of you are using IE… again most likely skewed a bit, since y’all are amazing people who know your stuff (and like to use Chrome, Safari, Firefox, etc, etc, etc).

My point? If you design for one browser, you are in essence making the digital library visit harder for 30-50% of your customers. Would you do that with your physical library? Like make all the doorways 5ft 8 in high, so anyone taller than that would either have to stoop to go through (or would bump their heads) … and then put up signs that say “Library Best Entered by people under 5′ 8″ tall?” I’m guessing not.

[And one other tiny little thing here - if you don't want people to email reference questions to the web email address... don't put the address on the page. Just funnel everything through the large "Contact Us" link, and call it good.]

And one more very similar problem (sorry for the tiny text! Click the pic to see a larger version):

don't do this!

Same stuff, but worse:

  • There is no Netscape Communicator anymore
  • Copyright 2002-2007? What happened to 2008 and 2009?
  • 4.x browsers and above?

I’m guessing the main problem is that the footer has been ignored for at least 3 years, probably longer.

Why bring this up? It’s probably a good idea to check on those little hidden details of your website every so often. Do they still make sense? Does it still hold true? Is it even necessary? Think about it … and edit as needed.

Tagged as: , , ,

8 comments

← Previous Entries