Subscribe to THE LATEST

Website redesign checklist: the 11 crucial steps you need to be successful

Website redesign checklist: the 11 crucial steps you need to be successful Blog Feature

Joe Rinaldi

UX Designer, HubSpot Design & GDD Certified, Designer for 70+ Sites for HubSpot and Various CMSs

October 8th, 2020 min read

Editor's Note: This article was originally published in May of 2017 by Vin Gaeta. It has been fully revised and update to reflect current website redesign best practices and processes.

“Website redesign.”

Two words that can make even the most veteran of marketers shudder.

When done right, a website redesign can improve the experience people have on your website and turn it into one of your most valuable sales tools. 

However, when corners are cut and steps are skipped, a website redesign can easily go off the rails costing your company valuable time, effort, and ultimately end up doing more harm than good to your marketing efforts.

But don’t let these high stakes scare you. 

With proper planning, research, and a little foresight, you can make your next redesign a huge success, and avoid any unnecessary stress. 

That’s exactly why I compiled this 11-step website redesign checklist to help set you and your team up for success. 

Before we dive in, a website redesign is a big commitment, so let’s talk about how to tell if it’s time for a website redesign.

How do you tell if it’s time for a website redesign?

Before investing valuable company resources into a redesign, you need to make sure you’re redesigning your site for the right reasons. While there are a lot of good reasons to redesign your site, there are also a lot of bad ones. 

Issues such as “I just don’t like our website anymore,” or “Our competitor just redesigned their site,” are poor reasons for a redesign.

If your site effectively attracts visitors and converts leads, there’s no reason to change it. Let your analytics be the judge rather than your own subjective opinion.

 Instead, ask yourself questions like:

  • Is our site currently mobile optimized?
  • Have our business goals changed since we last launched our site?
  • Is our branding on our current website outdated?
  • Does our website function properly?
  • Are we converting leads on our website?

Based on your answers to these questions, you should get a good idea of whether or not it’s time for a redesign.

(These questions also lay the foundation for when it comes time to setting your goals for a redesign project which we’ll dive into later.)

Assuming all signs do point to a redesign, here are the 11 crucial steps you need to take. 

Step 1: Establish your dedicated team of stakeholders

Before any website redesign discussions can happen, you need to assemble a website task force (or simply a “website team” but that doesn’t sound quite as exciting) that will oversee the project.

Having a dedicated team helps avoid the issue of “too many cooks in the kitchen” which can really slow down the progress of a redesign.

This team should be a diverse, cross-functional group of people composed of no more than five to seven individuals, ideally from different departments.

This helps to ensure that you’re getting feedback from people with different points of view. A good website team will have representatives from: 

  • Employees in client-facing roles
  • Members of your marketing team
  • Higher-level executives in the C-suite
  • Employees who have been at your company for a long time
  • Designers or Developers who specialize in UX/UI

Within this team, you also need to determine the person who will be the leader of this project — essentially, the Leonardo to your Teenage Mutant Ninja Turtles. 

This person will have the final say when it comes to making approval and decisions within the group and ultimately make sure the project keeps progressing.

With your team in place, you’re ready to get started!

Step 2: Audit your current site

The steps you take to prepare and plan for a redesign are usually a clear indicator of how successful your redesign will be. 

One of the most beneficial things you can do to start is complete an in-depth audit of your current website. 

An audit will give you a birds-eye view of all the assets you have to work with for your redesign and give you insight into what’s currently performing well on your site and what’s not.

When auditing your website, you’re going to want to:

Assess your website’s current page performance

I recommend building a sitemap of your current website and then reviewing the analytics of each page to see any noticeable user trends. 

Overall, this will give you an idea of what pages you have to work with. 

By analyzing traffic, conversions, etc. you’ll be able to understand what pages people find useful, what pages might be missing, and what pages you can remove. This will all come in handy later on when it’s time to put together the sitemap on your new website. 

Complete an SEO audit of your website

An SEO audit is a comprehensive evaluation of your search engine optimization efforts and how well your site is set up to perform well.

The goal of conducting this type of audit is to identify any issues that may be negatively affecting your organic search performance. This can be either technical issues like site speed or content-related like missing keywords.

Platforms like SEMrush, Screaming Frog, and Google Search Console can help identify any issues with SEO on your site.

Keep a running list of any issues you find, you’ll want to address when creating a plan of action for your redesign.

Review the content on your current website

A lot of businesses still make the mistake of assuming their website is all about them. Most of their content is geared towards telling you how great they are and why they’re unique when in reality buyers want the answer to know one thing:

“Can your company solve my problem?”

How well does your website answer this question?

Try going through your website and counting how many sentences include words like “you” versus “we.” The ideal ratio is five to one meaning you refer to your buyer five times more than yourself.

