1. Read the tea leaves | 2. Set goals | 3. Get the big buy-in | 4. Spin off a SWAT team
5. Write it down | 6. Check in | 7. Test | 8. Revise & repeat | 9. Explain & sell
Update: Download Michael’s
presentation on website redesign from the MagsU conference on June 1, 2009. Slides include samples of a “spec doc” and a mockup for communicating ideas to designers and developers.
When we’re facing a Web site redesign, two images come to mind: a minefield—the political kind—and a pack of runaway horses. If you’ve been through a site redesign, particularly if you’ve helped lead the effort, you understand. It doesn’t have to be that way. Below are nine steps to help you plan a bang-up new site with relatively little bloodshed. This is not about tapping into creative inspiration. We’re talking tactics to navigate around the explosives, and prods to get the stampede headed in a productive direction.
Before you set off, find out where you are. What’s popular on your site, where do people come in and where do they leave from, how long do they linger, what puzzles or frustrates them, which features can they live without, and what would they like instead? Pore over site analytics, search logs, and past market research. Then order up as many new studies as you can justify: user testing, Web-based and phone surveys, field studies, interviews, and expert analyses.
Next, decide which broad, top-line changes and improvements you’d like to focus on. You won’t get into details until much later.
It’s impossible to reinvent a Web site with a large group of “stakeholders,” as the euphemism goes, but it’s critical to invite these folks to a big meeting early on. Include everyone who might want to have a say or could make your life miserable later if he or she were to feel left out.
At the meeting:
- Revisit and confirm the site’s basic business and content strategies.
- Summarize your research and analysis.
- Outline your preliminary proposals for the redesign.
- Invite reactions and suggestions.
- Listen, discuss, and encourage venting.
- Get consensus on top-level directions.
- Sketch out the process ahead so stakeholders can see how they fit in.
- Tell them how you’ll keep them in the loop.
(back to top)
To do the real nuts-and-bolts work, you need an agile, action-oriented group—say, three to six people with a variety of skills (editorial, design, interactive) who are authorized to make decisions. Over one to three months, this group should meet regularly to discuss, brainstorm, and decide what’s changing and how. Here’s your agenda:
Background and big picture: What’s driving the re-design, what are your strategic goals, and how will you measure success? How does the intended audience for the re-designed site compare with current users? How will the site be positioned in the competitive landscape? Do you want to alter the tone, personality, and look and feel? Are there any overarching usability concerns that you’ll need to deal with? How will issues of advertising and subscription affect your plans? Most importantly, what will the site do for the users? What are the critical, defining elements of information and functionality?
Site description: Sketch out the new site’s organization and navigation. Describe how the home page will showcase the new site’s mission, personality, and high-priority content and features. For each major “channel” or navigational area, describe the “start page” and the key components of content and tools that flow from it. Define the visual approach. Formulate guidelines for the presentation of advertising, if that’s relevant. And in every one of these realms, make clear what you want to keep, drop, improve on, and create from scratch.
Functional requirements and technical concerns: Are you inventing a handy new “power tool?” Will the redesigned site need to tap into your organization’s membership management system? Keep a special list of any such elements that have consequences for the technical underpinnings of your new site. Consider also what improvements you’d like to see in your content management system.
(back to top)
The act of writing forces you to try on your ideas and to be clear about them. But here’s the real reason this is critical: You need a lucid, comprehensive plan that everyone can react to and refer to as the redesign moves forward.
We’ve found that an internal wiki—a set of online pages that anyone can edit and add to, during SWAT meetings as well as later—can make the creation of this document a lot easier. We call it the redesign blueprint.
Your blueprint should include conceptual mockups of high-level pages and important tools. Pencil sketches, crude diagrams within word processing documents, or simple representations created with an Illustrator-like program—these will work just fine.
Present your detailed blueprint to the stakeholders and collect feedback. Then confirm everyone’s buy-in.
(back to top)
Now it’s time to check with the crowd that really matters: your audience. At this stage you’ll have to create more compelling mockups, though they could still be on paper. In individual interviews, get reactions to the most important or radically different aspects of the new site. Set up user tests, in which people “drive” paper prototypes, wire frames, or early “builds” of Web pages. And consider online A/B testing of selected elements. That means randomly steering some of your site visitors to new pages or new sections of the site and comparing their behavior with that of users who are sent to the current versions.
Depending on audience reactions, you may want to modify your plan. Mock up the revisions, check in again with the powers-that-be (or, if the changes are minor, just inform them), and test the modifications again with users (if you can afford the time and expense). Depending on what you learn, you may or may not go around the loop again.
It’s hard to imagine, but once the redesign is built and launched, visitors might not necessarily get what’s so “improved” about this new and improved site.
Explain it to them in as many friendly and conspicuous ways as you can invent. Put an eye-catching “wrapper” on one corner of the home page, the way ConsumerReports.org did last year, announcing, “We’ve redesigned! Take a look at what’s new.” (See a screen shot of this.) Concoct annotated pages (see another screen shot), guided tours, and video demos that show how the site works and call attention to the irresistible new benefits to users.
At this point you probably wouldn’t mind a stampede—as long as it’s headed toward your site.
(back to top)
We’ll be teaching again this July at the the Stanford Professional Publishing Course, an intensive and inspiring program for mid-career pros–and we’d love for you to join us. If you’ll
Here’s an ambitious online extension of a print operation: Observer Media Group, parent company of the New York Observer, has embarked on a plan to cover local politics through a network of Web sites in all 50 states.
