The basic problem we face when selling online is getting our prospects all the way from our headline to our call to action.
We know our copy has to include all the important information prospects want…and nothing more. And we know it must be presented with the clarity of a well-polished shop-window.
But attention-spans online are short, prospects are unforgiving, and competition is typically more aggressive than a bull elephant with a trunk-full of bees.
That conspires to make our lives rather hard.
So to help ease your burden, here are 10 practical steps you can take to make the trip from headline to CTA slipperier than a jaunt down a well-buttered fireman’s pole. These apply regardless of whether you’re trying to get more signups from your homepage, more people clicking through to view a demo, or even if you’re selling a top-tier product from a landing page…
Reducing Friction with Words
1. Only include sentences that will move your prospect forward
Very often, a webpage will compound one irrelevant sentence on top of another. The first slows the prospect a little because it doesn’t say anything he’s interested in. He tries to relate it to his problem, but the connection isn’t there.
The second drags him down to a snail’s pace. And when the third is equally uninteresting he’s outta there. “So what?” he asks as he gives up. “I tried reading it, but I just didn’t care.”
This copy probably seemed very impressive when it was written. But come time to read it, all we’re left wondering is…so what?
Thinking about this kind of reaction can help you a great deal. Sit down and read your copy, and after every sentence simply ask: so what?
If you can’t give a good answer immediately, get rid of that sentence. It doesn’t belong there. Any sentence that doesn’t convey value, or imply that the next sentence will, is only hindering your prospect’s journey down the page. Remove them, and you’ll find that what is left are sentence that move your prospect forward. Those are the ones that matter.
2. The “You Rule”
Your prospect is not interested in you. He is interested in himself and his problem.
This means that you don’t start your homepage copy by talking all about yourself—a fiendishly common problem, especially for freelancers:
Every single piece of copy above the fold on this website is about its owner, rather than his prospects and their problems.
See anything here about Eva’s prospects or their problems? Neither do I. Even the note about sketchbooks, though directed at the reader, is about her.
There’s a good chance you just nodded reflexively as I told you this. Your eyes perhaps became slightly unfocused, and the drool reflex kicked in. “I know all that,” you’re thinking. “Get to the good stuff.”
The trouble is, even though you know it…you’re probably still guilty of it. Here’s an example from a company that should know better:
Copy from the homepage of a marketing agency. No doubt it’s meant to be cute, but will it keep busy prospects’ interest—since it says nothing about them—or will they simply ask: “So what?”
So let me challenge you now. Head on over to a page on your site that isn’t converting as well as you’d like, and count the number of times the words “I” and “we” and “us” appear. Compare that to the number of times “you” and ”your” appear.
If the former show up at all in your headline or first couple of paragraphs, as a general rule you’re in trouble.
And if the overall ratio isn’t skewed heavily towards “you” words, rewrite it.
Not that you can’t use “we” words—sometimes, for instance, telling a personal story that relates back to your prospects works very well. But you must be cautious. If you want to be safe rather than sorry, try getting rid of them and talking entirely about your prospect instead.
Another marketing agency’s homepage copy where the You Rule is broken—but in a more forgivable way. Would talking about the benefits directly, rather than disguising them in this way, produce a better result? Probably. But at least the overall emphasis is on the prospect’s goals.
Reducing Friction with Design
There’s no use making your copy friction-free if the design of your page actively prevents prospects from getting to the call to action—or even reading the headline in the first place!
There are 4 main ways design can generate friction. The bad news is your site is almost certainly guilty of them in one way or another, because there’s nary a site on the web that ain’t. The good news is that fixing these issues is pretty straight-forward if you’re actually willing to give it a try…
3. Fonts are all shot to hell
There is a huge problem with fonts on the web, and it completely destroys the readability of your text. Needless to say, if your prospect has trouble reading your copy, it doesn’t make the slightest difference how good it is.
This problem is that body copy is too small. Usability expert Jakob Nielsen conducted a survey into difficulties people have browsing the web, and discovered that bad fonts got nearly twice as many votes as the next contender—with two-thirds of voters complaining about small font sizes.
Since readership = revenue, the simple solution is to make your text big enough for your visitors to read easily.
How big? 16 px text on a screen is about the same size as text printed in a book or magazine. Therefore, anything smaller than 16px is probably too small.
On the left, 16px text displayed on screen. On the right, the same text printed in 12pt. If your website’ copy is smaller than this, it’s too small.
4. Colors make readers’ eyes bleed
The color of your page is just as important as the size of your text. A dark background with light text is, depending on who you ask, between 50% and 200% less readable than a light background with dark text.
For most people, reading this text for more than 30 seconds or so will lead to a painful sense that the words are too bright. Swap the colors, and you could read for hours.
Unfortunately, in correcting this problem, it has become something of an artsy fad to make dark text as pale a gray as possible without it disappearing entirely. True—dark gray looks better on screen than black. But if you take the grayness to extremes, it ends up illegible. Anything lighter than around hex code #444 is going to be very difficult to read.
5. Eyepath is all over the place
People read left to right, top to bottom.
When we first arrive on a webpage, we fixate very briefly near the center of the page—about where we expect the headline to be—and then we move up to look at the top left, so as to get our bearings. From there on, we read in an F-shaped pattern, taking in most of the first line of body copy, then scanning down the left margin, skimming the first few words of each line as we go.
Except when we can’t.
If this natural eyepath is interrupted, we generally don’t get to the call to action. And webpages do this in so many different ways, with so many different kinds of elements all competing for attention:
- Twitter feeds
- Opt-in forms
- Aside text
- And so on
Now, many of these elements may be necessary to the objectives of a page. But remember that the primary objective is the call to action—so elements which are actively distracting readers from that objective need to be carefully evaluated.
That said, the main culprit in nearly all cases is images. Most images on most websites achieve nothing except to distract readers and increase friction. If your images are not clearly conveying value, and are not clearly relevant to your content, then you should get rid of them.
This may surprise you, because it’s commonly accepted wisdom that images increase readership. In fact, they do not in most cases. Before and after shots do. Graphs and charts do. Product action shots do. Hero shots do. And captions on images definitely do. But random stock photos slapped onto the page to create “visual interest” do not—and neither do any other images which your reader can’t quickly figure out.
Very pretty—but where are my eyes supposed to rest first? And what are these images conveying? They seem utterly irrelevant to the content—there’s no value in them at all. Notice also the inconsistent font size, making the lede copy difficult to read, and falsely identifying it as a tag cloud.
6. The left margin keeps disappearing
Another common problem, related to eyepath, is that the left margin is inconsistent. Remember I said we scan down the page along the left margin? Yes, well how do you do that when the margin changes position? Left-floated images break the margin and force readers to readjust. Sometimes there is more than one left margin, because someone saw fit to place columns of text next to each other. That’s like having two or three people speaking to your prospect at once.
This is easily fixed. Float any images you believe you need on the right of the page. Put all body copy into a single column. Voila.
These images convey value very clearly, but where is the left margin? Everywhere. On the navigation. Squashed between two images. In three different columns. It makes reading feel erratic and difficult.
Decreasing friction is an excellent start, but why not finish on a high note? What can we do to actually increase momentum?
Well, assuming you’ve generated it nicely to begin with by using a strong headline and lede—which have got your prospect interested and hungry to know more—here are four elements you should be using. I haven’t included example images here, since you can just look at how I’ve laid out this article.
7. Regular subheads
Since most web readers scan rather than reading every sentence, it’s imperative to give them little chunks of text that stand out and help them move down the page at a pace which suits them. Subheads should convey the main value proposition of the section they’re attached to—resist the urge to use cute or mysterious copy here. Your prospect should be able to get the gist of your page just from reading the subheads.
These get higher readership than average. People appreciate the briefness and simplicity of bullets—and since they stand out visually, they’re a great place to reiterate or itemize key value propositions like features, benefits and proofs.
9. Alternating paragraph lengths
Making your page visually interesting is surprisingly helpful for increasing momentum. A series of paragraphs which are all the same length makes for a monotonous reading experience. Using a varied pattern makes your text more engaging.
It’s especially helpful to set key sentences apart as one-line paragraphs (bold face is also useful here).
10. Images with captions
Remember, I never said images are bad. I said most images on most websites are bad, because they don’t convey value and their visual dominance creates friction by distracting readers. But images which convey value, and especially images which convey value which is then summarized in a caption, can catapult readers down your page. Captions are read at least twice as much as body copy.
Your New Site Checklist
I’ve covered a lot of ground in this article, so let me quickly summarize all the main points I’ve talked about into a checklist you can use right now:
- Only include sentences that will move your prospect forward;
- Make sure you’re talking about your prospect, not about you;
- Check your font size—less than 16px is too small;
- Don’t use reversed text: dark and light is much more readable;
- Get rid of elements that distract from the natural F-shaped eyepath—especially images;
- Don’t let any element physically interrupt the left margin;
- Use regular subheads that summarize the value proposition of their sections;
- Itemize major value points using bullets;
- Create visual interest with alternating paragraph lengths;
- Use captioned images to convey value clearly.
Head on over to your website, check out how well it performs, and let us know your score in the comments.
About the Author: Bnonn is the author of a free video series on how to turn visitors into customers—part of his conversion-optimization course ‘Attention-Thievery 101’. Known in the boroughs as the Information Highwayman, he helps small businesses sell more online by improving both their copy and design. When he’s not knee-deep in the guts of someone’s homepage, he is teaching his kids about steampunk, Nathan Fillion, and how to grapple a zombie without getting bit.