If you’re not hitting that ratio then it’s usually a clear indicator that your content needs to be reworked to focus on the buyer's problems and needs.

Step 3: Understand the user journey

Similar to the buyer's journey, a user journey maps out the different stages a user goes through on their way to a purchase, focusing on the different actions and emotions someone may feel in each stage.

Understanding what the user is looking for, what questions they need answered, and how they’ll look for it on your website on their way to a purchase is the only way to really set yourself up for success.

An important question to ask yourself as you plan for your redesign is “Are there any holes in our site's user journey?”

There are a few ways you can go about obtaining the answer to this. One way, for example, is by interviewing your users and asking them questions about their experience.

What made you decide to purchase product X? Did anything on the website frustrate you? How did you navigate to page X?

After all, the goal is to reduce friction as much as possible to give them an expedited path to conversion. What better way to improve the journey than by actually asking them?

You can also set up user testing and ask your audience to perform different tasks on your current website. Services such as Userlytics and UserTesting make setting up a user test as easy as possible.

This will allow you to see first-hand how a potential customer interacts with your web experience and where you need to solve for their frustrations. 

Where are users falling off in their journey? What areas of your site are they consistently interacting with? Are there any major issues or bugs on the site? 

Implementing a heat mapping tool such as Hotjar or Lucky Orange is another great way to see quick updates. These tools give you a more visual view of how people interact with your website by color-coding the different elements on a page that get the most and least interaction. 

By focusing on the user journey and reducing any friction, you’ll be setting your redesign up to generate real results.

Step 4: Set goals

As we uncovered earlier, there’s a reason you need to redesign your website. Now is the time where we dive into those reasons and set some specific goals.

With the amount of money and effort that goes into a website redesign, knowing if it’s a success is critical. Setting realistic goals for your site to reference and measure will allow you to do that.

Based on what you uncovered during your site audit, you should have a good idea of what areas of your site need improvement. This is a good place to start for creating your goals.

For example, maybe you noticed that your current site has a steady stream of traffic, but the leads aren’t pouring in. Based on this finding, you may set a goal of increasing your conversion rate by 1% within six months.

However, data alone doesn’t always give us the full story. It’s also valuable to get ideas from the members of your team. Sending out a survey to different team members in your company is a streamlined way to get that additional feedback.

At IMPACT, we start every client redesign project with sending out a survey that asks questions such as:

  • What is the primary reason(s) you have decided to redo your website?
  • What is your #1 goal for the site?
  • What are the most important things you’d like a user to be able to do on your website? 

This helps us truly understand what we need to focus on during a redesign. 

Whatever goals you set should be communicated to the entire team so they can be front of mind while the site is being planned, designed, and developed.

Step 5: Define your strategy

With an understanding of your current website's performance and a set of well-defined goals, you’re ready to build a strategy for achieving those goals.

With this in mind, your strategy should include:

A new sitemap

During your site audit, you most likely discovered some pages that performed really well, some that no one visited, and others that you have no idea where they even came from. Your new sitemap is your chance to reorganize your existing pages, delete old ones, and add in new ones you might be missing. 

I like to make a visual sitemap like the example below so I can understand the hierarchy of each page. 

Ideal user flow

While your user journey are the stages someone goes through when making a purchase, your user flows map out the specific steps someone would ideally take within those stages to complete an action.  

Mapping out an ideal user flow will help you start thinking about how people interact with your website from a first-time visitor all the way to becoming a qualified lead. 

Once you plan how someone would move through your site, you can start to figure out how to optimize the different parts of their journey.

It’s completely fine to start off with a very simple user flow like the example above because once  you launch your site and collect more data you can go back and refine it:

Keyword research

Doing keyword research is an important step in optimizing your new site for search and gaining knowledge about what your visitors are looking for. 

Knowing the terms your ideal buyers search allow you to use those same terms when you're writing your site content. This not only helps you rank better in search engines but better resonates with your audience when they are on your site..  

When it comes to performing keyword research, using a tool such as SEMrush can save you a ton of time and give you the most accurate insights. SEMrush comes packed with features like the keyword magic tool, keyword analyzer tool, and position tracking tool.

Step 6: Setting a timeline

With a plan in place for how you want to accomplish your goals, it’s time to set a realistic timeline for doing it. The keyword here being realistic.

Remarkable websites take time. You don’t want to create a timeline that’s too short and forces your team to rush through important steps or leave too much time and lack a sense of urgency. 

Unfortunately, there’s no magic answer for how long a website redesign will take. A lot of it depends on the size of your website and how levels of approval you’ll need along the way, but you should ideally plan to spend anywhere from 2-5 months on your redesign. 

Consider when you’ll definitely need your new website. Are there any events coming up? Trade shows? If there is something pressing, get started as early as possible so you’ll have adequate time to get the quality website you desire. 

