Microcopy: My New Obsession

Zazzle.com Contact Us page.

For the past eight months I’ve been involved in developing an app for my day job, and it has created a new obsession with microcopy. Microcopy is all of the little text most people don’t give a second thought – it’s the error messages, form copy, headers, completion messages and more.

So why is microcopy even important? Let’s take a look at some examples by looking at something almost every site has – a Contact Us page.

TheBay.com Contact Us Page screenshot.
http://www.thebay.com/webapp/wcs/stores/servlet/en/thebay/content-view/ContactUsEmail Accessed 01/05/2015.

This is thebay.com‘s Contact Us page. I do like the multiple options for contacting and the fact that the form is brought up front and centre – no need to scroll to eternity to find it. However, let’s think about the users coming to this page; they are likely frustrated – maybe something has gone wrong with their order or they can’t find the information they want. Now they are faced with a page full of text with few indicators as to where to look.

First, the text formatted as headings is all over the place. The options for how to contact, arguably the reason you are on a Contact Us page, are buried in the first paragraph text. But wait! There’s also a live chat option, which oddly appears directly over the form. Is that form for email or to enter the live chat? It’s very unclear.

And I won’t even mention the bold heading since I’m allergic to the words “Click here” as well as unnecessarily long link text.

If you do read to the bottom of the left column, you’re greeted with an asterisk marked warning paragraph:

**Please be sure your email pertains to the subject specified. Emails which do not pertain to the subject cannot be answered. You may send email regarding other matters to Customer Service. **

Yikes. Not really the tone I want to hear in the microcopy if I’m already annoyed and trying to reach out. Even stranger, when you go to select an email subject in the form dropdown, two of the options have a single asterisk – does that mean this message pertains only to them? Or not since the message has a double asterisk?

TheBay.com Contact Us Email Form dropdown menu.

There’s also an inconsistency with the spelling of “email/e-mail”. BUT back to the topic at hand! Here’s what happens when you submit via the email form.

TheBay.com Email form submitted.

The one thing this page has going for it is the thank you. Here’s what I think could really improve it:

  1. Give a concrete time frame (and commit to it). We’ll get back to you in two business days is much better than the wishy washy “try to get back as soon as possible.”
  2. The entire body content of this page is one line – why not use this valuable space? Offering upfront links to your social channels might be a start, especially if you monitor those channels for customer service (although in that case, they should have been presented as an option on the Contact Us page itself).

Next, an automated email is sent.

TheBay.com Email Auto Response

Here’s the timeline I was hoping for on the confirmation screen. The same problem of wasted real estate applies here, with the addition of a terrible email name (General Email Response) – it’s robotic enough to get an auto response without this reinforcement.

So let’s take a look at a company that’s doing a better job with this same process.

Zazzle.com Contact Us page.
http://www.zazzle.com/about/contactus Accessed 01/05/2015.

The overall look is much cleaner, and I love that first line of copy – the tone is helpful, cheerful and human. The links below points clearly to three frequently sought after options: Track My Order, Returns and International Shipping. Next, the Frequently Asked Questions are clearly marked and what are likely the most frequently asked ones are highlighted below that heading. Rather than clutter the entire page, further help is offered by a link to their help section. I still find the use of heading formats on the right slightly confusing; I’d rather see it be a bit clearer to show the two options of Email or Phone, with the corresponding information under each. I find that bolding the Hours headings confuses matters. Overall though, this is a much clearer page to navigate. Further down, you’ll find less frequent options like press inquiries, business development and large volume orders.

Clicking the Email button takes you to the Zazzle Support Portal – a name can mean so much, can’t it? The alternate title on a smaller screen shows as Community Portal – I don’t love the inconsistency, but both names imply good feelings of support and help, the very thing your user wants most at this stage. From this clean interface, you can submit your concern, browse support articles or search for an answer in the top right search bar.

The words we choose for every bit of our sites make a big difference about the sentiment your user experiences. Especially on pages your users might come to in an emotionally charged state, you want to make the process as painless and friendly as you can – and it starts with your microcopy.