Your website is the digital face of your brand – and it heavily affects how site visitors see you. Online research is standard for users these days, and if they don’t have a good experience with your website, they might lose interest in your company altogether.
That’s why website redesign and rebranding a website should be a thorough and structured process – because there’s so much hinging on getting it right. According to research, you only have 0.05 seconds before people form an opinion about your website and 38 percent of visitors will simply stop interacting with an unattractive website.
So, even if you have the most creative designers around, there are some things to consider when redesigning a website that will make all the difference:
1. Audit your current site
If you’re thinking about website redesign, you’ve probably got specific reasons to do so. So, where do you start? Dharma Ram Prajapati, Acquire’s Team Lead in UI/UX Design, suggests:
“Ask ‘what is lacking in the current website? Does the current design meet the new trends in the design world?’ Because trends always come and go and you want your website to keep up.”
(Note that there are numerous ways to remain up-to-date with current trends: follow trailblazing companies or well-known designers on social media, subscribe to newsletters, take courses, or go to conferences. This should be a continuous effort that will help you in many aspects of your job, including website redesign.)
Another reason to redesign your website is if you’ve received negative feedback on your UI or if visitors have a poor user experience while on your site. For example, if your sales team constantly hears that your website looks old or isn’t easy to navigate, take note and then look at your data. Start by analyzing key data points, including:
- Conversion rates and traffic (e.g. which pages have the highest conversion rate and traffic)
- Audience reviews (e.g. direct feedback, survey answers)
- Feedback from in-house tech and non-tech teams
These datapoints will help you better understand exactly what needs to be done. If conversions are dropping, consider how design could help you improve conversion rates. If you find pages that generate no traffic or engagement at all, you might want to delete them. Pages that generate the highest traffic might require further search engine optimization or more strategically positioned calls-to-action (CTAs).
Data from Google Analytics, heatmaps, and conversion and traffic rates will be very useful in the wireframe creation phase.
2. Conduct competitor analysis
You’re not looking to copy what competitors are doing, but you can find inspiration in the way they’ve built their website or branding. Things to look out for in your competitors’ sites include:
- How they present their product or services
- How they’ve built user flows for people visiting their website
- What their webpage speeds and graphics quality are like
- How their pricing structure works
- How they collect contact information (e.g. HubSpot forms, contact us page, CTAs)
- What keywords they’re targeting to attract more visits (organic or paid)
- Their domain authority
- Tools they use (e.g. live chat, chatbots)
Based on the insight you get from studying competitors, you can flesh out your own vision for your website. Whatever competitors are doing well, try to do it better. Whatever they’re doing wrong (or not doing), take the opportunity to gain competitive advantage by doing it right.
Tools you can use for this kind of analysis include Ahrefs, SpyFu, and SimilarWeb.
3. Plan ahead
This is a critical part for every large-scale project.
First, factor in time for planning. Design teams shouldn’t start any actual work until they’ve set specific and realistic goals, as well as done extensive research. You can use the SMART framework to set goals and determine your vision for the end result, including how you’ll measure success. Denise Wilton, an experienced Creative Director, suggests you need to think about how often you’ll update your site, too, in terms of content:
“If you want to commit to publishing regular marketing posts, you may need a content management system (or to migrate to a better one). If you’ll only need to make an occasional update, do you want to be able to do that yourself or are you happy to pay an agency to do that work for you?”
Wilton also recommends thinking about how this design will scale. “If you’re a product company, how might a new product fit into this design?”
For the website redesign itself, a sample process often used could include:
- Create initial mood-boards for presentation
- Craft wireframes and low fidelity mockups, including site map, user flows, and journey
- Write rough versions of content to enable optimal mockup design
- Finalize flow, sitemap, and wireframes after iterations
- Do the the high fidelity UI design
- Export design for development
- Develop the website
- Conduct user testing and iterate on the design or content if you need to
- Launch website
- Conduct live testing
4. Flesh out the strategy for testing and refining
One of the things to consider when redesigning a website is experimenting and adjusting according to the results. You may need to do different kinds of experiments, but usually you’ll want to pay attention to:
Functionality testing
Prajapat provides examples:
“Does the website match our design system, which includes guidelines on buttons, colors, text boxes and other components? Is the website performing well on low-speed networks?"
Conversion optimization
Sometimes, you just don’t have enough data to decide what the new design should be. For example, you may want to test some prominent calls to action (CTAs) to see if your conversion rates are improving, before you redesign them.
When it comes to conversion optimization, think about ESR or Evolutionary Site Redesign. This is based on testing new versions of each element across time and redesigning each of them based on the results. With ESR, you wouldn’t redesign your site in one go, so following this approach will change your strategy toward redesign.
Nevertheless, you can benefit from the principle of split testing first and not relying on your gut to choose the new design.
Don’t forget to test copy
Other useful elements to test are headlines, which are the first things that catch your visitor’s eye. It makes sense to A/B test them relentlessly and find the ones that work best. You can set up split tests for individual webpages and see which webpage version wins each time.
Other things to consider testing when redesigning a website are:
- Brand colors and fonts
- Illustrations, copywriting, and taglines
- Landing page length or structure
- Value proposition statements
- Forms and shopping carts
- Performance on multiple devices (e.g. desktop, mobile, different browsers)
5. Design for the user
During the redesign process, keep your target audience in mind – especially when organizing your content. You may have a specific idea about how things should look, but what’s most important is that it’s attractive and intuitive to your users.
The first step here is to determine who these users are. If you have built specific marketing, user, or buyer personas, use them to make decisions about design and flow. Then, pass that knowledge on to your team. Denise Wilton says:
“Help your design team understand who they’re designing for. What words do they use, how do they think, how will they navigate your site to find the information they need? The way you see your products or organization might not be the way potential customers see it. And when you’re thinking about visual design, don’t choose a design for twenty-somethings if your customers are all over 50.”
Think about how changes might affect your design and the way users interact with it. This might mean you need to set aesthetics aside to first determine how your design should actually work for the user.
6. Help your team get inspired
To create a website that’s up-to-date and works well, your team should keep abreast of trends. To do this, there needs to be a methodical effort to conduct research and gather all the knowledge required for redesigning. Prajapati says:
“We research current market trends on UI/UX/IX, animations, micro-interactions, and user testing. We also research other companies like ours that have recently done really great on designs, and try to learn from their approach.”
Inspiration can also come from portfolio sites showcasing what others are doing. Again, you’re not looking to copy but get the sense of what kind of designs are out there. To do this, you can use:
- Dribbble
- UI8
- Behance
- Lapa Ninja
- Landingfolio
7. Keep your eyes on content and SEO
Even the most beautiful aesthetic design or seamless navigation will be meaningless without the right content.
When redesigning your website, you may have different types and categories of content to consider. Discuss taxonomies and how you will interlink webpages. Work with content teams to write web page content (especially home page and product pages) and refine throughout the redesign process.
A big part of website redesign is also search engine optimization, or SEO. Use tools like SEMRush, Ahrefs, or MOZ to see how your web pages are ranking and for which keywords. You don’t want to lose traffic, so make sure you design metadata (e.g. title tags) properly – for instance, if you sell design software and your main page is ranking in Google for the keyword “design software” you want to keep this keyword in your meta-data and your site’s copy.
With more extensive research, you’ll be able to reinforce keywords and appeal to the right audience. You may also need to set up 301 redirects if you plan to change your page URLs. Pay attention to technical SEO issues, too. The website redesign process is a good opportunity to fix those and boost your website’s organic performance.
8. Remember accessibility
About one billion of our fellow humans have some form of disability. Making your site accessible is one of the things to consider when redesigning a website. According to the U.S. Census Bureau, there are certain disabilities that can affect the way people navigate online. These include:
- Difficulty lifting or grasping. This could impact the use of a mouse or keyboard.
- Vision impairment. Color blindness, or reliance on a screen reader may impact readability.
- Hearing impairment. Your visitors might rely on transcripts or captions for audio and video media.
Apart from enhancing your brand and engaging your customers, accessibility features can also help you create more user-friendly designs for everyone. For example, Google’s accessibility initiatives – like autocomplete and voice control – are now a given for all of us. Eve Andersson, Google’s Director of Accessibility, said in an interview that color contrast guidelines designed for people with disabilities also help others use their smartphone in the sun.
So, when you’re redesigning your website, Denise Wilton suggests you check whether your design and development team have experience creating accessible websites, and put their expertise to use. She adds:
“Everything from color contrast to the way the site is structured and built will have an impact on the people who visit your website and the ease with which they can find the information they need.”
9. Add tools for customer engagement
Redesigning a website isn’t just for the sake of aesthetics or branding. It’s also about lead generation and customer engagement – probably the most notable ways you’ll see the success of your new site.
So, to make sure your site can give that boost to your company’s growth, here are some tools to consider:
- Live chat. Whether your old website was equipped with live chat or not, this is definitely a factor to consider during redesign. Live chat is the most direct way to talk to site visitors and serve them in the moment – be it a customer support or sales matter, or general info request. Opt for software that makes it easy for your teams to reach out to people while they’re on the site, or to answer any questions that users have. Look for a tool that’s easy to install on your website, with a pleasant agent and customer UI.
- Chatbots. Virtual assistants are becoming more and more popular as they can be applied in multiple business functions or industries. In the process of redesigning, consider how chatbots could help your customers. For example, if you’re redesigning your knowledge base content, connecting them to a chatbot that can pull articles for users adds an extra option for self service, which can help improve the user experience. Chatbots can also help keep visitors on your site by engaging them in conversation and providing information about pricing, products, and more.
- Cobrowsing. Cobrowsing is an exceptional piece of technology for customer service. Adding cobrowsing to your site will allow your customer support team to see and interact with customers’ screens – with the customer’s permission – to show them how to do things they have trouble with (e.g. fill out forms, find support articles, use products). The benefit of cobrowsing is that, unlike screen-sharing, it doesn’t require your visitors or customers to download any third-party software.
- Videos or animations. Don’t shy away from engaging visuals. Prepare effective copy and enhance your messaging with short videos or moving images. One common use case is product pages where you can list your different services and then add 1-minute videos to promote them (this works especially well in SaaS).
10. Choose the right tech for website redesign
In the whole course of redesigning your website, your teams will use multiple types of tools. It’s important that they have the resources they need according to the budget they have available. We’ve already mentioned some of these tools, but here’s a bigger list with software that may prove useful:
Initial design (e.g wireframes)
- Invision
- Figma
- Prototyper
- Justinmind
- Balsamiq
High fidelity design
- Adobe XD
- Sketch
- Figma
- Invision Studio
Export for development
- Zeplin
- Avocode
- Sketch Measure
Analytics and testing
- HubSpot
- Hotjar
- Google Analytics
- VWO
- Optimizely
- Kameleoon
Customer engagement and support
- Acquire
Design is ever-evolving
There are dozens of methods you may need to use, but you now have an idea of the most important things to consider when redesigning a website.
One point to remember though is that this isn’t the last time you’re going to go through this process. Website redesign shouldn’t be “set it and forget it”. The testing and fine-tuning of various aspects of the site is work that marketers and designers sign up for in the long-term.
But that’s OK, because this is how you learn what works best and how to streamline the process next time. And your customers will thank you for it.