Let’s talk wireframing your web copy
Say what now? The other day I was in a client feedback session. As we discussed this business’ web copy - and how I ordered the flow of copy - I mentioned the word ‘wireframe’. And my client looked blank. I paused and she admitted I was talking gobbledegook. Oops, I thought. I did something I ‘aint fond of. I spoke in copywriting jargon! Because to me, wireframing a web copy project is second nature. But what does it mean for you? And why is it important for your web copy project?
That simple moment has stuck in my head for a couple of weeks now. So much so, I feel I need to write about it. Why? Well, not just to explain this website building term (‘cos it’s the website design side, as much as the website copy side!) because I want you to know. I think you need to know - especially if you’re working on copy yourself at any point. But even if you simply evaluate copy, plan copy or you work with a copywriter, it helps to understand the ‘thinking’ behind the web copy.
So, without further nattering on! In this blog post, I will chat about web copy wireframing. Learn:
What wireframing means
Where wireframes are used
Why wireframing matters
Why copywriters who wireframe are ACE (haha, no, but really…)
How to wireframe your own web copy
Back to basics. What is a wireframe, then?
A wireframe basically means a very basic plan of where everything goes on a webpage. Think of it literally - like little bits of actual wire, framing off sections of copy. Wireframes are sometimes referred to ‘information architecture’ too. This sounds super fancy and I must admit, I like it. But I think it’s a little more confusing.
A plan for your web copy
So instead of having a blank page - and no structure - a wireframe (or your ‘information architecture’) almost gives you ‘gaps to fill’ within a pre-determined structure.
Where are wireframes used?
Traditionally, wireframes are the tools of website designers. In fact, having a read around about wireframes on the ‘net I thought this excerpt illustrated that exactly:
“Designers use wireframes to outline visual and typographic hierarchy of user interfaces, set the interactive zones and elements, plan transitions and interactions, organize the general layout markedly for the target audience. Since a wireframe is focused on the structure, not the visual and emotional perception of the details, designers try to keep it simple. They mostly limit it to monochromatic color schemes, with boxes and lines representing copy, pictures and all the interactive elements on the page.” - UX Planet
It’s the same for us copywriters. We use them to outline the typographic hierarchy, interactives, different copy elements, interaction and general layout for the target audience. In simple terms, we plan how everything flows, which bits stand out, and what specific elements go where - in the best way for your target audience.
I believe wireframing is FUNDAMENTAL to any website copywriting project. You cannot simply open up a word document and type. You need to craft it - and visualising the copy on an actual web page is a huge part of that.
Specific tasks that require copy wireframing
Creating a new website (having a new website designed from scratch? A total overhaul? A wireframe for your new copy is vital)
Adding a new (important) page to your site
Creating a landing page for a specific campaign/ marketing goal
Are there any tasks that don’t need copy wireframing?
Yes, ish. Copywriting and content writing are different. So if you’re writing content for your website (and not copywriting - as in writing copy), this rarely needs a wireframe. In fact, I once worked with a client who wanted to make their blog page look super cool and interesting. And I just thought, ‘no, keep it simple - people are literally there to read your posts like an article.’
The below is a total side note - but may be useful!
The difference between copy and content
Here’s a quick reminder. It’s easy to use these terms interchangeably - and while you could say I’m being pedantic (perhaps I am a little) it does my head in. Why? Well, copy and content are very different. They have very different goals. So. it’s reallllllyyy important to be clear on whether you’re writing copy or content - as that will determine your goals. And those goals will underpin every sentence you put together.
P.S. for purposes of this blog, we are talking about copy (web copy).
Why do wireframes matter?
As I sit here on my copywriting throne (haha) spouting information at you (my lovely target audience, I hope) I recognise I need to justify why this important for YOU. So let’s break this into two camps - and explain why wireframing matters
Camp 1: You’re DIY’ing your copy
Go you! I always say that business owners are the very best people to write their copy (if they can master all those lovely copywriting skills too!) ‘cos they know their audience best. In theory, this means you can be super targetted with any copy you do.
So you’re now here, learning about web copywriting. A wireframe will help you a gazillion times over because
you’ll be able to plan and structure your web copy
you can prioritise what’s important (and have the ability to move things about and experiment if you’re not sure)
you can stay focused on how the page flows (without losing yourself in words)
you are less likely to forget important copy elements like testimonials, calls to action and button copy
Annnnddd, all these things will most likely result in better copy! So it matters.
Camp 2: You’re outsourcing your web copy to a pro copywriter, like moi!
Well, rest assured of all the benefits mentioned in camp 1 - they’re given.
PSA: Website copywriters who wireframe are ACE
But more than that, if your web copywriter is au fait with wireframes, it also means they understand the medium they are writing for. I’m not saying it’s a one-size-fits-all template, but there are certain formulas that work amazingly well across all websites - and a website copywriter who knows how this works will sketch out a wireframe for your copy before they even type one word.
This is why it matters to you. I don’t want to get all haughty-haughty, but I’d be questioning a copywriter doing web copy if you received a looooong document of copy and nothing else.
How to wireframe your own web copy
My most practical tip is to either grab a big piece of A3 paper or use a design application. I use Canva to make all my wireframes. Then get sketching out each page in boxes. You can put in rough headings (which you can, of course, tweak later), plan out where CTA and buttons go - and even testimonials too.
This is the basic way to get started. And you’ll find it a lot easier to ‘fill in the gaps’ when you start drafting the copy out.
What my web copy clients get
After the initial wireframe, some people find it useful to add stock images and a bit of colour to give you a real feel for how the copy comes to life. This is the approach I take with all my client projects.
Web copy, done right!
Are you thinking of rewriting your web copy in 2023? But perhaps you need some help. Check out my web copywriting services here.
If you’re ready to get your web copy started?
Book a discovery call here - and find out more.
Hey, I’m Zoe! Website & SEO copywriter.
I am a Cheshire-based copywriter who has clients all over the UK, ranging from child health & wellbeing specialists (think lactation consultants, independent midwives, paediatric dietitians and holistic baby sleep coaches) to architects, events companies, retail and more.
