Case Study Website Redesign Checklist

If you’re even partially responsible for your company’s marketing or online presence, you’ve inevitably had a conversation about redesigning your website.

Maybe you’re not getting enough leads, maybe it’s outdated and doesn’t match your branding, or maybe it’s generating leads, but not the right leads and not quickly enough.

A website redesign is a big project, no matter what size your organization is, especially if you want to do it correctly.Cutting corners typically results in a less than perfect end-product, that may do more harm than good to your marketing and sales efforts.

Proper planning, research, and a little foresight can help make your next redesign a huge success, and less stressful. That’s exactly why I wanted to compile a 10-step website redesign checklist to help set you and your team up for success.  

Note: This is not a comprehensive guide, merely items that you should consider implementing during your own website redesign and some of the steps we follow at IMPACT. Need help? Talk to us.

Step 1: Audit Your Current Website and Assets

The first step of our website redesign checklist is all about reviewing where you currently stand. By reviewing what collateral is popular, what pages are frequented, and what might be missing, you’ll get a sense of what can be repurposed and refreshed or what needs to be created from the ground up.

By going through your analytics to see user trends, you may be shocked to find pages no one felt were important are generating a decent amount of traffic.

That’s great!

The next step here is to note these pages, and save them for later to do some user testing with. You’ll want to find out exactly what’s appealing, aside from the obvious.

Is there a campaign pushing traffic to them? Are users going there because the content is awesome? Or, on the other hand, are they going there only to leave because the messaging isn’t what they were expecting?

Understanding where your weak points are allow you to know where you biggest effort needs to be made.

The pages that are strong, generate traffic, and convert well, however, need to be kept intact, and optimized further, if possible. Keep both of these sets in mind as we go into the next phase of the website redesign checklist.

Step 2: Gather Inspiration and Analyze the Competition

Taking what you’ve uncovered in your site audit, start envisioning what you ultimately want your website to look like, branding aside.

Do you need a store? What types of imagery will work for your users? What layouts are the best for your industry?

Gathering website inspiration and analyzing your competitor’s websites help you get a view of industry best practices and where you can shake things up a bit (as long as it benefits the user).

I recommend taking your top two or three competitors and spending roughly 2-4 hours on their websites.

What common threads are you seeing? Do they talk about pricing? Are they utilizing specific visuals or videos? Refer back to the list of pages you made in your audit. Are you noticing any similarities on your competitors sites?

If your competitors don’t show pricing, that means you probably should. Marcus Sheridan considers Cost one of the Big 5 content topicsandareasofconcernsforshoppers, so, you’ll probably want to really think about building a dedicated pricing page in your redesign.

While you’re reviewing different sites for inspiration, bookmark things you find interesting and you feel will help your user get a better sense of what you do. It could be something like layout, use of a testimonial, juxtaposition of an image with content...really anything that catches your eye.

These pieces of inspiration will help your team, or agency, understand what you’re looking for and work with you to craft the best design for your users.

Step 3: Create / Update / Review Brand Guidelines and Styles

Next, it’s important to review your brand guidelines and styles so you can create a cohesive design.

Begin by having your team review where the current branding guidelines stand.

Does it feel dated? Are the fonts hard to read? Is there a font hierarchy? Is your brand’s tone accurately depicted by this style?

The reason why this step warrants attention is so that everything designed  will be consistent and showcase your company as envisioned. Make sure all brand colors allowed have accurate portrayals, including different values such as CMYK, RGB, and Hex.

Other key items to include in your guidelines are logo usage, fonts, button styles, iconography, and image examples (in some cases).

The goal of this is to give direction to anyone who designs for your brand, and create  consistency across all media whether it be web, print, or video.

On another note, adding in a button hierarchy that corresponds to different levels of the marketing funnel usually helps the user in their journey. Aligning specific button colors with particular stages  gives a consistency across the site that can clarify your user journey and improve their experience.

Understanding that orange, for example, is always a button to request a consultation or take another bottom-of-the-funnel action, while light blue is for learn mores and top-of-the-funnel offers can provide a more seamless user experience.

Once your guidelines are in order, it’s time to begin thinking about the time frame the entire website redesign needs to be completed.

Step 4: Create a Realistic Timeline

The next step in our website redesign checklist is one that’s often overlooked --creating a realistic timeline.

Remarkable websites take time. To make sure you’re hitting the mark not only for your brand, but for your users, there is a good amount of strategy and research that must be taken into consideration long before you start to code.

