Actionable Tips for Starting a Website Redesign

Redesigning a webpage can be a lot easier than it seems!

Posted on July 5, 2023 in Blog Posts

Redesigning a website can seem overwhelming, especially if the current site appears to meet user needs. Perhaps this is why so many library websites remain unchanged. However, it is necessary to go through periodic upgrades, remove redundant material and improve site navigation. After completing a thoughtful redesign project, you may find that engagement with library services, resources, and branding are much improved.

Yet, meeting branding guidelines, prioritizing learning, focusing on user experience, and catering to all library professional needs can be challenging. Your library homepage is the welcome mat to your digital gathering space. Here, patrons connect with your library’s identity, resources, and services.

Consider the following questions as you assess your current site.

  1. What do users first see when they visit the library homepage?
  2. Is there a general personality that can be felt from the presented material?
  3. Does the site follow a branding design?
  4. Is the site easy to navigate?
  5. Is the site mobile friendly?
  6. What is the main purpose of the site?
  7. What are some easy improvements that can be made immediately?

Begin the redesign journey

Now that you have a general understanding of the site’s content, weaknesses and strengths, you can create a site map. A site map is a visual list of every primary page and subpage of the library website depicted in flowchart form. Each box represents a page, and each box has arrows that flow back to the library’s homepage. Consider using various flowchart tools such as Microsoft Word, Microsoft Visio, Google docs, or Canva Flowchart to achieve this goal.

An example flow chart of a library's website breaking down the site into Search, Services, Help, and About and showing all the subpages listed under these categories
An example flow chart of a library’s website

After creating the site map, identify outdated information, broken links, and redundant content. This cleanup activity will provide a fresh canvas for the redesign process, help condense duplicate information, and assist in creating the new site structure. Next, prioritize accessibility in the redesign process by making the site accessible to everyone, focusing on user experience and meeting ADA compliance guidelines. Consider the following as a starting point:

  • Lighthouse Extension: My institution’s communication department recommended this extension. Once installed, you can run a report to review the accessibility strengths and weaknesses of any site.
  • W3 Accessibility Tutorial: A free, 25-page tutorial to learn the fundamentals of accessibility.
  • Accessibility/disability services: Reach out to accessibility services at your institution for guidance and website review.
  • Library Guides Accessibility: Accessibility tools from SpringShare

Create a new website mockup

Create a design mockup of your homepage using the newly condensed site map.  This activity will employ the new cohesive design, represent your overall vision, and provide a pathway for building the new site. Be sure to include appropriate branding colors and logos. Make blocks to represent areas for important content by using a bootstrap grid technique, and draft the new navigation bar.

Tools like Microsoft Word and Canva can be helpful for this activity. Aim for a clutter-free design that aligns with the overall vision. If possible, come up with two or three designs and share them with library colleagues and institutional accessibility services.

An image showing a basic mockup of a website with areas denoting where quick links, library promotional space, and search will be.
A basic mockup of a website

Next, gather feedback to gain a general sense of the most important subpages on the site. To do this, pull user statistics from the current site, list the top ten URLs, and have willing colleagues rank them by priority. These ranked subpages will fill the new navigation bar and provide a set of quick links to serve the user.

Additionally, consider asking for critical feedback by allowing space for anonymous commentary. Embrace the feedback, even if it challenges the initial vision. When possible, consider and incorporate suggestions, but do not lose sight of your overall design concept.

Prepare timeline and acquire technology skills

Change can be difficult. Disrupting the overall appearance and navigation of a site that is used daily can cause discomfort. This is why creating, finalizing, and implementing a timeline for launch is imperative. Notify colleagues and shareholders when the new website will go live, and stick to the due date.

Now that the timeline is set and a mock-up is chosen, the hard work begins by building out the site. If SpringShare is your primary website platform, consider building in the private group area. If using another software, keep the pages private so as not to disrupt current website use.

The following selected resources will assist you to acquire new technology skills you may need:

  • W3 schools Training: W3 schools offers a variety of paid and nonpaid training for HTML and CSS.  Purchasing a basic certificate course may provide the motivation to acquire needed technology skills. Leaning on the freely available tutorials to implement different website looks will help you achieve the overall envisioned concept. 

  • Inspect Tool: Review nearby area library websites for superlative examples. Inspect the code  using the inspect tool by right clicking on any page and selecting “inspect.”

  • CodePen: Explore and experiment with code snippets shared by the community. Drop code into the area’s sandbox and see it run in real time.

  • Library Guides – CSS Tutorial: This, by far, may be the most important link for redesigning a homepage, if SpringShare is your primary library homepage host. This link provides step-by-step information on how to create a custom homepage using Groups, special CSS, and advanced customizations with Library Guides.

Next Steps

After working through the technical aspect of creating a new navbar or a new bootstrap grid for the redesigned homepage, it is time to launch. Then, see how the redesign serves the library user, continue to gather feedback, and monitor statistics to track performance. After a certain time, plan to identify areas for continued improvement by completing a website audit.

The redesign process requires careful planning, patience, assessment, and a willingness to adapt. By following these actionable tips, even those with minimal coding experience can successfully navigate the website redesign process. Remember to prioritize user experience, accessibility, and stakeholder input to create a website that serves your library community effectively.

About the author:

Virginia Cononie is the Coordinator of Research at the University of South Carolina – Upstate. Her published scholarship takes interest in scholarly communication, library funding advocacy, and marketing and outreach. At the library, she engages with students and library users at the research desk, instructs information literacy sessions and manages multiple collections. 

📅 Join Virginia for a free webinar on redesigning websites offered by the Association of South Eastern Research Libraries on August 15, 2023 at 2 PM (EST).

🔥 Sign up for LibTech Insights (LTI) new post notifications and updates.

✍️ Interested in contributing to LTI? Send an email to Deb V. at Choice with your topic idea.

GALE logo

Gale partners with librarians and educators to create positive change and outcomes for researchers and learners. The company empowers libraries to be active collaborators in the success of their institutions and communities by providing essential content that leads to discovery and knowledge, and user-friendly technology that delivers engaging learning experiences. For more information, please visit gale.com/academic

Related Posts