Skip to Main Content

Creating a simple library website (2021)

Use these resources to build a simple, easy to maintain, website for your library.

Overview of Design Process

There are many ways to think about web design. I like to outline the process this way:

  1. Determine your audience.
  2. Think about your audience's infrastructure.
  3. Think about what information your audience really needs.
  4. Think about what activities your audience want to do on your website.
  5. Wireframe your website.
  6. Start writing your web content, remembering that writing for the web is different than writing for print.

From the beginning of your website, keep accessibility in mind. The key idea in accessibility is that EVERYONE should be able to use your website to find what they need. Your website should be at least as inclusive as your building is.

Who is Your Audience?

Resist the natural library inclination to declare EVERYONE your audience. A website that is focused on no one in particular is unlikely to get used much. Thinking about your service population, consider which of these subsets you might want to focus on:

  • Frequent visitors
  • Students
  • Ebook nerds
  • Young families
  • Job seekers
  • Small business people
  • Retirees

The above is just a list to get you to consider possible audiences. It may be possible to focus a website on several audiences, but try not to let that creep back into the EVERYONE way of thinking that will dilute the usefulness of your website. Below are a few resources that might help you define your potential audience further:

What is Your Audience's Infrastructure?

A visitor's experience of your website depends in part on how their individual internet access is. Thinking about your community, what is:

  • The average download speed of a home or a mobile connection in your community?
  • What proportion of your community's internet users have data caps?
    • Data caps come in two flavors - hard and soft. A hard data cap either stops a subscribers's internet entirely or starts charging you for extra data. A soft data cap is where a subscribers connection is throttled (slowed down), in some cases down to near dial-up speeds. Exceeding either kind of cap makes for a bad day if it's your data plan.
  • What proportion of your community primarily accesses the internet through a phone or other small mobile device?

Generally speaking, the more high resolution photos, animations and videos you feature on your website, the slower and more frustrating your visitors' experience will be.

If you know that a large portion of your visitors primarily visit with a mobile device, it is extremely important that the most important information appears on the tops of your web pages. People may not swipe further down to see your content if they don't see a reason to. 

What Information Does Your Audience REALLY need?

Name of School is the one thing users can find.

Photo credit -  This XKCD comic is licensed under a Creative Commons Attribution-NonCommercial 2.5 License. Source:  https://xkcd.com/773/

You want to highlight your library and EVERYTHING you have to offer. Your users are coming to find information and to carry out tasks. Give them what they want, not what you hope they will want. 

Although much of your content will depend on the audience the website serves, according to library technologist and web designer Laura Solomon, there are a few key things that should be on any library website:

In these pandemic times, I'd also suggest adding any service limitations during public emergencies like the pandemic or other natural or human-caused disasters.

Here are a few suggestions for content based on audiences (which you have narrowed down and/or ranked, right?):

For more on what should be on websites

What Does Your Audience Want to Do on Your Website?

To the extent you can arrange it, help your patrons with the library tasks they want to do? While the best approach is to ask them and then see if it is possible, here are a few ideas:

  • Access their library account.
  • Search your catalog
  • Book meeting rooms (when open)
  • Register for in-person or virtual events

As always though, focus your offerings on your audience and try to offer the essentials and no more. In the web world, less is often more. 

Keep Accessibility in Mind

Before we get to wireframing, the first part of building a website, we need to talk a bit about accessibility. Web accessibility means that people with disabilities can use the web equally. Or, to put it another way, EVERYONE should be able to use your library website equally. For a quick intro to some of the basic concepts below, check out the first 1:10 of the four minute video below. 

As the above video indicates, when you design and build websites to be accessibility you are benefiting ALL of your users because all of us can find accessible features useful in some contexts. As some advocates say, "Accessibility - Essential for some, useful for all."

Three more reasons to make your web sites accessible:

Four easy accessibility wins

  • Every page has a distinct title.
  • Every page should stay readable when text size is increased.
  • Every page should have enough color contrast for EVERYONE to see.
  • Every picture has a meaningful “alt text” or “” if a decorative figure.

For more on accessibility

 

Wireframe Your Website

You've figured out your audience. You have some idea of their home tech environments and educated guesses about what information they'd like to find and what they'd like to do. You have some basic knowledge about accessibility. Now you're ready to start building your website!

A number of web designers recommend using a wireframe. A wireframe is a simple drawing of your website pages with no design elements that can include these types of pages:

  • Home page - The page that states the purpose of the website and links to top categories and tasks.
  • Category - Your top level links (Services, Events, Resources, etc)
  • Detail (Optional) - A page for a specific service or resource. 

If you're not sure what I mean, open up the presentation on the left hand side of this guide and skip to the "Wireframing" section. 

Wireframes can be done with software, but they can just be sketched out on paper like I did with the "Sample Public Library":

Wireframe of web home page

Caption: Simple Public Library home page with sections for location/hours, a link to the catalog and a highlighted event box. 

Wireframe of web category page.

Caption: Resources page of the Simple Public Library with ebooks, homework help and research links, plus a footer with location, hours and contact. 

For more information and suggestions on wireframing, visit envatotuts+' September 2020 article, A beginner's guide to wireframing."

 

Start Writing Your Content

Once your wireframe is done, you can start writing content and choosing images using your favorite website builder/web authoring tool.

Some research shows that the amount of text on web pages, should be about half of what's in printed publications. In writing your web pages, consider using:

  • Short words
  • Short sentences
  • Short paragraphs that tell the user what the page can do for them

Resources on writing for the web