Copy before design: Why your website process matters more than you think

Photo by Kelly Sikkema on Unsplash‍ ‍

Prefer audio? I cover all of this (plus some helpful analogies involving chefs and event posters) in Episode 3 of my podcast, Turn Your Mess Into Your Message. Give it a listen on Spotify, Apple, or wherever you get podcasts.

Picture this: A business owner realizes they need a new website. It doesn’t accurately represent their business anymore, and it’s not targeting the right kind of clients.

So they set out to find a website designer/developer because that's what they need, right? They need a website, so... go to a designer. They find someone online they like the vibe of, get on a call, and then the designer asks them the question: “Who's doing your copywriting?”

And the business owner's like, “Good question. Don't you do that?”

And the designer's like, “No, no.”

That scenario is common. When most people think of a new website, they think design and development first. But there's actually a pretty crucial step that needs to happen before any pixels get pushed around on a screen.

Let me set the record straight about how copy and design work together, which comes first, and why it actually matters for the final result.

Why Copy Comes First (And Your Designer Will Thank You)

Here's the thing that trips people up: copy comes before design in the vast majority of cases. And if you ask most designers—at least the ones I know and collaborate with—they'll agree. It makes their lives a lot easier and allows them to do their jobs amazingly when the copy is structured and ready to go before they start creating the website.

It's borderline impossible for them to do it well without the copy done first.

Why? Because the content—the copy—determines the structure of your website. It is the thing that the designer designs around. It determines the strategy of the site.

There can be a lot of collaboration between copywriter and designer. When I'm working on a project in collaboration with a designer, we both try to be in the loop with the website strategy from the beginning and make sure we're on the same page (literally) with that.

But once we've got the high-level strategy figured out, it's my job to execute that strategy with the content—the written content that they're going to create their designs around.

Content Determines How People Move Through Your Site

The structure of your copy determines how people are going to move through your site. That guides the design, not the other way around.

Think about it: if you had an already completely finished designed webpage, then you'd have to shove your message into those predetermined spots.

Now, I'm not going to say that never, ever happens—especially if you can only invest in a templated design, there are cases where it makes sense. But if you're doing it custom and really strategic from the ground up, that approach doesn't work.

And even if you are working with a template, you're going to have to adjust things to make sure that message is really intentional and guides users through your website the way you want to.

How to Line Up Your Timeline

If you're in the process of looking to hire a designer and a copywriter—and if they aren't a package deal—it's totally cool if you find the designer first. But you'll want to work with that person to make sure you're lining up their design start date to be after the copy is done. Or at least after the copy is, for the vast majority, done.

Maybe some refinements can still be finalized with a little bit of crossover there. That's fine. But the structure and the bulk of the copy should be completed before they work their magic designing the page.

Questions to ask on your calls:

  • How are we going to line up those timelines?

  • Can you help coordinate with my copywriter?

  • What do you need from the copy before you can start designing?

This is why I always offer collaboration with designers, whether I already have a relationship with them or not. I encourage clients to connect us so we can get things done efficiently, effectively, beautifully, and collaboratively.

The Designer's Struggle with DIY Copy

I've talked to a lot of designers—ones I work with regularly and ones I've just chatted with casually online or in person, and here's a common shared struggle.

When they have a client who's DIYing their copy, there are hiccups. The copy very rarely is totally solid and good to go—especially structure-wise. The flow of the messaging, the logic of it... it's just not quite there.

And it makes total sense. Copy isn't just filling in the blanks, even if you're an awesome writer.

What Actually Goes Into Website Copy

Your voice—your tone, your vocabulary, your cadence—that's just one piece of it. (I talk more about defining your brand voice in Episode 2 of my podcast, and in this blog post, if you want to dive deeper into that.)

But there's also:

  • Messaging hierarchy - what gets said where, and in what order

  • Ideal client information - speaking to their specific struggles and goals

  • The right details of your offers - pulling out the appropriate benefits, outcomes, and takeaways that need to be highlighted on each part of the website

  • On-page SEO - that's a whole other ball game (sometimes I bring in a specialist just for this)

  • User experience - the order of the messaging combined with conversion principles

There are all these little bits that go into it. So it makes a lot of sense if DIYing your copy feels like a struggle—you’re an expert at what you do, you’re not an expert at writing copy.

It's really this combination of understanding what website users expect and want to experience—all website users—so there's a bit of intuition there, but also just being in the thick of the website world and knowing best practices. And then also modifying some of those norms and/or choosing the right ones so it fits your business goals and your message best.

The Chef Analogy

You could kind of think of it like a chef creating a new recipe. It lands on your table, you taste it, and if it's delicious, you enjoy it. You're like, oh, that was nice. That was enjoyable. That was what I expected, but maybe with the right amount of surprise or delight.

But you don't know the thousands of things that could have gone into developing that dish. The chef's awareness of food world trends, what's popular right now, what's undiscovered, where's the middle they needed to hit to get a really crowd-pleasing, effective execution.

Combined with their years of experience—each ingredient, each amount, how many times they turned the stove down, which utensil they used, which pot. Why did they use that pot? Why chicken stock instead of beef stock?

Just like with your own work, there are probably a thousand things that go on in the background when you do stuff for clients. It's the same with copywriting.

So don't feel bad if you're pulling your hair out trying to write it. That's literally why copywriters exist.

The Actual Process: Step by Step

Whether you're going to tackle things on your own or work with a copywriter, here's what actually needs to happen—and in what order.

Step 1: Start with Strategy

Who are you really trying to speak to? This is harder than it sounds. Some people are very clear on it. Some need a little nudging to get more specific, or they just need to bounce it back and forth.

Instead of trying to speak to every single person you've ever worked with, there's a good chance you can narrow that down. There's an ideal category of client you're trying to reach. Maybe a couple of different categories.

The second part: You know who you want to talk to. What do you want them to do on your website? What service do you want them to learn about, inquire about?

Maybe you have a whole bunch of things, but you can't always just throw it all at them. Your website should provide direction, not become a dumping ground. There are going to be primary actions you want people to take, primary messages or services you need them to absorb.

You've got to get clear on that strategy before writing a word or designing a pixel.

Step 2: Messaging and Voice Discovery

This is a huge part of your website copy process. This is where mining for insights, expressing your voice, and solidifying your stance really come through to nail down the brand promise you want to be known for, and the personality that's going to bring it to life and make it shine.

(I dive deep into my brain dump process and voice discovery in Episode 4 of Turn Your Mess Into Your Message if you want more on this.)

Step 3: Create the Content Structure and User Journey

Once you've got that strategy—you know who you're trying to reach, what you want them to do—and you've got your messaging and voice developed and fleshed out, then you can create the content structure and the user journey with your copy, with the words.

Step 4: Design Around the Foundation

And then the designer designs around that foundation.

All those steps come before the design work starts.

Your Next Steps

Start thinking about those strategy elements: who you're trying to reach and what you want them to do. Get clear on your brand voice—what does "professional" mean to you? What doesn't it mean?

And if you're hiring a designer and copywriter, make sure you're coordinating timelines so the copy comes first.

Copy before design. That's what really leads to a client-centric, user-friendly, empathetic website that makes your voice and your message shine.

Want to hear more about the website copy process? Listen to Episode 3 of my podcast where I walk you through why the order matters and what comes next in turning your mess into a message.

OR

Book a discovery call with me and we can figure out what your website actually needs to say—and how to structure it so your designer can create something beautiful around it.

Previous
Previous

Why your website copy sounds like everyone else's (and what to do about It)

Next
Next

Triple Threat Website Copy: Why your site needs voice, customer language, AND user experience