Once you decide on your preferred deadline, break that deadline up into smaller pieces and set milestones. These milestones will help you keep an eye on how on track or off track a project is. 

As you go through the project, make sure you track your progress against the deadline and readjust your deadline if necessary.

Step 6: Review and update (or create) your brand style guide

Your brand style guide is one of the most important tools your company has (and if you don’t currently have one, now's the time to make one!)

Your brand is what people think of when they hear your company’s name or see your logo. It’s what you represent and who you are as a company. 

A brand style guide ensures that what you want your brand to say and what you’re actually communicating are aligned. It’s a set of guidelines that make your brand understandable and replicable by anyone in your company. 

That’s why it’s so important to make sure these documents are updated before you start gathering inspiration and moving into design. 

There are two major pieces of a brand style guide that you’ll want to make sure are updated and accurate: content and visual.

Content style guide

IMPACT’s own editorial director Liz Moorehead best describes a content style guide as “a documented set of guidelines and rules that break down your brand personality, and how it is (and isn’t) expressed through your content.”

A content style guide will generally include elements such as:

  • Brand personality traits
  • Brand-specific copy rules, suggestions, and preferences
  • Basic editorial rules—- grammar, spelling, etc

🔎 Related: How to create a content style guide

Make sure your content style guide includes these elements and that your voice and tone documented in the content style guide are accurate and up to date.

Visual style guide

A visual style guide documents the — surprise surprise visual elements of your brand. This can be elements such as:

  • Typography
  • Image treatments
  • Color palette
  • Iconography
  • Logo usage

When reviewing your visual style guide think about how each element aligns with your company’s current brand.

Is your typography sending out the right message? Do you have a well-defined color palette that evokes the right emotions? How should people use your logo in different use cases?

Sample brand style guide from Unfold 

Once your brand style guide is in order, it’s time to start gathering some design inspiration.  

Step 7: Gather inspiration and analyze the competition

With a roadmap in place, you can now start to think about the look and feel of your new site.

I recommend doing a deep dive of two or three competitor websites as well as one or two websites outside of your industry. This will give you a view of industry standards as well as where you can shake things up a bit (as long as it benefits the user).

Gathering these assets will also allow you to discuss, as a team, what visual elements and styles you want to incorporate. This ultimately helps confirm that your entire team is aligned on the visual direction of your redesign and that it aligns with the overall goals of the project.

When looking for inspiration try to answer questions like:

  • What feeling should a visitor get when visiting your site? 
  • What new tools and features should your new site have? 
  • What types of imagery and graphics should you use?

As you gather inspiration for your new site, make sure you’re saving the different elements you like. The best way to do this is by putting together a mood board for your team to reference during the design phase of your redesign.

If you’re not familiar with mood boards, think of them as a collage of different images and text that visually explain the direction you want to take your designs.

A mood board can include things like typography styles, layout samples, imagery treatments, iconography, color palettes, or even entire websites. 

Sample IMPACT mood board

 

There are a ton of different platforms out there to help you create mood boards. You can use free tools such as Pinterest or Canva or for a more premium experience with more customization options you can also use paid tools such as Invision Boards.

Whatever tool you use is ultimately up to you and your team, but just make sure you’re documenting the inspiration you’re gathering. 

Step 8: Craft your content

One of the hardest things for teams to do during a redesign is to focus on content before design.

It’s easy for teams to be overzealous and want to jump right into design so they can see all of their hard work start to come together. Plus, let’s be honest, it’s usually the most fun part.

They figure “We’ll just write the content after and fit it into the designs we’ve created.”

This is one of the biggest mistakes you can make during a website redesign. It pushes people into a mindset that content is more of an afterthought that can always just be done later. Not to mention trying to retrofit content into an already existing design rarely lines up properly and usually forces you to either make unforeseen design revisions or sacrifice the quality of your content. 

Your content should always dictate the layout of your website pages. Design is meant to enhance your message, not distract from or overpower it. 

Many people lean towards the design-first approach because they’re not sure where to start when it comes to creating their content. It feels like looking at a blank slate.

Fortunately, it doesn’t have to feel this way. 

I suggest taking a look at your new sitemap to get a high-levelview of all the pages you need content for and breaking those pages down into smaller groups to work on one group at a time. You can use tools like Trello or GatherContent to organize these pages.   

With your pages organized into more manageable chunks of work, start creating content wireframes that break down exactly what content and information needs to go on each page. This will help you focus on the story you’re telling for each page and cure that feeling of looking at a blank slate. 

When creating your content make sure you're constantly looking for opportunities to educate your visitors.

A simple exercise is to see how well you’re educating visitors is to brainstorm the top 25 questions you constantly hear from buyers about your product or services. Make sure you’re answering those questions in the pages on your new site. 

Also, look for opportunities to include the following in your content:

  • Self-selection tools
  • Premium content like ebooks, whitepapers, and buying guides
  • Video
  • Social proof such as testimonials, customer reviews, and case studies

These are powerful assets that can used to educate and inform your prospects and keep them moving through the buying process.

Just remember, if you’re ever tempted to skip the content-first approach, while a person's first impression of a website is based on visuals, it's strong and engaging content that keeps them engaged and wanting more.

Step 9: Start designing

Being a designer, I’m a little biased, but this is the best part. Now's the time you finally get to your weeks of hard work come to life and start to take shape. 

It may be tempting to dive in and start designing all of your pages out, but instead, take it slow and make sure you’re getting constant feedback and buy-in along the way. 

Using tools such as Invision or Zeplin can help streamline your feedback and make the design process much more collaborative. Both design tools integrate with most of today’s design programs.

Start the design process off by creating wireframes. These can be simple black and white designs and that show how you’d like to lay the content out on each page.

Sample IMPACT Wireframe

Wireframes will keep you focused on the content and allow you to make sure you’re laying the content out in the best way possible.

When you are ready to move into creating full-page designs, start out by designing the first three or four sections of a high impact page (I like to start with the homepage) and then bringing the design back to the team for feedback.

This can save you time and unnecessary revisions in the long run by making sure your design is going in the right direction.

Once your team is fully aligned on a design direction, you’re off to the races. Work your way through each page making sure you’re getting that constant feedback and buy-in from the team.

If you want to take this one step further you can even run some user tests on your new designs and get feedback from actual users. 

Step 10: Develop your site

Development is typically the final stretch for any redesign, and our website redesign checklist is no different.

It’s been a long process to get to this point, so there’s a lot of anxiety that can go along with this step, but rushing development can be a recipe for disaster and delays.

Dedicate ample time for the site to be coded out cleanly, following SEO and industry best practices as well as the design you fell in love with. 

In this step, your team, internal or external, will transfer the flat design mockups that were created, into HTML, CSS, and other languages.

As pages are developed make sure you’re checking for cross-browser functionality to ensure a consistent experience for all users. This gives you peace of mind that no matter what browser is used, your site will display exactly as intended and also ensures your users are getting a fully optimized experience.

The same goes for mobile devices — going through the variety of screen sizes takes time. 

Typically it’s a good idea to determine the most popular devices at the time and test those. This gives you a realistic snapshot of what your site looks like on different devices, again ensuring a consistent user experience that won’t frustrate anyone.

Step 11: Launch your new site! 

You’ve made it! After months of auditing, planning, designing, and developing you’re finally ready to launch your new site. That’s super exciting!

Before launch, make sure you perform a pre-launch review of your site to confirm that everything with your new site is in order and ready to go. Your pre-launch review should include: 

  • Checking for any broken links
  • Making sure your 301 redirects are all set
  • Verifying that the meta description and page titles are correct for every page
  • Checking for any broken or missing images 

Double-checking all of these items will not only save you from a future headache of rushing to try and fix issues post-launch but also ensure a smooth transition for people from using your old website to using your new one.

When you’re positive everything is ready to go, send that site live, and pour yourself a drink! 

Immediately after launch, make sure that all of the pages are rendering properly, your analytics and heatmap tracking codes are in place, and you’ve submitted your new sitemap to Google Search Console.

So now you can kick back and watch the leads flow in, right? Wrong! 

Plan experiments, then rinse and repeat

Your brand new website is developed and launched, but the fun doesn’t stop there. Now you have to start collecting and reviewing your user data on the new designs.

Work with your team to plan experiments to A/B test different layouts, or features, to help improve the user journey. Focus on the most important pages on your website first, and go through steps 6-10 as many times as necessary until you ultimately hit your goals (then set new ones!).

These tests and the subsequent changes will only help improve your website’s user experience, lead generation, and overall effectiveness.

Remember, preparation is key

That’s our website redesign checklist! It’s not always easy to follow it by the book, especially when there are tight deadlines or time constraints. However, following it as closely as you can will assist in making your new website the traffic driving, lead-generating machine you’ve always wanted.

Remember, when thinking about starting a redesign project, the first step is to always assess why you want to redesign your site. Make sure there’s sound reasoning behind your decision.

From here, the success of your redesign will all depend on dedicating the right amount of time to preparation and planning. 

Make sure you understand things like what current assets you have to work with, what areas of the site do you want to improve, what goals will you’ll track to see if your redesign was successful?

Follow these steps and you can’t go wrong. 

Happy redesigning! 

Ultimate Guide to Website Redesign
Here Are Some Related Articles You May Find Interesting

Want to Contribute Content to impactbnd.com? Click Here.