When we start thinking about a new website, we often start with how it will look. We look at other websites, think about colors and typography, consider different layouts, etc.
Those choices are important, but they should come later. Way later.
Strategy-first web design asks us who a website needs to serve, what it needs to accomplish, what it needs to say to get them there, and how visitors should move through it.
Strategy-first web design is an approach to building websites that defines the audience, business goals, messaging, content and user journeys before any visual design begins.
In simpler terms, we consciously put the horse before the cart by deciding what the website actually needs to do before we move into the design phase.
Why Start With Strategy?
A website can look great and still not work well.
Visitors might have trouble understanding what a company does. Important conversion cues might be buried. The navigation might reflect the internal structure of an organization rather than the way its customers think; this is very common. A homepage could contain a lot of info but provide no obvious next step.
Those aren’t primarily visual design problems.
A new color palette, better typography and a polished-looking homepage can make an old website look fresher. But they won’t necessarily make it more useful to its audience, or more effective for the organization that owns it.
Before I design anything, I want to understand the problems we’re actually trying to solve.
Okay, let me cook…
What Happens Before I Design Anything?
The process varies depending on the size and complexity of the project. A five-page website for a consultant doesn’t require the same planning process as a large nonprofit website serving several different audiences.
But the fundamental concerns for most sites are remarkably consistent…
Understand the Organization and the Reason for the Project
The first question is why the project exists at all. “We need a new website” isn’t a strong answer that would guide a project toward success.
Maybe the existing site no longer reflects the organization. Maybe the business has changed. Maybe the website gets traffic but doesn’t generate inquiries. Maybe staff members have trouble updating it. Maybe potential customers can’t understand the services being offered.
But we can easily turn a desire for a better website into things the website can reasonably help accomplish. Typical goals might include:
- Generate more qualified inquiries
- Better represent the quality of the organization
- Support a new service, product or direction
- Make an outdated website easier to use
- Reduce repetitive questions from customers or clients
- Make the site easier for staff to maintain
- Improve accessibility (I love doing this)
- Increase donations, applications or registrations
- Build credibility with a particular audience
- Generate more useful traffic from search
Not every goal will apply to every project. The work of strategy-first web design is deciding which ones matter most.
Identify Who the Website Needs to Serve
This doesn’t require elaborate marketing personas with names, ages and imaginary biographies. I’m more interested in the actual groups of people who come to the site, why they’re there and what they need.
A nonprofit might need to serve donors, grant seekers, community members and professional partners. A consulting business might have prospective clients, existing clients and people arriving through useful articles found on Google. Those people probably aren’t looking for the same things.
Typical goals include:
- Identify the site’s primary and secondary audiences
- Understand why each audience visits
- Determine what they already know when they arrive
- Identify their most common questions
- Understand their concerns or objections
- Determine what information builds confidence
- Identify what each audience needs to accomplish quickly
This changes how we think about any website. Instead of asking, “What do we want to put on the site?” we can ask, “What do people need from us?”
Decide What Next-Actions Matter
Website strategy can become way too complicated when we start talking about things like “engagement” and “conversion optimization.” Usually, there are far simpler questions underneath.
What do we actually want people to do? Typical goals might be:
- Schedule a consultation
- Request a quote
- Make a purchase
- Make a donation
- Apply for a program or grant
- Register for an event
- Join an email list
- Call or visit a location
- Download a useful resource
- Read supporting information before making a decision
- Contact the right person
- Simply understand what the organization does
Not every visitor needs to take a major action immediately. Someone choosing a professional service may visit several times before making contact. A donor might want to learn about an organization’s work before contributing. Someone reading an article may simply need a useful answer today and return months later.
The point is to understand what useful outcomes look like so the website can support them.
Get the Offer and Messaging Straight
Before designing a home page, we decide what that homepage needs to communicate.
What do you actually do? Who is it for? Why would someone choose you? What does a prospective client or customer need to understand before taking the next step?
Until those answers are clear, visual design can’t make them clear.
Typical goals here include:
- Explain clearly what the organization does
- Identify who its services or products are for
- Communicate the value of the offer
- Establish what makes the organization different
- Answer important questions early
- Address common concerns
- Provide evidence through testimonials, case studies, results or credentials
- Establish an appropriate voice and tone
- Give visitors a clear reason to take the next step
This is also why I don’t see copy and design as separate stages. The structure and design of each page will depend on what needs to be communicated.
Audit the Existing Website and Content
A redesign doesn’t mean automatically throwing away everything that’s already there.
There’ll usually be some material that nobody needs any more. But some pages could be performing well in search and just need some SEO refinement — or, if they’re older, a quick review for updates. Some pages might be pulling in substantial traffic. And some existing content can be excellent even if the website around it has become a bit dated.
So:
- Identify content worth keeping
- Find outdated or redundant pages
- Preserve pages that already perform well in search
- Identify missing information
- Find confusing or poorly organized content
- Review traffic and search data
- Identify popular landing pages
- Find important pages visitors aren’t reaching
- Review existing forms and conversion paths
- Preserve useful URLs and avoid unnecessary SEO losses
Analytics and search data are particularly useful here: instead of assuming how people use an existing site, we can look at what they’re actually doing.
A well-considered redesign should improve what isn’t working without destroying what already is.
Build or Refine the Information Architecture
Once we understand the audiences, goals, messaging and current content, we can start deciding what the website actually needs to contain.
In practical terms, we’re figuring out which pages should exist, how they should be organized, and how someone should navigate between them.
Typical goals at this stage are:
- Determine which pages the site needs
- Create a logical sitemap
- Simplify the main navigation
- Group related information together
- Establish clear page hierarchy
- Make important information easier to find
- Give each major page a defined purpose
- Account for search intent when organizing content
- Create useful connections between related pages
- Avoid unnecessary pages and navigation clutter
A common problem with older organizational websites, for example, is that their structure gradually starts to resemble the organization itself. Departments, programs and internal terminology become the navigation, and the website starts to feel super clunky.
Most visitors don’t necessarily understand any of that, and maybe don’t even need to — and every site should be organized around what its users need.
This is also where an SEO review can go. Understanding what people search for helps determine which pages should exist, what questions they should answer, and how information should be organized.
Plan the Important User Journeys
A sitemap is useful for planning a website, but visitors don’t experience websites as abstracted sitemaps. They’re probably on their phone. They arrive on a page, read something, click something. Then they decide whether to keep going, or to go somewhere else.
So we also need to think about the paths people are likely to take through the site:
- Provide obvious next steps from important landing pages
- Connect informational content to relevant services
- Move prospective clients toward inquiry or consultation
- Help visitors compare options
- Make supporting evidence available when it is needed
- Reduce unnecessary clicks
- Prevent dead ends
- Accommodate visitors at different stages of decision-making
- Make calls to action appropriate to the context
Someone might find a blog post through Google and then discover a relevant service. Someone else may arrive at the homepage after receiving a recommendation and want to see examples of previous work. Another visitor might already be interested in hiring the company and simply need enough information to feel comfortable scheduling a call.
The website needs to work for all three.
This is where a strategy-first web design approach really helps secure a positive outcome.
Establish the Technical Requirements
Now we have enough info to make decisions about technology. A website should use only the tools actually required to accomplish its goals. Which sounds obvious, but websites are often built the other way around: a theme, plugin or particular technical approach is chosen first, then the website is made to fit around it.
I prefer a more minimal approach.
Typical goals at this point include:
- Determine what WordPress functionality is actually necessary
- Decide if WordPress is even the right platform for a project (sometimes it isn’t)
- Select appropriate forms and integrations
- Plan ecommerce, donations, events or memberships where needed
- Determine analytics and reporting requirements
- Establish accessibility requirements
- Plan site search where appropriate
- Consider performance and security
- Decide how content will be managed
- Make routine updates easy for the people who will actually maintain the site
- Avoid unnecessary plugins and custom functionality
I generally prefer the simplest technical solution that meets the requirements of the project. I don’t love fragile systems.
The website also needs to remain manageable after launch because someone else may eventually work on it, add to it, maintain it. A good build shouldn’t need a developer on tap forever to be manageable.
Note: Most of this happens during the Scope phase of my SURGE™ Method. Scope is where we define the goals, audience, messaging, content, site architecture, user journeys and technical requirements before we start designing. Doing that work up front gives us a clear roadmap, which means we can move much faster through the remaining phases: UNLOCK, RELEASE, GROW and EVOLVE.
Now We Start Designing
By this point, a lot has been uncovered and thought through, all without choosing a font or a color.
We know who the website is for. We know what the organization wants it to accomplish and what visitors need to understand. We know which pages are required, what those pages need to do, and how people should be able to move through them.
The design layer now has specific objectives it can focus on. The goals here are things like:
- Establishing a clear visual hierarchy
- Making important information easy to scan
- Drawing attention to appropriate actions
- Expressing the organization’s personality and credibility
- Using typography and spacing to improve comprehension
- Making different kinds of content visually distinct
- Ensuring consistency across the site
- Working well on desktop and mobile
- Meeting accessibility requirements
- Producing a visual system that can accommodate future content
None of those decisions has to carry the burden of figuring out what the website is for. We already know.
This makes design far more focused and purposeful because now we’re designing solutions for the key problems we’ve identified.
Is Everything is Decided in Advance?
Nope. Not at all. No website project is a straight line from strategy › design › development with all decisions locked down permanently.
The design process itself often reveals things: a page that contains too much information, or a layout that exposes a weakness in the messaging. Writing a piece of content could surface that one page should really be two, or the reverse.
Development can reveal a simpler way to accomplish something than we originally planned.
A healthy process allows for all these kinds of discoveries and adjustments.
What Does a Strategy-First Website Look Like?
One website might be restrained and minimal, another could be colorful and energetic. An outdoor brand may depend heavily on photography, while a professional organization might need to present substantial amounts of complex information clearly.
There isn’t a particular strategy-first look. “Strategy-first web design” isn’t a visual style.
What all strategically designed sites should have in common is clearer messaging, purposeful pages, and sensible paths through the content.
Do Small Websites Need this Much Strategy?
Strategy can be proportional to the project. A five-page website for a small business doesn’t need weeks of workshops and a 70-page strategy document. (I don’t write that kind of bloat, anyway.) But every website plan still needs answers to the same fundamental questions.
- Who is the website for?
- What do those people need to know?
- What do we want them to do?
- What pages are necessary?
- What should those pages say?
- What might prevent someone from taking the next step?
For a smaller project, we can probably answer those questions pretty quickly. But the same principle applies: answering them before designing anything still saves a ton of time.
Strategy Doesn’t End at Launch
Launching the website gives us something we didn’t have during the planning process: real visitors using a finished site.
Analytics can now tell us which pages people actually visit and how they move through the site. Form submissions and inquiries can tell us whether we’re attracting the right people. Search data can show which queries are bringing people in. Conversations with clients, customers or staff can reveal questions the website isn’t answering well enough.
Strategy-first doesn’t mean making a plan at the beginning of a project and sticking rigidly to it forever. It means making decisions for clear reasons, measuring what happens, and using the resulting evidence to make your website better over time.
Start with the Right Questions
A website absolutely has to look good; visual design underpins credibility, usability, and the way people experience a brand.
But “What should it look like?” should never be the first question.
At bare minimum, every time, we need to know who the website is for, what its audience needs, what the owner needs the website to accomplish, and what will help visitors take the next step.
Once those decisions are made, the design phase becomes so much easier.