← All articles

WordPress · Guide

Website Redesign: How to Rebuild Without Losing What Already Works

By Tom Tsatsos12 min read

A wireframe browser window beside a stack of index cards, a ruler and a curved arrow connecting two page outlines, drawn in flat geometric shapes

A successful website redesign keeps everything the old site was doing well. It goes wrong when the new site forgets what the old one was doing. At #10, we start every redesign by writing down what already works: the pages people find, the links pointing in, the forms that bring in leads. Then we audit the content, map every old URL to a new one, build a design system and launch against a checklist. The new look is the visible part. Keeping the old site’s value intact is the part that decides whether the project was worth it.

Signs your website needs a redesign

Most website redesign projects start for good reasons:

  • The website design looks dated next to a competitor’s website, and visitors notice. (Chasing design trends alone is a weak reason, though.)
  • Navigation has grown by accident, and people can’t find key pages.
  • The team can’t change a page without calling a developer.
  • The theme or page builder underneath has fallen behind and is hard to keep secure.
  • The site was built before responsive design and doesn’t work well on a phone, or the user experience (UX) gets in the way of inquiries.

None of those reasons says anything about which parts of the existing website are quietly earning their keep. That is the first thing to find out before you decide you need a redesign at all, and before you redesign an existing website.

A refresh or a full website redesign?

Not every site needs a complete website redesign. A website refresh (new type and color on the same structure) can be the right call when the content and structure work and only the look is tired. A full redesign of the entire website makes sense when the structure, navigation or the system the team edits with is the problem. Your website redesign strategy and redesign plan should say which one you are doing, a refresh or a total redesign, before any new website design work starts. Either way, the website redesign process below applies. A refresh just moves through it faster, with fewer URL changes.

Whether you create a website from scratch or improve the one you have, the order of the work matters. This guide is for marketing and operations leads at institutions, nonprofits and B2B companies planning to redesign a website, most often on WordPress. It covers the order we work in and why.

Step 1 of the website redesign process: inventory what already works

Before the design team opens a design tool, list what the current site does well. We look at four things.

Pages people actually use. Your analytics will show the web pages with steady website traffic from search, from email and from other sites. These are often not the pages the team thinks about most. On a B2B site, one old product page or how-to article often brings in more visitors than the homepage.

Links from other sites. Partners and press link to specific URLs. So do documentation and forum posts. Those links carry visitors and trust. If the URL disappears, both are lost.

Conversions. Which forms and quote buttons produce real inquiries? Which downloads and sign-ups? Note the page each one lives on, where its submissions go, and who receives them.

Things only the old site knows. Redirects already in place, vanity URLs printed on brochures, pages linked from a PDF datasheet, a form that feeds a CRM. These rarely appear in a sitemap and are easy to drop.

Note website performance too, such as page speed on the templates that matter. Write all of this into one spreadsheet. It becomes the list of things the new site has to keep doing. We come back to it at launch.

Step 2: run a content audit before the design starts

A content audit is where your content strategy for the new site begins. A redesign is the cheapest moment you will get to clean up website content. Every page you carry over has to be built and tested in the new site. Every page you don’t need is work saved.

For each page in the inventory, make one decision:

Decision When it fits What happens to the URL
Keep The page works and is current Same URL if possible, or a 301 to its new home
Merge Several thin pages cover one topic 301 each old page to the combined page
Rewrite The topic matters but the page is weak Keep the URL, replace the content
Remove Outdated, duplicate or never visited 301 to the closest relevant page, or let it return a 404 or 410 if there is nothing close

Merging is the decision teams underuse. When we moved an open-source security project’s site to a new custom WordPress theme, several overlapping pages about getting started and joining the community became one community hub, with every old address redirected to it. Website visitors get one clear page instead of five partial ones, and the people who linked to the old pages still land somewhere useful.

The audit also catches drafts and half-finished pages. On that same move, we kept a full, browsable copy of the old site, including its unpublished drafts, so contributors’ work in progress came across rather than vanishing with the old theme.

