You’re here because you realized - you aren’t happy with your website. Whether your brand concept changed, conversions dropped, or you simply decided to make your digital “home” fancy and trendy, you should tackle a website redesign with all seriousness to achieve truly outstanding results. It’s easy to mess things up without a defined website redesign strategy behind your actions.
If you want your website redesign to go smoothly and ultimately bring you closer to your business goals, keep reading this article. We’ll discuss what you should do before starting your website redesign process and provide you with a website redesign project checklist to ensure your revamp endeavor’s effectiveness.
What is a website redesign?
To start with, let’s make it clear what “redesign” means. If you just want to slightly change a website layout, does it mean you need to redesign or ...? Our designers always tell clients that before investing time and resources into the project, it’s better to decide what level of changes they expect a website would undergo. A website redesign implies significant changes of the “inner” and “outer” site elements like code, structure, visuals, navigation, and content. Done properly, the website redesign leads to bounce rate decrease, conversion growth, and user experience enhancement.
Redesign vs. refresh
You can compare a website redesign to a complete overhaul of a house when you leave only the basement and walls and build the rest of the construction from zero. And if you just want to repaint the bedroom walls, you will more likely only need to purchase paint and brushes, won’t you?
Whereas a website redesign can entail considerable alterations of architecture, functionality, visuals, and content, a website refresh focuses on minor renovations. For example, if you want to change how the site looks and feels, you can try a different color palette or typography, and that will refresh the UI. Or, let’s say, you conducted a UX audit and then decided to change CTA buttons’ shape and color, and increase the contrast between text and background to improve accessibility in UX. These modifications will also fall under the website refresh.
And now you may have a logical question - how can you understand if the redesign moment has come?
Is it time for a redesign? Let’s check!
You have two options - rely on your subjective feeling or refer to analytics. I would do both. If your site brings you leads who regularly convert into customers, there should be no need for total transformation. In case you feel (and the data proves) that things are not like you suppose them to be, that’s a time to think about giving your website a second chance.
Also, try answering the following questions:
- Does the current website version convert leads?
- Are there any technical issues with the website?
- Are you generally satisfied with the website’s performance?
- Is the site mobile-friendly?
- Is it accessible?
I imagine your answers “yes” and “no” made up a certain proportion. If you have more negative than positive answers - chances are the website redesign is what you need. Then, let’s talk about how to prepare for a website redesign.
Things to consider when redesigning a website
To make the redesign as effective as possible, you should make clear questions before starting a process.
- Define the most important pages
You can do this by finding how traffic and conversions are interrelated. It will be a sort of BCG matrix in terms of website pages.
High conversion, high traffic pages are your bread and butter. Any unsuccessful changes can lead to terrific consequences ending up in traffic and conversions decline. That’s why you should be very careful when implementing any adjustments, as they may do you a disservice.
High conversion, low traffic pages require the same caution. Even though the traffic is not high, these pages show good results from the conversion point of view.
There is something that doesn’t work for conversions in case of high traffic, low conversion pages. You can experiment with these pages as you don’t risk conversions anyway. And the pages with low traffic and low conversion have nothing to lose, so you’re welcome to make any modifications.
This exercise will help you understand which pages are “cows,” bringing you traffic and conversions that you don’t want to break.
- Identify bottlenecks in user experience
Any frictions in the user journey hinder customers from reaching their goals. Before starting redesign, it’s crucial to detect the obstacles users face when interacting with your website.
Here is what you should investigate:
- Where are those gaps in user experience?
- What do customers like or dislike about your product?
- Is there any significant difference between web and mobile website performance?
- Do people have difficulties performing desired actions? (for example, CTA buttons don’t work as expected)
- What are those FUDs (fears, uncertainties, doubts) that stop leads from converting?
You can get valuable insights from website analytics (like, for example, Google Analytics or Mixpanel) and from the applications that analyze customers’ on-page behavior and interactions with website elements (like Hotjar and Crazy Egg).
We have an extensive overview of UX audit tools in the dedicated article; please check it out.
Besides analytical software, users’ session recordings and on-site surveys, which enable users to send you instant feedback about what’s going wrong on the website, will also assist you in gathering customer data.
- Determine website performance indicators
Whatever design changes you implement, they should be tied to business objectives. Therefore, to check how redesign impacts your business, set key metrics that will indicate any improvements in business performance after the website overhaul.
If you sell from your website (and I assume, you do), then your key metrics might be:
- Monthly recurring revenue (MRR)
- Average order value (AOL)
- Conversion rate
- Churn rate
- Customer lifetime value (LTV)
In addition to quantitative data, customer satisfaction metrics will hint if your redesign works.
Customer Satisfaction Score (CSAT) - you can send a survey to your loyal customers asking if they find the upgraded website more user-friendly, attractive, and functional than its previous version.
Net Promoter Score (NPS) - if more users than before are going to advise your website to their friends or colleagues, it’s already a pretty good sign.
Customer Effort Score (CES) - the fewer efforts customers make to reach their goals on your website, the better interaction experience they will have, and the more likely they will thank you by making a purchase.
- Test the elements you want to alter
Before implementing the global changes in website structure and user interface, try A/B testing separate elements and check if they entail any performance improvements compared to the current website version.
For example, you can test:
- Logo, colors, and fonts
- Product pages design and content
- Home page eye flow
- Images, icons, and infographics
- Contact forms and checkout
- Design of links and buttons
Once you’re finished with the above, you’re halfway done preparing for a successful website revamp and ready to move to the next stage of the redesign process.
12 steps of a website redesign project plan
Since I promised in the title of this article there’ll be no fluff here, let’s move to the website redesign checklist straight away. Depending on your ultimate business goals, you can add or omit some steps; they’re not set in stone. Just use them as a reference to remind yourself what else you can do to ensure your website redesign project will be successful.
Step 1: Clarify website stakeholders needs
How can you understand whether the project is successful or not? You need someone to show you that signal flag saying you’ve achieved the goal. Before starting a website redesign project, clarify all stakeholders’ expectations and needs, and understand what benefits they intend to get from a revamped website. In case the stakeholder is you, there should be no problem. Going further!
Step 2: Analyze website performance
Your goal is to check current monthly performance and compare it later to the redesigned website indicators. Below are some metrics you can choose from depending on the relevance of each for your case.
- Number of website visitors
- Dwell (or on-page) time
- Bounce rate
- Best-performing and lead-generating keywords
- Number of leads
- SEO rankings for main keywords
- Domain authority
Once you’ve selected essential metrics you will refer to, I recommend coming to the next important step.
Step 3: Document current metrics
You can do it in a spreadsheet devoting one separate sheet to one web page of your site. It may look something like this table.
Also, to be on the safe side, it would be better to back up the recent version of the website before starting a redesign. This way, you won’t lose existing SEO content in case you decide to leverage it later on the updated pages.
Step 4: Set redesign goals
Setting proper goals is a halfway to success. Here are the most common targets of a website redesign. You can either focus on one key goal or achieve all mentioned below as they are going side by side.
Refresh website look & feel
The trends in design are changing pretty fast. In a year, your website will likely look outdated, losing to more in-trend competitors. If you plan to update the website appearance, you should decide whether it’ll be just a color and typography refresh or a complete website overhaul with changes in architecture, visuals, and content. Sometimes it’s uneasy to define whether you need a website redesign or refresh. We elaborate more on this topic in a separate article discussing when and how to redesign a website.
Enhance user experience
We aren’t making websites for ourselves but users. High bounce rate, low conversion, and short on-page time unobtrusively hint that there might be problems with UX. It’d be more effective to conduct a UX audit before redesigning to clearly understand where that bottleneck in customer experience is. You can do the UX audit with the help of your internal team or hire third-party consultants who have vast experience in auditing websites or apps UX by walking in users’ shoes.
Increase traffic
Website traffic heavily depends on search engine optimization strategy and content. Needless to say, a company’s blog full of relevant, up-to-date materials is a “must” for attracting high-quality leads. Also, it’s crucial to make regular website performance analyses in terms of SEO ranking for main keywords. From SEO perspective, the redesign’s goal may be to embed essential keywords in new web pages’ content.
Improve conversions
If website visitors don't take expected actions (leave contact data, subscribe, or purchase) and drop off a sales funnel on their way to checkout, more likely they have some difficulties interacting with a product. Then the redesign goal may be a customer journey enhancement, which should result in conversion growth
Step 5: Define your redesign budget
Let’s talk about the figures. According to Hubspot’s research 63% of marketers had no idea how much their website redesign cost. What does it mean? More likely, they went over budget that obviously frustrated stakeholders. Whereas it’s pretty difficult to gauge the exact amount you’d need to pay for the full redesign, you can start by setting a bottom line you won’t exceed when planning your project expenses.
Step 6: Define your buyer personas
Understanding who your customers are and what they are looking for on your website helps you provide people with relevant and timely information. What is also important is that you won’t bother users with offerings they don’t really need at the moment. Thus, they will feel cared for and more likely to return when ready to purchase.
The typical way of getting your target audience’s portrait is by creating so-called customer (or buyer) personas based on psychographic data and jobs these ideal customers need to be done.
According to the research Google conducted some years ago, people have four main intents when surfing the internet: “I want to know,” “I want to go,” “I want to do,” and “I want to buy.”
If the design and content on your landing page push visitors to the purchase whereas they just want to read about product characteristics, chances are high they’ll exit soon. Customer personas give you an idea of how to design and what content to focus on to improve business results when making a website redesign.
Step 7: Prepare content before the redesign
When researching materials for this article, I came across a phrase I liked very much. “Content is water; the design is a cup.” Cool, right? There is a universal truth in these words. You need a cup that will exactly match the amount of water. Otherwise, you risk having either a half-full cup or a puddle on the floor.
Also, you’ll definitely want to avoid a so-called “content gap.” The content gap happens when you attract your ideal leads to the website but, for example, don’t have a relevant case study to prove your competence in the lead’s industry.
Step 8: Research keywords and take care of redirects
You already know your most important pages. The next task is to protect them with a 301 redirect. Redirects are crucial to retain the traffic and link value of the current pages during the redesign process. Create a simple spreadsheet to map your old and new URLs and then pass the document to your tech-savvy staff to implement necessary changes.
What else you can do with your new pages is to natively embed essential keywords into the content to cover topics that probably didn’t have much attention on the previous website version.
Step 9: Build website hierarchy
I’ll be now Captain Obvious saying that a sitemap is a website map. Sounds plain; however, thousands of websites overlook logical hierarchy making their customers perplexedly wandering from one page to another. If your product is what a customer critically needs, they probably would be patient enough to find what they’re searching for. In the worst case, a user will drop out wishing you “all the best.”
Step 10: Sketch out new website interface
Once you build your sitemap, which we can imagine as a backbone, it’s time to create a “skeleton,” aka wireframe. It’s up to you and your design team, whether it’ll be just a simple freehand drawing or a high-fidelity wireframe created in a special tool. In any case, it should clearly show the place of each webpage element, such as shapes, boxes, text, images, and forms.
Step 11: Think out website layout (find the balance between beauty and usability)
And when you’re done with the wireframe, create a website layout that will convey your brand look and feel. That means you should decide on typography, color scheme, and textures. All combined, these elements build a brand identity and unique customer experience. By the way, did you know that color is accountable for 85% of conversion?
Step 12: Design & Development
You did a great job above. So, now leave designers alone with their muse and allow them to create the artwork. I don’t have any idea how this magic happens, but every time our designers send me the illustrations for the articles, I’m amazed by their stunning graphics.
Once the new design is born, the ball goes to the development team to breathe life into your website redesign project.
Design tips to improve website UX
As a design agency, we can’t leave you without the design tips that undoubtedly help to improve user experience and increase your redesign effectiveness.
So, working on your website redesign, try:
- Using fair contrast between text and background
- Optimizing your website from an SEO perspective
- Adding visuals and unique brand elements to make your website recognizable
- Considering voice website search option
- Making all pages mobile-friendly
Think, that’s it? Not really
Even though your fresh design may work pretty well for some time, keep an eye on changes in market trends, design practices, and customer preferences. As we all live in a fast-paced environment, chances are you’ll have to start your redesign process again in a year or so. Contact us if you need any help in your website redesign, and see you in our next articles.
