Landing Page Design: Eye path vs. Thought sequence
I was impressed by the clarity of the headline and imaging of RealGoodsSolar’s landing page and later provided suggestions for testing their various sources of traffic to build dedicated landing pages for distinct levels of motivation.
Today, I wanted to add one last piece of analysis: the thought sequence effected by the page. “Eye path” is a concept often invoked by usability and user interface (UI) specialists. However, “eye path” is passive. What we want to optimize is the thought sequences in the mind of page visitors to lead them to the desired action, and to do that we must deliberately position content in the clearest and easiest-to-absorb sequence.
The rest of this post is presented in the general order of the expected thought sequence of a visitor to RealGoodsSolar’s webpage.
Headline and introduction
As it does, the headline should provide a succinct reason to read on, reflecting a key aspect of value: “Why spend $100,000 on electricity?” Exact copy can be refined further, but the key suggestion of savings is instantly powerful.
Next, a short introductory paragraph elaborates on the bold statement above and, again, provides a reason to read on. However, the form in the right column now competes for attention: is the visitor to continue reading, or has all the requisite information been provided already?
A highly motivated visitor may be ready to complete the form, while a more apathetic visitor may be pushed away. A good solution is to provide a call-to-action button for the highly motivated visitors, while using most of the real estate at the top of the page to continue expressing and supporting the value proposition.
Clearly, visitors with low motivation are addressed on this page: there is much more value proposition and supporting copy at the bottom. However, this sequence contradicts the logic of the page, as the visitor would be done with the form before seeing that content.
Primary and supporting expressions of value
Testimonials are a powerful way to support your value proposition. However, they rarely replace stating your value proposition explicitly. We consider testimonials and endorsements “supporting” content, which should be positioned on the page secondary to primary content.
Relying on video to communicate value to a new visitor is risky. Video is a powerful medium, but when you are dealing with short attention spans, you could be communicating much more in a fraction of a second using text than with a minute of video. While video content may be more effective, your visitor may have bounced before the video would take effect (or even without ever playing it).
RealGoodsSolar provides not only a clear next step, but also an explanation of subsequent steps. This tactic produces a low-friction and low-anxiety way for the visitor to engage. However, getting to the form is counter-intuitive. Paraphrasing Donald A. Norman in The Design of Everyday Things, design that requires instructions is bad design.
The arrow pointing to the form reveals the design flaw here: the layout of the page doesn’t correspond to the proper thought sequence. The headline gets initial interest and leads the visitor to primary content that expresses value. The expressions of value should lead the visitor to want to act.
Testimonials have been shown to increase conversion when used in close proximity to the value-exchange elements on the page—the form, in this case. Moving testimonials immediately below or next to the form, and moving the form altogether to the bottom of the page, while allowing primary content to occupy the top would produce a logical sequence of thought in the mind of the visitor and maximize conversion.
Optimization Summit 2011 - June 1-3