AI tools can help sort a large inventory (grouping pages by topic, flagging near-duplicates). The keep, merge or remove decision still needs a person who knows the organization. Our guide to ChatGPT for business covers where that line sits.

Step 3: plan every URL and redirect before you build

This is the step that protects what already works, and it is the one most often left to the last week.

A 301 redirect tells browsers and search engines that a page has moved permanently to a new address. Visitors following an old link land on the right page, and search engines transfer the old page’s standing to the new one over time. A 302 says the move is temporary, which is the wrong signal for a redesign. A missing redirect sends people to an error page.

The redirect map is a simple two-column list: every old URL on the left, its new URL on the right. It should include:

  • Every page from the inventory, including those you are removing.
  • Old blog and news URLs, which often follow a different pattern from the rest of the site.
  • PDFs and downloads that other sites link to directly.
  • Vanity and campaign URLs used in print, email or ads.
  • Any redirects that already exist, so they keep working and don’t chain through two hops.

For an industrial LED distributor, we rebuilt the site on WordPress with a staging copy, and launched it with a full 301 map from the old URL structure to the new one. The work did not stop at launch. Over the following years, we converted temporary redirects to permanent ones as we found them and retired URL patterns that no longer made sense. We also updated the company’s ads so each one pointed straight to its new page rather than through a redirect.

When an open-source project moved its blog from a separate hosted platform into its main WordPress site, we tracked every old post and its new address in a spreadsheet, then built the redirects from it. A spreadsheet sounds basic. It is also the only format that both the client and the developer can check line by line.

The order of a website redesign Five stages from left to right: inventory, content audit, URL and redirect map, design system and build, then launch and watch. The inventory feeds both the redirect map and the launch checks. 1 Inventory what works 2 Audit keep, merge 3 URL map every 301 4 Design system, build 5 Launch and watch The inventory is the checklist at launch and the source of the redirect map
The inventory written in week one is used twice more: to build the redirect map, and to check the live site after launch.

Step 4: build a design system, not a set of page mockups

A redesign that ends with twenty approved page mockups tends to drift within a year. New pages get built by copying the closest old one, and small differences pile up. A design system holds up better because it describes the parts, not the pages.

For a business website, a useful design system is not a large document. It turns web design decisions into reusable design elements. It covers:

  • Type and color, with the specific sizes and colors for headings, body text and buttons.
  • Components, such as page headers, cards, tables, forms, calls to action and footers, each with its rules.
  • Patterns for each kind of page, like a service page, a news post, an event or a product, built from those components.
  • Rules for meaning, so a color or an icon always signals the same thing.

That last point is where we see the most value. For an open-source hardware foundation’s new website, we designed a header for each of its six main sections, each with its own color carried into the menu and a matching accent, so visitors always know which part of the site they are in. We also designed a set of icons with a strict rule: each icon stands for one idea and is used only for that. On a site that many teams add to, those rules keep it looking like one organization.

In WordPress, the design system should live in a custom theme and the block editor, not only in a design file. Custom blocks and block patterns let editors make website changes and build new website pages from approved parts without a developer, which is often the real reason for the redesign in the first place. When we moved the open-source security project off an aging page builder theme, the goal was exactly that: the team now edits pages with blocks instead of waiting on a vendor for small changes.

Our design work covers brand systems and custom website design, and our brand guidelines guide goes further into keeping a system in use after launch. Accessibility belongs in the design system too, before design approval rather than after launch. Our guide to ADA website compliance covers what to specify.

Choose the platform last, not first

Teams often begin with “we need to move to a new platform” and work backward. We would rather start with what the site has to do and confirm the platform fits.

For institutions and B2B companies, that is usually WordPress, and often the move is from an older theme or page builder on WordPress to a cleaner custom theme, not a change of platform at all. Sometimes it is a move from another CMS. In both cases the inventory and the redirect map work the same way. A platform change adds a content migration step and more redirects, not a different plan.