Depending on the size of your website, and your goals, plan to spend about 2-5 months on the process.

There are ways to expedite the timeline, like reducing the size of your site (do you really need those 300 pages with 1 paragraph of text on each?) or taking a Growth-Driven iterative approach, focusing on the most important pages to the user journey for your redesign then updating the rest of the website in stages.

Regardless, you’ll want to make sure you’re dedicating a decent amount of time to working with your team or agency, to provide feedback on design direction, help with content creation (which we’ll talk about below), and ensure everything is as it should be.

When deciding on a deadline, It’s important to consider when you’ll need your new website by. Are there any events coming up? Tradeshows? If there is something pressing, get started as early as possible so you’ll have adequate time to get the quality website you desire.  

Time constraints are the enemy of quality.

Step 5: Set Goals

With the amount of money and effort that goes into a website redesign, knowing if it’s a success is critical. Creating realistic goals for your site to reference and measure your success is extremely important.

This is where understanding where your current site stands comes in handy. If your current site has a steady stream of traffic, but the leads aren’t pouring in, you may set a starting goal of increasing your conversion rate by 1%.

Whatever goals you set should be communicated to those  , working on the redesign so they can be front of mind while the site is planned, designed, and developed.

Keep in mind that a website redesign isn’t a magic wand that fixes everything.

Your website redesign should, if properly planned and strategized, improve your stats and get you on track to hit your goals, but you’ll want to track this over the first few months after launch. Don’t expect to see stats jump on day one.

Now that you’ve got some goals under your belt, it’s time to start focusing on the people that really matter...your users!

Step 6: Understand  the User Journey

Quite possibly the most important step in this website redesign checklist is understanding the user and the user journey.

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

There are a few ways you can go about obtaining the information you’ll need, for example, interviewing your users and asking them questions about their experience.

Questions like “What made you decide to purchase product x?” and  “Did anything on the website frustrate you?” are great for  digging into what actually helped them convert.

A few important questions to ask yourself as you review your redesign plans are “What content does the user need to make their purchasing decision?” and “Are there any holes in the journey?”.

You can also set up user testing and ask your audience to perform a task on your current website or your newly developed site before it’s going to launch.

This will allow you to see first-hand how a potential customer interacts with your brand and where you need to solve for their frustrations. After all, the goal is to reduce the friction as much as possible to give them an expedited path to the goal. What better way to improve the journey than by actually asking them?

It’s also important to gather data from users after the site is launched

Implementing a heatmapping tool such as Hotjar or Lucky Orange is a great way to see where quick updates can be made while you’re waiting on your beautiful redesign to be completed.

By focusing on the user journey and reducing any friction, you’ll be setting your redesign up to generate real results. Now that you’ve determined what you need to improve on, it’s time to start working on content to fuel your redesign.

Step 7: Content First

A few years ago, Tom wrote about writing your content first when doing a website redesign. This is still a critical part of any website. Without content your site is just a bunch of pretty pictures --and that helps no one.

By creating your content first, you’ll be able to get all your ideas out and fine tune them without risking design revisions or pushing deadlines back. Again, not helping anyone. ;)

Your content should be as concise as possible, and always user-focused.

Many companies fall into the age old trap of creating “brochureware” websites that only talk about themselves and drone on for endless paragraphs. Your users don’t care about “you” they care about how you’re going solve their problems.

By focusing on the user, you’ll help deliver the real value of your organization instead of coming off as salesy or self-serving.

Another positive of putting content first in the design process is that it gives your designer the ability to create a tailored layout to highlight the copy in the best possible way.

Step 8: Start Designing

Now, with your content in hand,, it’s time to bring in the design team to create your page layouts and design mockups.

It’s important your designer uses data you’ve gathered from the previous steps --otherwise, all the work you did was just wasted effort.

For example, do your users rely heavily on social proof like testimonials? Then it makes sense to have a very strong section designed for this. Consider including  client logos that have seen success with your company, and make sure you give context with a descriptive header which could be “Companies we’ve helped…” or something to that effect.

Using best practices, your designer will also take the brand guidelines you compiled or updated and implement them into all of the designs being created. You’ll begin to see how the button hierarchy and other elements take shape and guide the user to specific information.

After this step, it’s important that you and the designer are fully aligned on these mockups before moving into development. Any uncertainty can lead to misalignments that may cause delays in development, especially if new information comes to light that makes a revision necessary.

Once you have your designs finalized and approved, you should do your best to have real users review them.

