Designing for the Preview Pane

From: Sur La Table
Subject Line: Over 500 New Items – In Stores & Online
Date: Monday, August 23, 2010

From: Anthropologie
Subject Line: A homeward focus.
Date: Thursday, September 2, 2010

From: Dean & DeLuca
Subject Line: National Honey Month With Dean & DeLuca
Date: Thursday, September 2, 2010

Judging by the headline, you’re probably thinking: “Another blog about fitting all your content above-the-fold, I get it already!” Well, this isn’t one of those blogs.

As designers we all know the challenge in working within the fold. If you can fit all your information in that tiny bit of real estate, great! But when you have more information than you can fit, strive to make the scrolling-experience as intriguing and fun as possible. Here are 3 recent examples of how companies have done this well.

  • Sur La Table
    uses image placement to create a negative space that results in a waving motion, which you would only notice when scrolling.
  • Anthropologie
    uses arrows and staggered & tilted images which point in the direction you should be looking.
  • Dean and DeLuca
    uses dotted lines that swerve out of one section and into the next, drawing your eye to the next area.

Here are a few other oldies but goodies, from:


Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>