Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Web Design & Development > Usability

  • Print
  • + Share This
This chapter is from the book

Design Page Layout to Invite the Sale

You're almost there. All you need to do now is ask for the sale! How your landing page is designed impacts your conversion rates. Does your current page lead shoppers down the path to a purchase, or does it let them wander aimlessly around your site? Here are some suggestions to reduce distraction while leading customers to the checkout line.

Position Critical Information Above the Fold

Product information, incentives, and the order button should all be seen on your landing page without scrolling. This section of a web page is also referred to as "above the fold." Verify that key selling information is visible on multiple computer screen resolutions. Your Webmaster may have designed your site for a 1024x768 screen resolution, without considering other sizes. Your audience members who use an 800x600 screen resolution will see a smaller portion of the web page (compare Figures 5.6 and 5.7). Can't they scroll down? Of course they can. But it's just one more step you can eliminate to let them complete their purchase a little easier and faster.

Figure 5.6Figure 5.6 Here is Blooming Bulb's landing page for "calla lily" at an 800x600 screen resolution.

Figure 5.7Figure 5.7 Here is Blooming Bulb's landing page for "calla lily" at a 1024x768 screen resolution.

Reduce Navigational Choices

One of the reasons why home pages don't work well as landing pages is that they have too many navigational choices. With links and buttons everywhere, picking a path can be overwhelming. Landing pages should have fewer links on the page. Some companies completely remove their navigation bar and provide only links to information that will help them complete the sale (such as shipping information and the privacy policy).

What you allow your customers to visit when they're on your landing page is up to you. Just don't give them so many choices that they'll leave that product shelf in your store to walk around. That's almost announcing "Hey, before you buy that, do you want to take a tour?" You have a stronger chance of losing them if you distract them before they've finishing shopping. Once they complete their purchase, then you can take them to a "thank you" page that offers them site–visiting suggestions.

Use Action Words

Have you ever been ready to buy something online, and once you're on that product page thought, "Where's the buy button?" On occasion, it's only a text link, and I'm looking for a graphic image to click. Put action words like "buy" or "order" in text links and as graphics. Adding "today," "here," or "now" to these words contributes to the sense of urgency you want to foster. Hotlink the product image to your order form, too.

If you offer an option in addition to making a purchase, give that option secondary placement. For two buttons stacked on top of each other, put "Buy Now!" above "Product Details." Encourage the sale first. I was on a site recently that put "Clear Form" before "Submit Form." I must have filled that thing out twice before I hit the correct button. I'm used to seeing the "submit" button first, and the reversed order threw me...twice!

Placement of your action words on a web page matters. According to Shari Thurow, marketing director and Webmaster for Grantastic Designs, usability studies across the board report that people tend to ignore the top 60 pixels of a screen because that's the typical placement for banner ads. Consumers have developed "banner blindness." Keeping that in mind, place the buy button in a prominent area of the screen, such as the middle of the screen, and use a different color to really draw eyes to it.

  • + Share This
  • 🔖 Save To Your Account