If you sell online, the decision is different, and it is covered in our Shopify work rather than here.

Step 5: the website redesign launch checklist

Launch day is when the inventory pays off. We check the live site against it, not against a generic list.

Check How to verify Owner
Search engines can index the site No sitewide “noindex” carried over from staging; robots.txt correct Developer
Canonical tags point to the live domain View source on key templates; not the staging address Developer
Every redirect works Test the full redirect map, not a sample; no chains or loops Developer
Forms deliver Submit each form; confirm the email or CRM record arrives Site owner
Top pages from the inventory load correctly Visit each one on desktop and phone Site owner
Structured data and sitemap Validate schema; submit the new sitemap in Search Console Developer
Analytics records visits Check real-time reports during launch Marketing
Editors can log in and publish Each editor signs in and saves a draft Site owner
Content edited during the build came across Compare recently changed pages on old and new Site owner

Two items on that list come from experience rather than theory.

The last line matters because a redesign takes weeks, and the old site doesn’t stop changing while you build. On the security project’s move, we re-synced pages the client had updated during the build (including an event schedule and two new blog posts) and ran a final check for drift before switching over.

Editor logins are on the list because the switch itself can break them. In that same launch, the process that copied the new site to production overwrote the user accounts. We restored the accounts from the backup of the old site, and the team could log in again. It was fixable because the backup existed and someone checked logins on day one, not two weeks later.

On that launch, we confirmed the site was indexable and canonical tags pointed to the live domain. Every redirect worked. The blog, structured data and contact form were in place, with no broken links.

After launch: watch, fix, then hand over

A redesign is not finished on launch day. For the first few weeks, we watch Search Console for crawl errors and pages that dropped out of the index, check the 404 log for old URLs we missed, and add redirects as they turn up. Every site has a few links nobody knew about.

Then the site needs an owner. Updates, security, backups, new pages and the occasional redirect are ongoing work. We have looked after some client sites for more than a decade, including twelve years running the open-source hardware foundation’s previous website and the servers behind it. Long-term care is what keeps a redesign from needing another redesign five years later.

Questions teams ask before a website redesign

Will a website redesign hurt our SEO?

It can if URLs change without redirects, if content that ranked is removed, or if staging settings like “noindex” carry over to the live site. A complete redirect map, a content audit that keeps strong pages, and a launch check of indexing and canonical tags address the common causes. Expect some movement for a few weeks while search engines process the changes, and watch Search Console closely during that time.

How long does a WordPress website redesign take, and what does it cost?

It depends on the number of page types, the amount of content to move and how many people approve the design. The inventory and redirect map are a meaningful share of the schedule, and skipping them is what makes launches go wrong. Website redesign cost follows the same drivers. Ask anyone offering website redesign services for a timeline and estimate broken down by those stages, not a single number.

Should we redesign or just keep improving our website?

If the problems sit in a few templates or forms, targeted fixes may be enough. If the theme or page builder makes every change slow, or the site can’t be maintained safely, a rebuild is usually worth it. Start with the inventory either way. It tells you what you would be giving up.

What should a WordPress redesign agency with long-term support hand over?

The redirect map, the design system with its components and block patterns, editor guidance, access for your team, and a clear agreement on who handles updates and new pages afterward. Long-term support should be defined in writing, not implied.

Do we need to move platforms to get a new design?

Usually not. Many redesigns keep WordPress and replace an aging theme or page builder with a custom theme. A platform change makes sense when the current system can’t do what the organization needs, and it adds a content migration step to the same plan.

Next step: write down what your site already does well

Before you request a proposal, pull your top pages, your key forms and a list of sites that link to you. That inventory makes any redesign quote more accurate and protects you whoever does the work. Our instant site audit is a quick way to see where a site stands on speed and search before you start.

When you are ready to redesign your site, talk with #10 about a WordPress redesign and the design system behind it, or see how we approached it for an open-source project’s site and the rest of our work.