Technote

Development workflow Intro

Series Redesigning a site that is already live Part 1 of 8

A redesign starts with an inventory, not a mockup

You cannot protect a page that is not on your list. Three inventories — pages, templates, top entry screens — settle both the scope and the schedule.

Redesigning a site that is already running is nothing like starting from a blank page. It has visitors, it has addresses that have earned a position in search, and enquiries arrive through those addresses. So the goal is not simply “make it better” — it is make it better without losing anything.

And to lose nothing, you first have to know what you have. The first task is not a mockup but an inventory. A page that is not on your list cannot be protected, and an unprotected page turns up as a 404 the day after launch.

Three separate lists

One list is not enough. Each of these answers a different question, and each one narrows the scope a little further.

Three inventories before a redesign — each one narrows the scope

The page list records everything that has an address. Pages and posts obviously, but also category and tag archives, search results and attachment pages — addresses nobody deliberately created. Your sitemap is usually the fastest starting point, and in WordPress you can export the admin listings directly.

Pages and templates are different lists

This distinction changes the schedule and the quote outright. A site can have five hundred pages and eight templates. A designer draws templates, not pages; the five hundred are simply content poured into those eight.

In WordPress the templates you need to count usually run: home, post listing, single post, static page, category and tag archives, search results, 404, plus the listing and detail views of any custom post types.

Search results and the 404 page get forgotten remarkably often. They are not in the mockups, so they are not in the build, and they sit there in the old design until somebody stumbles across them after launch. Writing them on the list is the entire fix.

The top entry list decides the scope

The third list comes from your search console and analytics: roughly the top twenty pages by entry. On most sites a small handful of screens carries the bulk of arrivals, and those screens are precisely the ones to handle most carefully.

Do not record only the address. Add the columns below — the redirect map and the post-launch checklist both come straight out of this table later.

Five columns per row — this table becomes your checklist later

What the inventory is actually for

It looks like paperwork, but everything else in the redesign derives from it. The template count justifies the schedule and the quote. The entry list sets the order in which things get reviewed. The page list is the reference you check against after launch to see what quietly disappeared. And the address column becomes the left-hand side of the redirect map two parts from now.

How to break work into stages and what to settle first is covered further in the development workflow archive, and the stages we actually run are published on the process page.

Next part

With the lists in hand it is time to set the scope. To give away the conclusion: leave the screens that are already working alone.

More on this topic

All technotes

Development workflow Practical

Turning taste arguments into rule checks

"It feels a bit cramped" can be neither argued with nor fixed. Spacing off the scale, colour off the palette, contrast below threshold, missing states — four rules…

Designers 9 min read

Development workflow Practical

Do not swap everything at once

A full swap makes every problem appear at the same moment — which means none of them can be attributed. So you switch one template at a time.

Designers 6 min read

Development workflow Practical

Adding an SCSS build, and whether to commit the output

WordPress themes are expected to deploy without a build step, which leads to the opposite conclusion from ordinary application code — and to its own costs.

Developers 7 min read

₩270,000 · Join the program