Design for Your Subscribers

DESIGN FOR YOUR SUBSCRIBERSTips and Tricks to Increase Email Marketing ROI

LET’S TALK ABOUT…
Subscriber Experience
Performance-Driven Design
Code Matters
The Mobile Inbox
Landing Pages
Test, test, TEST!
Resources

WHY DOES DESIGN MATTER?
Design is the visualization of a business plan. More than a pretty picture, great design requires an actionable plan and measureable goals.
Design should acknowledge the subscriber experience.Put yourself in your subscriber’s shoes and understand how they will interact with your communications.
Design and technology are seamlessly integrated.Emails should be designed and coded to display properly in the various ways a subscriber will view it. A comprehensive testing strategy is essential to ensure success.

SUBSCRIBER EXPERIENCE
Consider the entire subscriber experience – from first impression to final click.
Each individual phase influences the decision to open and engage with your email.
Your email design is experienced in stages – not as a static page.
FROM NAME
SUBJECT LINE
PREVIEW PANE
ABOVE THE FOLD
COMPLETE EMAIL
CLICK THROUGH

It all begins with theFrom Name –
73% of subscribers click “Report Spam” or “Report Junk” based on this field.
*Email Sender and Provider Coalition
FROM NAME
IS YOUR FROM
NAME EASILY
RECOGNIZABLE?

SUBJECT LINE
69% of subscribers click “Report Spam” or “Report Junk” based on this line.*
IS YOUR SUBJECT
LINE RELEVANT
AND INTERESTING?
*Email Sender and Provider Coalition

SUBJECT LINE
69% of subscribers click “Report Spam” or “Report Junk” based on this line.*
IS YOUR SUBJECT
LINE RELEVANT
AND INTERESTING?

Images are disabled by default more than 50% of the time.Isyourkey message visible, relevant and enticing in this space?
PREVIEW PANE: IMAGES OFF
WHAT IS YOUR
EMAIL SAYING
WITH IMAGES OFF?

PREVIEW PANE: IMAGES ON
What’s your open rate? Only subscribers that turn images on trigger an open.Are you giving them a reason to keep reading?
AVERAGE PREVIEW
PANE DIMENSIONS:
300px by 300px

PREVIEW PANE & IMAGE BLOCKING
Hotmail - Images Off
Hotmail – Images On

ABOVE THE FOLD
Does your content above the fold provide motivation to respond? Are you persuading subscribers to scroll?
DON’T CRAM
EVERYTHING
ABOVE THE FOLD…
INTRODUCE CONTENT
ABOVE THE FOLD

COMPLETE EMAIL
Seconds – not minutes – to view an entire email
Only 11%* of those who open will scroll below the fold!
EVEN IN THIS VIEW
THE ENTIRE EMAIL IS NOT ONSCREEN AT ONCE
*The Nielsen Norman Group

Subscriber experience doesn’t end with the inbox
CLICK THROUGH
Don’t ignore the transition to your website, landing page, or other marketing collateral.
Ensure the products in your email are available on your site - better yet, map the individual products from the email to a product page.
“…A well-designed email means nothing if the landing pages don’t work well.” – Chad White

CONSIDER THE SUBSCRIBER EXPERIENCE
Is this the message you want to convey?

Brand Synergy • Content Hierarchy•Visual Hierarchy Engagement Techniques • Rendering Results •Tested Quality
PERFORMANCE DRIVEN DESIGN

Website
Email
Visual recognition of the brand across all media channels creates a seamless brand experience, creating trust to engage and transact.
BRAND SYNERGY

Wireframe
Preview Pane
Above the Fold
Create a content hierarchy, arranging each content element (text and/or image) and associated call to action with appropriate weight.
CONTENT HIERARCHY

Headlines utilizing size and color hierarchy
Secondary calls-to-action
Primary call-to-action
Maximize response by creating a visual hierarchy, using design techniques to guide the subscriber's eye through your email based on the content hierarchy.
VISUAL HIERARCHY
“Quick Bites” or summaries

Preheader Teaser Text
Forward to a Colleague
In This Issue
Read More Link
Subscriber Q&A
Lifestyle Imagery
Use of Background Color
Link to External Video
Recovery Module
Use design techniques to engage the subscriber through a mix of emotive and rational imagery and content. Smart use of images, borders, buttons, links, charts, colored backgrounds, etc.should be applied and tested.
ENGAGEMENT TECHNIQUES

Optimized Design
Non-optimized Design
Main call-to-action in prime placement
HTML text in
web safe fonts
If an email is created primarily with images,
it will not display effectively when images are blocked.
Designed with image-blocking and preview pane viewing in mind.
Ensure your design efforts are viewed as intended once they hit the inbox. Emails that are created with the subscriber experience in mind will have a greater chance of success.
RENDERING RESULTS

*Fingerprint from Litmus, February 2010
Only comprehensive testing will validate successful rendering of design and ensure functional performance prior to sending to the subscriber inbox.
TESTED QUALITY
*ExactTarget via Fingerprint from Litmus, Feb. 2010

NEWSLETTER DESIGN CONSIDERATIONS
Include a Table of Contents or In This Issue Section
Include a 3-4 sentence teaser for articles with a “Read More” link instead of including the full article
Introduce your main call-to-action within the preview pane and other important content above the fold
Develop a visual hierarchy for headings, subheading, and body copy for easy scan-ability
Use images selectively to eye track to engagement areas

