This article first appeared in issue 223 of .net magazine – the world's best-selling magazine for web designers and developers.
‘Microcopy’ refers to the text adorning labels, buttons, calls-to-action and other website elements. Its function is to help instruct and inform users effectively. Like signs on a highway, microcopy can ensure that your users get where they need to be. Good designers know details matter and can be the difference between adequate and great design.
Microcopy is similar in that the choice of word(s) can impact greatly on a site’s effectiveness. As design affects how we perceive a site, the words we choose can do the same thing.
This is why Jason Fried of 37signals said “copywriting IS interface design”. Some areas to think about the microcopy on your website are calls to action, headlines and form elements.
Calls to action
Try to be specific and precise. Designing a button and labelling it ‘Sign Up’ may not be enough. ‘Try It For Free’ communicates that it costs nothing and that you can use it right now.
The main headline sets the tone for the rest of your site or app’s experience. A headline saying ‘We’re awesome, trust us!’ won’t cut it. Be descriptive: if you’re trying to sell a blogging app, perhaps ‘Try us for the easiest, most elegant way to blog’. This appeals to users’ desire for simplicity and beauty.
Forms are often complex. Well-written microcopy can help users out by prodding them along when they make a mistake or by ensuring they enter correct information the first time round.
Five examples to check out
1. Zendesk The customer support application Zendesk has ‘Try It Free’ as the text on their main call to action, with the tiny bit of text ‘No credit card required’ under the larger, bolder text. That’s very reassuring to new users who may want to try it out quickly without a commitment.
2. Geni The family tree-building website Geni has a bit of text under the email address field on the signup form that states ‘never shared, never spammed’. That’s a bold promise to not mess with you.
3. Basecamp The project management application Basecamp has the headline ‘Projects manage themselves with Basecamp’. This is descriptive and promises to make your life easier.
4. Virb The signup form for the website creation application Virb uses descriptive copy very elegantly to help users move quickly through the signup process.
5. Kickoff The collaboration software Kickoff has expressive and descriptive headlines as the kicking off point of their homepage.