In my first post on the subject for Copyblogger, Seal the Deal: 10 Tips for Writing the Ultimate Landing Page, I devoted most of my time to copywriting tips since, well, I’m a copywriter. I craft the words.
Unlike direct mail, however, the web is a strongly visual medium. Good design helps support the content, leading the visitor’s eye from here to there and directing them through your message layer by layer, step by step.
This is especially so in the formatting of an effective landing page. That’s why I’ll devote myself to the overall look, feel, and formatting of effective landing pages for this post.
Copywriters don’t have to be designers. But copywriters who understand effective landing design fundamentals – what works and what doesn’t – will be better able to work and share ideas with designers. That means you and your entire creative team will be on board and working toward the common goal of capturing more conversions.
Omniture recently released a white paper called, Best Practices for Conversion: The New Engagement Funnel in 7 Steps. Their Step #3: Organize and Optimize Site Structure does a nice job of laying out some basic guidelines that will help you organize and format your copy for maximum results:
- Scrutinize your competition’s design and organization flow of their landing pages: Go through their conversation process and note the places where you feel a bit stumped or put off. Then go back to your own landing page and compare. Consider what you could revise or eliminate for better effect.
- Put your most critical landing page elements in the upper 300 pixels of the page: Usability research shows over half of your site visitors will NOT scroll “below the fold.” So forget the warm-up copy, get right to the point, and keep your value proposition at first screen view.
- Think simple: Use a one-column format with ample margins and white space to increase reading comprehension. Break up big paragraphs into smaller paragraphs — and no more than 5 lines per. You want to encourage visitors to read and engage with your message. Dense-looking copy doesn’t get read, period.
- Be obvious and use standard usage conventions: Underline your links, be clear. descriptive and specific when describing them. No visitor should have to work to use your page or understand your message.
- Make sure your page loads quickly: There are still millions of people using dial-up. Depending on your marketing and your product/service mix, strive for an 8-second or less page load. Don’t plump your page with unnecessary graphics. Optimize essential graphics to reduce file size and load time.
But wait, there’s more! Here are 5 more tips you’ll want to review and keep handy:
- Format your page according to the F-Pattern Eye-Tracking Principle: Web readers tend to track through content in a rough F-shaped pattern. So format important images flush left. (For more on this, see Jakob Nielsen’s eyetracking research.
- Use the same color palette/visual elements from your ads on your landing page: There should be a smooth, consistent flow to help keep your prospect oriented and assured that they are indeed “landed” in the right place.
- No clipart! Choose a single dominant photo image to be your hero shot: Use a product photo or, in the case of a service, you could use your logo or even a photo of your location. Make it clickable and don’t forget to add a benefit-rich caption.
- Put your message, copy or image, close to the middle of your page. Less critical elements can be placed in sidebars or perhaps even eliminated.
- Make it easy to complete your input form: For example, have the input cursor hop instantly from field to field upon completion. Let your user tab around fields. No drop-down menus, require only a checkbox action. And my personal favorite — auto-populate any fields you can.
Remember, your landing page is your visitor’s last stop to buy something outright or Step 2 if lead generation is your goal. Whether it’s one step or one of many, your copy and design has to focus on firing-up your visitor’s self-interest as well as build confidence and trust in your product/service and in you/your company.
So be honest, forthright and leave the “cheese” behind.
Roberta Rosenberg is the Copywriting Maven at MGP Direct, Inc.
22 comments... add one
#1 Janet → 05.17.07 at 1:00 pm
Great summary Roberta! I recently had to write a landing page for a web event that didn’t have a good headshot of the speaker. I used a stock photo of a happy-looking guy. It still worked well.
I also find myself constantly checking to make sure that branding and language are the same from ad creative, to landing page, to registration form. Sometimes when different people create different campaign components, it’s easy for small differences to sneak in.
#2 Idiot Affilate » Blog Archive » What exactly is a value proposition and Why You Should Be Make a Value Proposition For Your Site → 05.17.07 at 1:29 pm
[…] I was reading over CopyBlogger’s latest post “Seal the Deal Part II: 5 Tips to Designing to designing the U…” and was intrigued with the second bullet point on his list. I have underlined the part I […]
#3 Tom Chandler → 05.17.07 at 2:43 pm
Good post! Copywriters aren’t typically designers, but you’d better be able to speak the language. Most designers aren’t much involved in the “selling” end of the gig, and often make fundamental errors in the layout — mistakes that can cost you the ballgame in direct response.
The ability to explain what’s needed and why it needs to be that way is critical to the success of a project.
#4 Rico → 05.18.07 at 1:51 am
I guess the one common thing that ties all your tips together is “make it easy for the potential customer.”
#5 Creative Tips → 05.18.07 at 5:23 am
Hi Roberta,
Excellent post. I am a designer and also write copy for our website and I find it very difficult to balance the two aspects.
I used to believe that since we are in the design field, our landing pages should be “design rich” and less words. Sort of like “let our work speak for itself”.
Over time I have come to realize, the portfolio, the overall design of the site only helps so much. These two aspects must be supported by usuability features such as the one you have decribed above.
We are in the middle of a massive redesign of our website (the new design is now live in our blog) which will hopefully focus more on usability and less on dense graphic rich page layouts.
Jeff Marsh
#6 5 Tips for Designing the Ultimate Landing Page » Webdesign Archive → 05.18.07 at 7:57 am
[…] CopyBlogger 5 Tips for Designing the Ultimate Landing Page. [go] Related resources Blog Design: How Many Columns?The Principles of Beautiful Web […]
#7 John Richardson → 05.18.07 at 11:38 am
Great post, Roberta. I was wondering with your second tip on placing important content in the first 300 pixels, how that relates to copy length. Do you like long sales letters?
John
#8 Robert Gorell → 05.18.07 at 11:54 am
It’s also important to think of your landing pages in terms of the overall customer experience. It’s all about helping people buy. Online, the challenge is to make that experience as real as it is if I walk into your ice cream store and order two scoops.
Holly Buchanan wrote a really good piece about “Hitting the Landing Page Optimization Brick Wall” over on GrokDotCom. It’s worth checking out.
#9 Roberta Rosenberg → 05.18.07 at 1:39 pm Copyblogger
John, I don’t like or dislike long sales letters as I don’t like or dislike any specific promotional format. The trick is to match the right format with the right offer to the right audience. Long form sales letters have their place, but it isn’t everywhere :=)
And do check out GrokDotCom.com - it’s a favorite of mine on conversion topics.
#10 This Week In SEO - 5/18/07 - TheVanBlog → 05.18.07 at 6:23 pm
[…] Seal the Deal, Part II: 5 Tips to Designing the Ultimate Landing Page […]
#11 Ben Sinclair → 05.18.07 at 9:16 pm
Do you have a source for your below the fold statistic?
#12 Blogoholcia 5/18/07 | Evolvor → 05.18.07 at 9:58 pm
[…] Finally, our friends at Copybloger have a nice little piece on how to create an effective landing page. […]
#13 Roberta Rosenberg → 05.18.07 at 11:14 pm Copyblogger
Hi Ben, the source for the below the fold statistic comes from the Omniture white paper I cited. However, I did this article which discusses how the fold line changes depending on the viewer’s screen resolution. You can read it here.
#14 Working at Home on the Internet → 05.20.07 at 6:31 am
[…] Sealing the Deal, Part II: 5 Tips for Designing the Ultimate Landing Page by Roberta Rosenberg (on CopyBlogger)… Roberta has a series of Sealing the Deal posts describing the Hows and Ways to go about getting customers to follow through. […]
#15 E-Mails Aren't Direct Marketing? A Quick Look at the Most Misunderstood Media Channel → 05.22.07 at 4:14 pm
[…] Key Subject Matter at the Top: Roberta “The Copywriting Maven” Rosenberg suggests that the key content in a landing page should be found in the top 300 pixels, and that’s likely good advice for e-mail too, though […]
#16 Jolly Green Girl → 05.25.07 at 11:46 pm
Awesome tips. I have been playing around with my page design for awhile now.. and it’s good to know these things…
#17 What's The Secret To Building The Ultimate Landing Page? « Opt-In List Secrets → 06.03.07 at 12:15 pm
[…] Here, check this out […]
#18 Expression Engine Designer → 01.04.08 at 11:40 am
Does anyone have some examples of quality landing pages? I’d like to see this fleshed out.
#19 This Week In SEO - 5/18/07 | TheVanBlog → 01.30.08 at 11:03 pm
[…] Seal the Deal, Part II: 5 Tips to Designing the Ultimate Landing Page […]
#20 Rory Fitzpatrick → 04.16.08 at 11:41 am
Thought I’d point out that more recent research has shown that users are a lot more happy to scroll down web pages than they previously were (study by NeilsonNorman group last year). Thats not to say that you have more time to grab their attention, just that its OK for important content to be below the fold.
#21 Roberta Rosenberg → 04.16.08 at 12:00 pm
@Rory - I wouldn’t disagree except … your above the fold content has to have enough “oomph” to get folks to scroll for more message found below the fold. Thanks for your input!
#22 Doug Kessler → 05.01.08 at 11:18 am
Nice one. The usability principles of Don’t Make Me Think.
Leave a Comment