Step 9: Get Real User Data

Now that the designs have been created, we’re ready for development right? Wrong!

Looking at your freshly made designs, it’s important to go back to your users (usually the ones that helped you in the beginning research stage) to see if your new designs will hit the mark for them.

You can create interactive versions of your designs using a tool like InVision to allow your users to experience what the final developed site will be like.

Create hotspot links to other page designs and ask your users to navigate through them to the end goal. If you see any confusion, hesitation, or something doesn’t seem to “click” you may need to go back and rework the designs -- but that’s okay!

Now is the time to make your changes, before you move into development and changes can be a bit more costly and time sensitive.

Since you’ve gotten “user approval” on your new designs, it’s time to get into development and get the site ready for the limelight in Step 10.

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 usually an anxious feeling that goes along with this step, ut rushing development can be a recipe for disaster and delays.

Dedicating ample time for the site to be coded out cleanly, following SEO and industry best practices, is a necessity. In this step, your team, internal or external, will transfer the flat design mockups that were created, into HTML, CSS, and other languages.

There’s also a decent amount of testing that will go into this step.

Checking cross-browser functionality to ensure a consistent experience for any user is key before launch. This gives you peace of mind that no matter what browser is used, your site will display exactly as intend.

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 on 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.

So, now your site is developed, and you’re ready to launch! It’s time to kick back and watch the leads flow in, right? Wrong again!

Bonus: Plan Experiments, Then Rinse and Repeat (Steps 6-10)

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 and its lead generation.

Conclusion

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 potentially truncating some steps, or skipping them altogether.

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.

Don’t believe me? Talk to us about a website redesign on the HubSpot Website Platform and we’ll make sure it does!

Make the right first impression online! Talk to us about redesigning your website on the HubSpot COS.

Make the right first impression online! Talk to us about redesigning your website on the HubSpot COS.

Whether you’re changing your backend CMS or just giving the site a new look and feel, planning a website redesign can be a challenging & daunting process.

I have a website redesign checklist to make it way easier.

This website redesign checklist will not only make the process easier for you, it will ensure that don’t lose your existing rankings, traffic, and loyal customers in the process. I’ve split the redesign process into three parts: Pre-launch, Launch & Post-launch – pretty creative, huh?

If you invest the time in planning out the redesign during the pre-launch, post-launch will be a breeze. Here is the SEO website redesign checklist I follow for a successful redesign:

