There are many ways to think about web design. I like to outline the process this way:
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.
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:
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:
A visitor's experience of your website depends in part on how their individual internet access is. Thinking about your community, what is:
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.
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?):
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:
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.
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:
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:
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":
Caption: Simple Public Library home page with sections for location/hours, a link to the catalog and a highlighted event box.
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."
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: