When it comes to email design best practices, it is imperative that artists review their creative from the user’s point of view. Since emails load into inboxes from the top down, the content you want users to see first should be placed at the top of the email to grab their attention and inspire interaction. This area of your email template is called the “above-the-fold” section and can make or break an email design.
Since you only have, on average, 420 pixels of vertical space, this area doesn’t give you much room to toy with the images and copy needed to truly feature your content. Factor in some additional space for a logo, main navigation bar and myriad of social networking icons, and the top of your email design is starting to get crowded.
With so much going on at the top, it’s easy to get caught up in the technical aspects of the “template,” rather than the creative, eye-catching promise of the “design.” To help gain some critical distance and assess the challenges properly, let’s review some examples of above-the-fold sections. Each sample below has been vertically measured at 420 pixels, which is a good average number of what users will see before they have to scroll:
American Museum of Natural History does an excellent job of building an efficient and good-looking above-the-fold area. Not only is most of the main feature section displayed in the preview pane, but smaller sub-features make it in there as well. Utilizing a clean design with minimal copy and navigation, this template works harder than most at getting the user to interact from the start.
This above-the-fold section from vente-privee presents the main message in a very clean and well-designed format. The best practice mandatories, such as the logo and pre-header text, are present, but since the email is more of a postcard type of communication, the navigation bar was left off. The user will appreciate this, since cleaner designs with less content in them have been shown to perform better.
The above-the-fold area for this ShermansTravel design is dominated by an ad banner, which pushes the rest of the content down. In this scenario, it’s important to compensate for the banner with a clean, well-organized design that can visually work with any banner, regardless of its look and feel.
Pay attention to the above-the-fold section, and your users will appreciate it. It’s important to test out what’s working and to throw away what’s not. I can help—contact me at lkaniper@danacommunications.com. Good luck and happy designing!