Pre-Launch SEO Redesign Checklist:

    1. Remove dev/staging site crawler access
      • Best case scenario – password protect the dev/staging site
      • Second best – noindex, nofollow and disallow in robots.txt file
    1. Determine the redesign variables – What’s going to change?
      • Will there be new URL creation through a domain switch or a new CMS?
        • Determine where these pages will fit into the existing site.
      • Will all content be brought over?
        • With the potential to lose pages that are driving traffic to the site, a proper 301 redirect strategy is necessary (see #4).
      • Will there be new site architecture?
        • Ensure that key internal pages don’t lose link juice through changing the main navigation, removing footers, removing key links from the home page, etc. Use GWT to determine where pages are linked internally.
      • Will there be a server switch?
        • While usually not a factor, switching servers can cause issues during a redesign, especially if it’s not as stable as you thought (see #3).
    2. Minimize the variables – if possible:
      • Switch servers 2-4 weeks before or after the redesign to ensure any problems that occur aren’t from this step.
      • Don’t change your content, including title tags and H1s. Leave everything the same, with the exception of new pages and pages being removed.

By holding off on these two items, you reduce the number of variables that could cause rankings and traffic to plummet. Content can always be added later and a server can be switched before or after the redesign.

    1. Create a 301 redirect strategy
      • Create an index of top pages on the site
        • Use analytics data to help develop a strategy for top content
      • Determine if there will be new pages, where pages can be eliminated and what pages should be recreated
      • Individually map old URLs to new URLs, organized by site architecture
        • If a page is being eliminated, find the most relevant page for a 301 redirect

I can’t stress the importance of mapping out a 301 redirect strategy enough!

In fact, let the results speak for themselves from our 301 redirect case study. This may be THE most important step in the entire redesign process in terms of retaining traffic and rankings.

    1. Plan your analytics software setup

You may need to determine whether a new user account (for GA) is necessary or if you can continue using the current one, which is recommended in order to maintain historical data. Also account for adding the analytics software code into the new design.

    1. Benchmark current metrics – for comparison post-launch.
      • Rankings
      • Home page PageRank
      • Domain Authority
      • Number of pages indexed in Google with a site:domain.com search
    2. Run a preliminary arch audit (see Launch questions)

This is the first of three audits and helps minimize errors at the launch.

 

Launch SEO Redesign Checklist

    1. Launch architecture audit – try to break everything!
      • Are pages properly 301 redirecting from 301 redirect strategy? Try Gsitecrawler to check your server result codes.
      • Are titles, meta descriptions and H1s correct and unique?
      • Were Google and Bing Webmaster Tools installed properly?
      • Was Google Analytics (or another analytics software) installed properly?
      • Were passwords/noindex, nofollow and robots.txt disallow directives removed?
      • What is the total number of links on the home page? More than 100? Cut down.
      • Are the new drop-downs crawlable? How about the rest of the content on the site? (While there are many tools to check crawlability, you can use the Fetch and Render feature in Google Search Console.)
    2. Annotate the site launch in analytics software

This will be a helpful note in the future as a benchmark for increases/decreases in traffic and conversions – an easy reference should anyone ever question why the site is doing so well all of a sudden!

    1. Submit your new XML sitemap in Webmaster Tools
    2. Fill out a change of address in Webmaster Tools for a domain switch

Post-Launch SEO Redesign Checklist

When the website goes live, it’s not time to put your feet up just yet – checking in on these metrics weekly, or even more frequently, will help catch errors and issues early on in the process.

    1. Number of pages indexed – use site:domain.com
      • The number of pages indexed will likely drop off post-launch. Once 301s are picked up, this number should climb back up. Be sure to check that there aren’t duplicate pages being indexed either.

Error-proofing: Should pages indexed remain low, something could be wrong with the implementation of 301s or crawlability of the new site. If duplicate content issues crop up, develop a plan to remove the duplicate pages either through 301s or the canonical tag.

    1. Cache Date
      • Monitoring the cache date will give you an estimate of when you can expect to see changes being picked up. This will depend on the crawl rate of your site, but once the redesign is cached, you should begin seeing changes in the index in a couple of days.
    2. Home Page PageRank, Home Page Page Authority & Domain Authority
      • HP PageRank, HP Page Authority and Domain Authority should remain constant throughout.

Error-proofing: You won’t notice a drop in these metrics right away, as it will depend on Google and Moz updates, but a drop could indicate an internal linking issue page to the home page. Highly unlikely, but still good to monitor just in case.

  • GWT Errors
  • GWT errors will begin to climb and then diminish as you assess and take care of them. Be sure to clean up 404 errors and 301 redirect them to the most appropriate pages. 404s are inevitable during a redesign, as it’s near impossible to catch every page on your website when planning you 301 strategy.
  • Rankings
  • You will also see rankings take an initial dip while the engines are picking up your 301s and assessing the new pages. Rankings could be down for 1-3 weeks, possibly more, so plan a redesign during your slow season or low traffic period.
    • Analytics data
    • Number of keywords driving traffic per week

Error-proofing: This will drop and then return, but could indicate that you’re missing out on the long tail if you don’t see numbers return to normal.

    • Top keywords driving traffic post-launch compared to pre-launch

Error-proofing: Similar to monitoring rankings, you want to know how much traffic you’re missing out on and make sure it returns.

    • Top content driving traffic post-launch compared to pre-launch

Error-proofing: If you see that there is content that drove traffic and is now bouncing, you may want to consider adding this content back to the site.

This table shows a sample of the above monitored data. This client actually ran into issues with the implementation of 301s on the server level. We picked up on the error immediately; however, it severely impacted traffic since the search engines were seeing duplicate content of the old and new URLs.

 

Once the site launches, you should see traffic and rankings take an inevitable dip, as the above case study illustrates; however, within 2-4 weeks (depending on the crawl rate of your site), you should see everything return to normal. If traffic and rankings do not recover, walking backwards through the process should point you in the right direction and careful monitoring of the above metrics should help pinpoint where an issue may be. Hopefully your metrics surpass the norm with all of the upgrades you’ve made, though. That’s when you can do your happy dance!

Additional Website Redesign Resources

 Have you redesigned a website before? Did you follow any of these steps, or do you have anything to add to the list?

**This post was originally published in 2011 by a Seer Alum. The current Seer team updated its content on 1/22/2016.

0 thoughts on “Case Study Website Redesign Checklist

Leave a Reply

Your email address will not be published. Required fields are marked *