How to write copy for website interfaces
Good writing is the secret sauce for a successful website. Jonas Downey of 37signals, the company behind project management tool Basecamp, explains how to do it right.
UI design is an incredible challenge. To do it right, you need a unique blend of many different skills. You need to be a good visual designer, with a strong eye for hierarchy; to know programming, so you can implement your work; to understand a problem's complexity at a macro level, and then zoom in on the details of each step in a flow; to be a creative, to imagine new approaches and ideas; to communicate your rationale to others, and remain open-minded to critical feedback; and to be a good writer.
Good writing is the secret sauce. It's the best way to reduce confusion in an interface, but the hardest thing to get right.
People don't read (much)
Jakob Nielsen's research in 2008 showed that people don't read much on the web. On average, they'll read only 20 per cent of the words on a page. With this in mind, designers started to undervalue text.
Now, we cut copywriting back to the bare minimum. We stuff our pages and posts full of big images and interfaces with obscure icons. The measly text we have left is often a low-quality afterthought.
Who cares, right? People don't read much anyway. Well, perhaps they don't read because they already know what they're trying to do, and this junky writing is simply a waste of their time?
Making it clear
Writing for interfaces isn't a matter of brevity. Brevity is a luxury that you can occasionally get away with. Most of the time, it takes quite a few words to explain what's happening. That's fine; a paragraph of clear instructions is better than a vague sentence. Though a clear sentence is better than both of those.
Here's an example. I worked on the recurring events feature for the Basecamp calendar, so you can schedule an event that repeats more than once. When you edit a recurring event, we have to pop up a dialog and ask what you intended. Did you want to change just that day's event? Or subsequent events, too? Maybe you didn't even know this event repeated, so you may be surprised at the question.
Basecamp examples
At first, I wrote: "You're moving a repeating event. Which events to do you want to update?"
- Only this event
- All events in the series
- Never mind
Good enough? Nope. What's a 'series'? What does this mean? What's going to change? There's no way to know. This text makes too many assumptions.
After some feedback, I tried a second version: "You're moving an event that repeats. Do you want to move all future versions?"
- Move all future versions
- Move this one only
- Never mind, don't move anything
This is a little better. Now we know that we're only concerned with future versions. But the copy still feels repetitive. After a bit more feedback, we ended here: "You're moving a repeating event. Do you want to move all future versions of this event too?"
- Yes, move all future versions
- No, just move this one and keep the others where they were
- Never mind, don't move anything
We added a lot of words! But now it's abundantly clear that moving one thing won't mess up the other things. Plus, it's more natural and friendlier to answer a yes-or-no question. It all boils down to editing. Say everything that needs to be said, but nothing more. Edit, edit and edit again until you get it right.
Quality writing is hard work that takes time, but it's worth it. Accumulated across your entire website or app, consistently good writing will help reduce your users' frustration, and your customer support burden to boot. Forget about the 20 per cent rule. Make your writing 100 per cent worth reading.
Words: Jonas Downey
Jonas Downey is a designer at 37signals in Chicago
This article originally appeared in net magazine issue 245
Liked this? Read these!
- The ultimate guide to logo design
- Useful mind mapping tools for designers
- Brilliant examples of landing page design
What are your tips for great interface design? Come and comment!
Thank you for reading 5 articles this month* Join now for unlimited access
Enjoy your first month for just £1 / $1 / €1
*Read 5 free articles per month without a subscription
Join now for unlimited access
Try first month for just £1 / $1 / €1
Get the Creative Bloq Newsletter
Daily design news, reviews, how-tos and more, as picked by the editors.
The Creative Bloq team is made up of a group of design fans, and has changed and evolved since Creative Bloq began back in 2012. The current website team consists of eight full-time members of staff: Editor Georgia Coggan, Deputy Editor Rosie Hilder, Ecommerce Editor Beren Neale, Senior News Editor Daniel Piper, Editor, Digital Art and 3D Ian Dean, Tech Reviews Editor Erlingur Einarsson and Ecommerce Writer Beth Nicholls and Staff Writer Natalie Fear, as well as a roster of freelancers from around the world. The 3D World and ImagineFX magazine teams also pitch in, ensuring that content from 3D World and ImagineFX is represented on Creative Bloq.
Related articles
- I’m impressed by eBay’s new human-centred UI design
- Upwork's new identity shows the importance of motion in modern branding
- Newly released Apple Developer videos on YouTube are a treasure trove of design insights
- "Empathy is absolutely crucial for success": a day in the life of UX director Sam Drury