The primary web site redesign venture I led was a six-month-long baptism by hearth. I realized all the pieces on the fly, which is a good way to develop and get hands-on expertise — and likewise a extremely efficient option to breed stress and nervousness.
To save lots of you a number of the latter with out sacrificing any of the previous, I’ve written a information with tips about constructing a profitable redesign technique, whether or not you’re working with an company, doing an in-house redesign, or proposing a redesign to firm stakeholders.
I’ve spearheaded a number of web site redesign tasks, and I can let you know firsthand: The extra clearly you outline your imaginative and prescient on the very starting, the smoother your entire course of will probably be — and also you’ll see higher outcomes, in addition.
Web site Redesign
An internet site redesign is the method of adjusting and updating the content material, construction, format, and/or navigation of your web site to enhance its efficiency and convert extra guests.
Many organizations determine to revamp their web site to be able to drive extra visitors as their enterprise grows. Others spend money on a web site redesign as half of a bigger rebranding initiative.
In a single redesign venture I led, an in-house product group labored for six months to make important structural updates to an current CMS to accommodate my group’s complicated wants.
In one other venture, we determined to scrap the present CMS and rebuild and redesign it from the bottom up.
For that venture, we took additional time to think about the inspiration and construction of the redesigned web site in order that it will be usable for a few years. We constructed it to be structurally sound and exceptionally versatile, making it simpler (and cheaper) to deal with future refreshes.
No matter why your organization is concerned about a web site redesign plan, it is more likely to be an enormous venture.
It’s additionally an endeavor that’s important to get proper, contemplating the vital position your web site performs in your advertising and marketing and model picture. If customers can’t rapidly and simply discover the information they’re searching for in your web site, you’ve already misplaced them.
How Usually Ought to You Redesign Your Web site?
It might be tempting to present in to altering design developments and advancing know-how. However your web site could last more than you suppose.
I requested Simon Strande, the CEO and CTO of Webnorth, a Denmark-based internet improvement firm, what the typical web site lifespan was. Strande has been constructing web sites for almost 15 years, and he says that basically, “the lifespan is definitely growing.”
Though he says that the usual lifespan is 2 to 4 years, “ our purchasers, it may be fairly a bit longer, relying on the preliminary improvement of the platform and the way versatile it’s.” If the location has built-in flexibility and room to scale, you most likely received’t want a totally new web site each two or so years.
There are two large caveats to that: upkeep and know-how.
Strande says that “if the system has been very poorly maintained, then the lifespan received’t be as lengthy. And typically the shopper doesn’t even understand it’s poorly maintained — the system simply will get slower and slower.”
And typically, know-how shifts so considerably that you simply want a full redesign simply to maintain up. Strande says that he began working in internet improvement earlier than responsive web sites — mobile-friendly web sites that adapt to the person’s gadget — had been obligatory.
“That was a giant interval in improvement,” he says. “Usually we might accommodate current designs to be responsive, however many occasions the web site was simply by no means designed to start with to be responsive.”
In case your web site works for each you and your customers and has been appropriately maintained, however the branding or design really feel dated, you might wish to take into account a web site refresh as an alternative.
Methods to Decide if You Want a Web site Refresh
An internet site refresh updates non-structural components like graphics, fonts, and model colours — which can be sufficient to stave off a full-scale redesign for an additional 12 months (or extra), or till you might have purposeful causes to do a full redesign (extra on these later).
The next questions may help you identify whether or not you want a redesign or a refresh:
- Has visitors to your web site plateaued or considerably decreased? Dips in visitors could be a difficult drawback to untangle, and a significant slowdown in web page views is usually because of a wide range of elements.
But when your web site is now not changing the identical quantity of visitors, if customers bounce after only some seconds, or if pages-per-visit numbers lower, your web site could have outlived its performance.
- Is your web site purposeful and quick? Step into your prospects’ sneakers and see when you can simply navigate the location and discover what you’re searching for with out encountering errors or lengthy web page load occasions.
In our 2024 survey of 300+ internet strategists, HubSpot discovered that 20% of internet sites get between 4 and 6 web page views per go to — and over 50% obtain six views or extra per go to. (We’ll publish the findings of that survey later this month, so keep tuned.)
All that shopping implies that your web site’s navigation and velocity actually do matter.
- Does your present URL construction observe greatest practices for technical web optimization? For those who’re not occupied with this from the start, says Strande, “you possibly can have large issues later, not simply with the construction of the content material and knowledge, however with serps.”
This could have devastating implications: “The worst factor that may occur is that you need to rebuild everything of the search engine presence that you simply had earlier than.” Strande’s subsequent phrases are chilling. “For some companies, that has been an unrecoverable loss.”
- Have your model or targets modified? For those who’ve materially altered course since your final web site redesign — perhaps what you are promoting has adjusted its worth proposition or mission, or perhaps you’ve exploded in progress — your web site could now not characterize who you might be as an organization.
Strande says, “What we see loads is web sites that had been made when the corporate was not that mature. And now that the corporate has developed, can the web site evolve with the brand new calls for?”
Generally you possibly can “put a form of dressing on it with out having to vary it general. However typically the model change is so large that you need to ask your self whether or not a refresh makes monetary sense.”
- How a lot funds are you able to allot to design and improvement? Can you place within the assets and funds required to ship an impressive redesign? Additionally take into account whether or not you’ll pressure inside assets if individuals are reallocated to a significant redesign.
- Are your inside stakeholders aligned? It takes a village, as they are saying. This specific village consists of designers, builders, SEOs, on-line entrepreneurs, content material creators, and extra. Take inventory of various ache factors and what issues all people is making an attempt to resolve. This could be a nice indicator for the way in depth the redesign must be.
- Has the business modified because the final redesign? For instance, when Google introduced that it will be altering to mobile-first indexing, web sites needed to turn into mobile-friendly or threat shedding natural visitors from Google.
In case your web site nonetheless capabilities correctly and simply seems a little bit dusty, you possibly can deal with design components like colours, fonts, and branded photograph remedies with out going again to sq. one.
I’ve discovered that constructing the plan can take as lengthy or longer than the precise redesign course of. Consider it like laying the inspiration for a home — when you don’t get it proper the primary time, it might probably’t assist the interior infrastructure, a lot much less design particulars.
For those who’re questioning what ought to go into your web site redesign technique, begin with the next steps.
Methods to Redesign a Web site
- Benchmark your present efficiency metrics.
- Decide your web site redesign targets.
- Outline your branding and messaging.
- Outline your purchaser persona(s).
- Shield your search-engine-optimized pages.
- Analyze the competitors.
- Take stock of your high-performing content material.
- Select the suitable software program.
- Migrate your content material.
- Make a post-launch guidelines.
Beneath, I’ll unpack these 10 vital web site redesign suggestions to consider when planning and finishing your redesign.
1. Benchmark your present efficiency metrics.
Earlier than you start planning your web site redesign, it’s essential to doc your present efficiency metrics. This will provide you with a good suggestion of the place your present web site stands and what metrics you possibly can enhance upon by way of your redesign.
This additionally allows you to measure progress (or every other metrics) that the redesign is immediately answerable for.
For those who’re unsure the place to start out, I like to recommend analyzing your current web site’s month-to-month efficiency within the following areas. The significance and relevance of every could differ relying in your web site redesign targets, however I’ve discovered that it may be useful to have a look at many of those metrics earlier than diving right into a redesign:
- Variety of visits, guests, and distinctive guests.
- Bounce fee.
- Time on web site.
- High-performing key phrases by way of rank, visitors, and lead era.
- Variety of inbound linking domains.
- Whole new leads and kind submissions.
- Whole gross sales generated.
- Whole pages listed.
- Whole pages that obtain visitors.
For those who don’t presently have entry to this data, instruments like Google Analytics and HubSpot’s Advertising Analytics can present knowledge.
Professional tip: Bear in mind to notice which instruments you employ to measure every of those benchmarks. That method, you should utilize those self same instruments once more when accumulating your post-redesign metrics and thus keep away from evaluating apples to oranges.
2. Decide your web site redesign targets.
What’s the “why” behind your web site redesign?
In case your reply is, “Effectively, it’s been some time since we’ve carried out one,” or “My competitor simply redesigned their web site,” you’re not more likely to be proud of the consequence. On the subject of investing in a web site redesign, there ought to at all times be a superb motive to do it.
Some fundamental person testing can go a great distance when you have the time and assets — you’ll begin to be aware patterns after 5 or so checks, so this doesn’t should be in depth.
However phrase to the smart: For those who’re solely testing a small variety of customers, be aware of the way you interpret and use the outcomes. They might affirm your hunches or offer you steering, however keep away from making an enormous structural change to your web site primarily based on just some person opinions.
For those who’re in a position to discuss to customers, document the classes and have the customers share their display with you, so you possibly can watch how they navigate your web site. Ask them to speak you thru their thought course of as they reply the questions.
I additionally discover it useful to jot down up a quick recap instantly after every person interview — it helps me discover patterns extra effectively.
Whether or not you’re doing the audit your self or interviewing customers, right here’s just a few questions I’ve used prior to now which you could adapt to your particular wants:
- Ask the person to discover a particular web page in your web site. Pay attention to the trail they take. Was it totally different from what you anticipated?
- For those who’re testing a particular characteristic, like a button or new navigational device, ask why the person clicked on one aspect as an alternative of one other.
- For those who’re testing new editorial options, ask what sort of content material the person would anticipate to see underneath a sure subject or theme.
- Ask what different web sites the person frequents, particular to your services or products. For instance, when you promote funds journey packages for Gen Xers, ask the place else they search for comparable experiences.
Once more, when you’re doing this your self for the primary time or are on a shoestring funds, the solutions to those questions shouldn’t be the only figuring out elements for any redesign adjustments.
For those who get shocking outcomes, you might discover it helpful to companion with UX professionals to do extra structured, in depth testing. However even a small-scale audit may give you some supporting knowledge or quotes to enhance your suggestions for a redesign.
Bear in mind: It’s not nearly how your web site seems but additionally the way it works. Be crystal clear about why you’re doing a web site redesign, and tie these targets to measurable outcomes. Then, talk your targets together with your group, designer, or company.
Take into account the next data-driven aims on your personal web site:
- To extend the variety of visits and guests (each are essential, as one customer might go to greater than as soon as).
- To scale back bounce fee.
- To extend time on web site.
- To enhance area authority.
- To extend new leads and kind submissions.
- To extend complete gross sales generated.
- To reinforce web optimization rankings for essential key phrases.
Many of those targets are depending on each other. For instance, to be able to generate extra conversions, you might want to extend visitors whereas additionally lowering your web site’s bounce fee.
Check out the metrics you pulled out within the earlier step. Are there any which you could enhance upon together with your new web site? Maybe you should utilize your outdated web site metrics to encourage new targets.
What I like: You should use HubSpot’s customized dashboards to trace efficiency on the metrics that matter most to you — after which use that previous efficiency knowledge to tell your forward-looking targets.
3. Outline your branding and messaging.
Again to our home analogy: You might want to have a ground plan earlier than you possibly can lay the inspiration. And when you don’t want to select paint colours at this stage, you do must know issues like architectural fashion and the place the plumbing will go.
Equally, earlier than you possibly can redesign your web site, you’ll wish to be crystal clear about desired branding, messaging, and distinctive worth proposition.
If that is more likely to be a supply of friction with different stakeholders, resist the temptation to forge forward with the redesign. Your web site will probably be extra profitable and have an extended life if the stakeholders are aligned.
First-time guests to your web site ought to instantly perceive what you do, the way it could profit them, and why they need to keep in your web site. In any other case, you’ve simply given them a motive to flee to your rivals.
For instance, check out HubSpot’s homepage beneath. It’s instantly clear what the corporate does, what it presents its prospects, and the way any customer can get began:
Take into consideration whether or not you propose to vary your branding and/or messaging within the close to future or when you anticipate it is going to keep the identical for some time. For those who do plan to vary it, what’s going to you should change? Hold these adjustments top-of-mind as you redesign your web site.
Moreover, as you develop your organization branding, take into account which visible features of your web site must be redesigned and what can keep the identical. Have you ever created a brand new emblem, fashion information, or coloration palette? Make certain these are utilized to your new web site, so it stays in step with different components of your model.
Professional tip: For some extra inspiration, try this roundup of B2B web site examples:
4. Outline your purchaser persona(s).
Your web site is not only about you. In truth, it’s hardly about you in any respect.
When your guests land in your web site, they’re asking themselves, “What’s in it for me? How might this firm assist me?”
So don’t make your web site all about you. As a substitute, converse to your guests of their language by crafting your web site design and content material round your purchaser or person personas.
As an illustration, when you’re a advertising and marketing supervisor at a resort trying to herald new enterprise, you may goal 5 totally different purchaser personas: an impartial enterprise traveler, a company journey supervisor, an occasion planner, a vacationing household, and a pair planning their wedding ceremony reception.
Be sure you clearly establish your purchaser personas, so you possibly can form your web site redesign technique across the sorts of web site guests that matter most to you.
What I like: Try HubSpot’s helpful purchaser persona builder that can assist you create detailed purchaser personas.
Lastly, ask your self: Is your target market altering as a part of your web site redesign? And if that’s the case, do your branding and content material align with this new viewers?
Answering these questions will probably be important as you’re strategizing about your web site redesign.
5. Shield your search-engine-optimized pages.
Getting found on-line is important to bettering your web site’s metrics. In any case, if nobody is ready to discover and go to your web site, how will you improve new leads, conversions, or gross sales?
Listed below are three of my prime suggestions for designing your new web site with search engine marketing (web optimization) in thoughts:
Doc your most search-valued pages.
First, use advertising and marketing analytics to determine which of your web site’s pages presently obtain essentially the most visitors and inbound hyperlinks, convert essentially the most leads, and canopy essentially the most influential subjects in your business.
Write down an inventory of those extremely invaluable pages, and when you plan to maneuver any of them, ensure you create the right 301 redirects.
Create a 301 redirect technique.
Subsequent, talking of 301 redirects, these are extraordinarily essential by way of retaining the visitors and hyperlink worth related to a given web page.
Create a spreadsheet to document and map out your 301 redirects (outdated URLs vs. new URLs). Then, hand this doc over to a technical skilled to ensure all the mandatory redirects are correctly applied.
Do your key phrase analysis.
Lastly, when crafting your newly designed web site, choose one key phrase or subject for every web page to deal with. When you establish these key phrases, use on-page web optimization greatest practices to optimize your web site pages.
You may as well take into account including new content material and pages to your web site that deal with key phrases or subjects that could be uncared for in your present web site.
Save time and rank increased on Google with our free on-page web optimization template.
Professional tip: HubSpot’s web optimization Advertising Software program may give you insights into your web site’s present web optimization efficiency, serving to you optimize your web site redesign plan.
6. Analyze the competitors.
Whereas I don’t suggest obsessing over your rivals, realizing the way you evaluate will be useful. To that finish, I’d recommend working your web site by way of HubSpot’s free web site grader device to generate a report card on how nicely your web site is performing.
You may then use this diagnostic device to guage your rivals’ web sites, so that you’re conscious of their strengths and weaknesses in addition to your personal.
Professional tip: HubSpot’s AI search grader device is a good way to achieve perception into how AI serps understand you — and your rivals.
Subsequent, check out your rivals’ web sites, and pay attention to what you want — and what you don’t.
When you conduct these aggressive analyses, you should utilize the insights you’ve uncovered to place collectively an inventory of motion gadgets highlighting some areas for enchancment and methods you should utilize your web site to set your self aside out of your rivals.
7. Take stock of your high-performing content material.
Whereas a redesign is a good way to enhance the efficiency of your web site, it’s not with out threat: In truth, when you’re not cautious, it might probably find yourself harming your web site’s efficiency.
It’s because your current web site doubtless comprises many high-performing content material property that you simply’ve already constructed up, and in case your redesign causes them to turn into much less efficient, it might probably severely injury your advertising and marketing outcomes.
Professional tip: HubSpot’s web optimization Advertising Software program may help you establish your current top-performing pages, so that you don’t find yourself harming your efficiency by way of your web site redesign.
As an illustration, these high-performing property may embody your:
- Most-shared or most-viewed content material.
- Excessive-traffic pages.
- Greatest performing or rating key phrases and related pages.
- Variety of inbound hyperlinks to particular person pages.
For instance, if you find yourself eradicating a web page out of your web site that has collected a excessive variety of inbound hyperlinks, you could possibly doubtlessly lose loads of web optimization credit score, which might make it more durable on your web site to be discovered on search engine outcomes pages (SERPs).
Don’t hesitate to remind stakeholders about web optimization concerns and assist them alongside by auditing your web site and offering them with an inventory of vital pages to remember to keep or replace.
8. Select the suitable software program.
One of the essential steps within the web site redesign course of is choosing the proper software program to create and host your web site. This software program is usually known as a content material administration system (CMS), and it’s used to develop, design, and publish your web site for the world to see.
Whether or not you’re a novice digital marketer or a professional internet developer, a CMS may help you construct a stunning, purposeful web site with ease. In fact, figuring out which CMS is true on your wants will rely in your distinctive enterprise, the options your web site redesign would require, and your degree of familiarity with totally different CMS instruments.
Strande says that he’s seeing extra purchasers select a headless CMS, which he says lets you “change everything of the entrance finish with out having to vary the backend.” The professional is that “it might probably actually improve the lifespan of the platform.” Then again, “it’s typically a better preliminary funding.”
There are tons of of CMSs to select from, together with HubSpot’s Content material Hub. You may as well overview a few of the perfect CMS platforms to study extra concerning the vary of obtainable choices.
What I like: HubSpot’s Content material Hub provides you the instruments you should get your web site redesign off the bottom.
9. Migrate your content material.
For those who’re working with a technical companion, ask them early within the course of how they sometimes deal with content material migration. This could be a large — and massively costly — job, and it’s not at all times included within the redesign quote.
When you have a small quantity of content material, or are constructing a web site for the primary time, this can be one thing you possibly can deal with by yourself. However when you have even a average quantity of content material, making an attempt to do a guide migration is a frightening, time-consuming activity.
10. Make a post-launch guidelines.
The interval instantly after a web site relaunch is a vital time: You’ll discover bugs or different glitches, a stakeholder will ask why a emblem is purple after they thought it will be inexperienced, or hyperlinks will probably be damaged.
Don’t panic! Even the best-laid plans at all times have a hiccup or two. I like to permit an additional two weeks after a relaunch to search out all of the bugs. (Then I take a protracted trip; internet relaunches are loads of work.)
Right here are some things to remember after a relaunch:
- Implement a bug-reporting system. Stakeholders ought to know the best way to report any bugs they discover, whether or not that’s utilizing an automatic system or just Slacking a single one that can observe all the pieces.
- Spot-check your new web site for damaged hyperlinks and pictures. Have a look at a few of your highest-performing pages. Are there any evident errors, like damaged hyperlinks, damaged photographs, or formatting points?
- Examine for 404 errors. After main an internet relaunch that concerned important adjustments to URL construction, I discovered that numerous pages had been nonetheless returning 404 errors. Options to 404 errors can get considerably technical, so seek the advice of together with your tech or product group earlier than organising redirect hyperlinks your self.
- Have a plan on your outdated web site. For those who’ve constructed a model new web site and migrated your outdated content material, you might successfully have a reproduction of your total web site. Generally, this received’t flip into an issue — your tech or product group will observe greatest practices to ensure the transition is seamless.
However in a single redesign I labored on, this turned a problem as a result of we migrated the content material in levels — that means that we wanted two lively web sites for a time period.
Google doesn’t like duplicate content material (even when it’s all underneath the identical area), so we needed to implement some technical options to reduce any web optimization injury.
Price range for a upkeep plan. Correctly sustaining your web site is among the most essential elements in its lifespan, so don’t reduce corners right here.
Testing It Out: Designing a Digital Portfolio
HubSpot contributor Allie Decker put these steps into motion and helped program supervisor and content material editor Katilin Milliken redesign her private web site.
That is Milliken’s on-line portfolio, showcasing her work all through her profession. Nonetheless, it hadn’t been up to date in just a few years. Right here’s how Decker approached this venture.
Discovery: The Objectives of the Website
Earlier than really making adjustments to the location, Decker talked to Milliken about targets. She despatched the next questions:
- What are the targets of your web site design?
- What’s the imaginative and prescient for or objective of your web site?
- Who’s your viewers?
- Are there any particular adjustments you wish to see?
Right here’s how Milliken responded.
What are the targets of your web site design?
“I initially created this web site after I was a enterprise journalist to seize the totally different articles and multimedia tales I labored on. I’ve since converted into program administration and dealing in tech. I need my web site to inform the story of that profession shift and to clarify how the abilities from my previous profession have transferred to my new one,” Milliken says.
What’s the imaginative and prescient for or objective of your web site?
“This web site ought to showcase my skilled accomplishments and the previous positions I’ve held. Consider it like a digital resume with extra examples. I additionally wish to spotlight metrics that display the affect of my initiatives,” Milliken says.
Who’s your viewers?
“The viewers needs to be individuals who wish to work with me sooner or later. I run a contract program at HubSpot. Individuals who wish to be a part of ought to have the ability to find out how from my web site,” Milliken says.
Are there any particular adjustments you wish to see?
“The present web site’s coloration scheme may be very colourful and enjoyable. Whereas I beloved this on the time, I need my web site to characteristic a extra smooth design. I additionally wish to replace the pictures. These photos are from over six years in the past,” she says.
She continues, “I additionally wish to take away the portion about my private artwork tasks and zine. I’ve migrated that to a special web site.”
With these targets and directions in thoughts, Decker was in a position to begin the redesign course of.
Rebranding and Rewriting
Whereas lots of Milliken’s asks relate to the design of the location, refreshing the textual content presents a greater place to start out. This entails reshaping the messaging of her web site so it displays her present targets — telling her profession story to individuals who could wish to work together with her sooner or later.
Let’s begin on the house web page.
Now, let’s flip to her about web page. The copy focuses an excessive amount of on her earlier expertise, so Decker rewrote it to emphasise her newer accomplishments and to inform the story of her profession transition.
Making Design Modifications
Milliken explicitly requested Decker to vary the colour scheme and theme of the location. Since they had been utilizing Wix, Decker began with the prebuilt themes that had been most suitable together with her web site.
Decker settled on a theme with a restricted coloration scheme. Main colours are used to focus on particular areas of the location, and all images are in black and white.
(For those who, like me, battle to search out cohesive coloration schemes, I like Khroma and HubSpot’s Model Package Generator. They’re each enjoyable to play with and will provide you with a lot of concepts.)
Past that, Decker constructed a restricted menu and merged the audio and tales part into one web page known as “Initiatives.” This aligns higher together with her present program supervisor position and focuses extra on initiatives constructed than particular person tales accomplished.
From there, Decker copied the brand new textual content and swapped out her older photos for brand spanking new ones, as requested.
For a bigger relaunch venture, this step will look very totally different. If you should migrate outdated content material onto the brand new web site, take one other take a look at my part on content material migration — and don’t underestimate the time and technical know-how that this step can take.
Outcomes
Decker says, “Creating a less complicated web site allowed the aim of the location to shine. I used to be in a position to seize the evolution of Milliken’s profession and discover an aesthetic that fits her preferences.”
Get Began on Your Web site Redesign Immediately
Whew! Now you are able to plan, design, construct, optimize, launch, and analyze your new web site. Apply these seven steps to revamp a web site that pulls extra customers, wows extra guests, and converts extra prospects.