POSTCARD DESIGN CONSIDERATIONS
Your message should have a singular focus; don’t let your postcard become a newsletter
Make that message the Hero in your design
Introduce your main call-to-action within the preview pane and other important content above the fold
Consider the placement and inclusion of secondary messaging that supports your main focus

TRANSACTIONAL DESIGN CONSIDERATIONS
Position content front and center; keep it simple
Don’t include too much cross-sell information (follow the 70/30 rule)
Use a higher text to image ratio
Use font colors and sizes to create a visual hierarchy
Send a branded HTML email instead of Plain Text

CODE MATTERS!
HTML for email is different than HTML for the web
Modern web design utilizes CSS (cascading style sheets) for layout. However, due to inconsistent CSS support, HTML tables must be used for email layout. CODE LIKE IT’S 1999!
No standards exist for displaying HTML in email.
Proper syntax still counts – use a validator to check for general errors.
Beware of:
Forms, surveys, search bars
Javascript
Video/flash
Animated .gifs
Background images

THE MOBILE INBOX
Smartphone users use mobile email primarily for triage
There are no standards in place for displaying emails on smartphones
Most mobile devices display a “stripped down” version of the HTML portion of an email, NOT the plain-text version
Optimizing your emails with HTML text in web-safe fonts will benefit smartphone users as well
Consider including a link in your email to view a mobile friendly version of your email
One-column designs hold up best on mobile devices

LANDING PAGE TIPS
Leverage web analytics to design for your audience
Monitor Resolution, Browser, User behavior

LANDING PAGE TIPS
Continuity – graphics, offers, headlines, imagery, data
Set expectations, and follow through accordingly
Keep forms simple
Honest, clear, concise copy – use bullets!
Avoid extra elements (navigation, sidebars, images…)
Don’t be afraid to re-state value
Use seals!
Same rules of email apply to landing pages

EXTREME MAKEOVER:EMAIL DESIGN EDITION

PIER 1 IMPORTS

DESIGN “A”

DESIGN “B”

DESIGN “C”

DESIGN “C”
DESIGN “A”
DESIGN “B”
WHICH DESIGN PERFORMED THE BEST?

PIER 1 RESULTS
MEASURES: CTR of Delivered Emails
Unsubscribe Rate
Sales Generated by Subscribers
WINNER: Generated 86% More Clicks Than Other Competitors
Generated 25% More Sales Than Nearest Competitor

WINNER: DESIGN “A”
BUT…

AAA OHIO

DESIGN “A”

DESIGN “B”

DESIGN “C”

DESIGN “B”
DESIGN “A”
DESIGN “C”

AAA OHIO RESULTS
Projected Renewal Revenue
WINNER: Outperformed Control CTR by 26%
Outperformed ProjectedRevenue of 2nd Place by 4%

WINNER: DESIGN “C”

MARKETING EXPERIMENTS

DESIGN “A”

DESIGN “B”

DESIGN “C”

DESIGN “C”
DESIGN “A”
DESIGN “B”

MARKETINGEXPERIMENTS RESULTS
Unsubscribe Rate
WINNER: Outperformed 2nd Place by < 2%
Outperformed Control CTR by 26%
Outperformed ControlUnsubscribe Rate by 15.9%

WINNER: DESIGN “B”

LANDING PAGE TESTS
Control:
Horizontal
Vertical

5 THINGS WHITEPAPER
Total Leads Generated: 88
Total Leads Generated: 102
LIFT: 34%
Total Leads Generated:76

DESIGN ELEMENTS TEST
Buttons
vs
Text
> 230 characters
< 130 characters
vs
Imagery
vs

WINNING COMBINATIAON
DESIGN ELEMENTS TEST
Buttons
vs
Text
> 230 characters
< 130 characters
vs
Imagery
vs

AS A RESULT

Subject Lines
Sender Lines
Personalization
List Segmentation
Greeting Text—Content
Greeting Text—Style
Body Text—Content
Body Text—Style
Closing Text—Content
Closing Text—Style
11. Images
12. Offer / Promotions
13. Response Buttons
14. Day / Time Sent
15. Color
16. Coupons
17. Pricing
18. Free Trial
19 HTML vs. Text-Only
20. Unsubscribe
21. Taglines
22. Creative
23. Press mentions
24. Store Locations
25. Phone Numbers
26. Animations
27. Charts
28. Strikeouts
29. Signatures
30. Testimonials
31. Celebrities
32. Polls / Surveys
33. Call to Action
34. Sound
35. Numbering
36. Themes
37. Discounts
38. Refer a Friend
39. Click to Talk
40. Email Sign-up
100s of Potential “Success Factors”
TEST, TEST, TEST!
Insights gained from testing may be applied to ALL Marketing Channels
(TV, Radio, Print, Tradeshows, Web, Email & Search)

EXACTTARGET RESOURCES

EXACTTARGET DESIGN RESOURCES
Design Tipsfor Outlook 2007
Email MarketingDesign & Rendering:
The New Essentials
Email Design Checklist
Email Designfor Lotus Notes
CareerBuilder.com
Case Study

EXACTTARGET DESIGN RESOURCES
Design Team Blog
New posts weekly!
blog.exacttarget.com
MarketingExperiments
Maximize Agency ROIthrough testing
Design Team Tweets
@ETDesign
twitter.com/etdesign

THANKS!QUESTIONS?

Design for Your Subscribers

by meladorri on May 24, 2010

Accessibility

Categories

Tags

Upload Details

Usage Rights

1 Embed 94

Statistics

Design for Your Subscribers — Presentation Transcript