1. Creating Exceptional
Email Marketing
Messages:
Part 2

2. HTML Design Best Practices
• Think “in the box” when designing email
• Minimize number of screens and scrolling
• Intersperse images and text throughout
• Place the offer above the “fold”
• Ideally, in the subject line as well as body copy of message
• Remember the eye travels from left to right
• Link early and often
• Use animation minimally and strategically
• Animated gifs add uniqueness to your message, draw attention to calls
to action
• Make images and logos links
• If including a company logo in the message, standard practice is to
make it link to the company (or brand)’s homepage
• Consider designing on a grid for scalability

3. Example
• “Hooky” (!) headline
• Excellent use of images and
balance of text/images
• Main idea plus “legs”
• Good balance of text to
images
• Great consistency from
subject line to headline to
call to action

4. Optimizing HTML Email for Visibility
• Encourage subscribers to whitelist you
• Keep “view as Web page/mobile” links in pre-header
• Balance images and copy
• Add ALT-tags to images
» These tags allow the designer to insert descriptive copy or links
that viewers can read in place of blocked images
• Keep ALT-tag copy short and specific
• Less than 10 words is good, less than 5 best
• Include your call to action or description of image
• Include “bullet proof buttons” – HTML code the graphic vs.
inserting a link to image
• Test all URLs and links to ensure they work and display

5. “Bullet Proof” Elements Survive
• Universal Orlando
Resort email with
images off
• Color, font,
background and
shape hard-coded
into HTML survives
image suppression

6. Benefit of Balancing Text & Images
• Much more of
your content
survives and
can be acted
upon

7. Sephora Design – Images On
• Upper left corner
optimized for
visibility in preview
panes

8. Sephora Design – Images Off
• Even if images
don’t render
key links and
topics survive
• Still optimized
for visibility in
preview mode

9. Ulta Beauty – Images On
• Some preview pane
optimization, but
main links for top
two offers are
“below the fold”

10. Ulta Beauty – Images Off
• Prime position (upper
left hand corner) has
no link
• But, free shipping offer
and link survives image
suppression

11. Do Users Activate Images in Email?
• Consumers more likely
to activate images in
email from companies
they regularly do
business with, granted
permission to, or know
and trust

12. Top HTML Email Design Resources
• High Impact Designer by TemplateZone
• Hundreds of pre-designed, customizable email, landing page, and
social media page templates for one low price
• Free trial at www.highimpactdesigner.com
• Email Layouts.com
• Downloadable email newsletter layouts created by a pro designer
• Campaign Monitor – www.campaignmonitor.com/gallery
• Email marketing software for designers
• Phenomenal blog answers many HTML design questions specific to
email

13. Graphic Design Key Takeaways
• Think “architecture” vs. “art”
– Remember message building blocks
– Design body of message as a mosaic, not a canvas
• Know where response hotspots are and use them to your advantag
– Upper left? Upper right? Pre-header?
– Put color, icons here
• Utilize graphic design to group and organize content into visually
scan-able chunks
• Optimize for visibility if images don’t render (balance)
• Use graphics to enhance response vs. detract from it
– Images should show what your copy “tells”
• The confused eye doesn’t buy!

14. #5: Content
Old New Rule
Static; Generic or broadly segmented
NEW New Rule
Dynamic and contextually-targeted

15. Content from Two Perspectives
• Should be a mix of promotional,
Overall program informational, transactional over time
content • Balance broadcast, segmented, triggered
• Frequency, sequencing, cadence
• Balance of text and images
• Different templates for different types of
Individual messages
message content • Dynamic, temporally relevant
• Mix of static and rich media

16. Three Flavors of Email
Broadcast Segmented Triggered
• Announcement, • Targeted based on • Customized to an
newsletter, etc. specific subscriber individual based
groupings on actions or
• Entire list receives • Customized by or timing
the same message sent only to specific
segments of the • Re-active vs. pro-
total active
| 16

17. Customer Email Program Example
• Hewlett Packard monthly
newsletter
– HP Newsgram sent to all
registered customers
– Clearly-displayed issue month
and table of contents
– Value-added:
o Free projects
o Interactivity, video
o HP Daily Surprise
o Cross-sells HP products too
17

18. Other Message Types
• HP deploys a good
mix of newsletter,
sales promotions
(deals), and holiday
greeting emails
18

19. Apply and Align Messaging to the
Customer Lifecycle
• Each stage of the customer lifecycle naturally lends itself to specific
email messages
• Use them to shift and direct the dialog
Pre-conversion Conversion (All
Post-Conversion Relationship-Building
(Prospects) Customers)
• Invites to engage • Thank-you • Tier-specific messaging • Bouncebacks
• Email subscribe • Welcome/onboarding • By RFM • Loyalty program
welcome/first • Up-sells/cross-sells • Surveys • Purchase anniversary
purchase incentive • News and info • Renewals/reminders • Life event (birthday)
• Cart Abandonment • Demographic-specific • “Best customer” offers • Reactivation
• Browse Abandonment offers campaigns
• By gender, age

20. Mix it Up
• Storyboard your email program
– Some message frequency and sequencing can be planned, but allow
for triggered
– Create a flowchart illustrating message types, timing, frequency
• Don’t be “the friend who only calls when you need something”
– Although accustomed to heavy promotional message volume from
retailers, consumers also want conversation, community, news and fun

21. Compelling Email Content Ideas
• Evolve, supplement or refresh your static HTML or plain text
email with
– Animation
– Video
– Temporally-relevant campaigns
– Dynamic Content
• Movement and multi-media = more clicks
• Time, place and quantity-specific content = greater relevancy
= more clicks

22. Animation
• Use minimally
and strategically
• Movement is eye-
catching
• Can enable more
content than
static images

23. Video in Email – Two Approaches
• Link to self- or web-hosted
• Preferred for now due to spam blocking, filtering, image
rendering and streaming video support issues
• Streaming video into inbox
• Video or animation streams into the message over an
open connection to the Internet
• Requires no plug-ins or media players on subscriber end, works with any ESP
• Requires HTML5-based message design
• Current environments supporting video in email:
• Windows Live Mail (Hotmail) (H.264)
• Apple iPad mail client (H.264)
• Blackberry (BOLT 2.1) (OGG Theora)
• Apple iPhone mail client (H.264)
• Apple Mail 4 (H.264)
• Thunderbird (OGG Theora)
• Leading current solution: Liveclicker (www.liveclicker.com)

24. Self- or Web-Hosted Video
• Video in email tips:
– Alert them that the
email contains video
• Subject line and
headlines
• Put video front and
center
• Play/pause console
should be visible
– Host in your domain or
– Host on your YouTube
channel for longer shelf
life

25. Streaming Video into Message
• Liveclicker’s Video Email
Express is integrated
with several ESPs
– Generates simple HTML
code for inclusion in
email
– They host and deliver
video content
• Style Campaign also
handles video in email
(sans audio)
Example courtesy of StyleCampaign.com

26. Temporally-Relevant Content
• Beyond seasonality
and holidays,
leverage major
events, news
– But, tread
cautiously or know
your audience

27. Dynamic Content
• Big and getting bigger
• Content served can be based either on:
– database-attributes (i.e. gender)
• Aka “custom publishing” in which you predestine certain content
for certain users based on database profile attributes
– real-time response behavior (open on mobile)
• Use location, time and device to sense what should be served
• Aka evolutionary optimization
• Not just for email content – can define landing pages
too

28. Time-Based Dynamic Content
• Movable Ink’s
technology allows
emails like this one
(to a conference
attendee)
– to display live
counts of people
attending the event
– To have an offer
that changes by the
date or time
Example courtesy of Movable Ink

29. Other Dynamic Content Approaches
• This retail message
displays
– location-specific
store information
– Real-time inventory
updates
– Time-based offer
updates
Example courtesy of Movable Ink

30. Content Key Takeaways
• When it comes to your email program, serve a multi-course
meal, not the same dish over and over again
• Greater message variety = less predictability = higher interest
and engagement
– Continuity programs create high trust, so some email should come on
a regular schedule (newsletter)
– However the unpredictable gets noticed more
• Static HTML is fine, but with HTML5 video in email is again
possible
• One size-fits-all is out. Triggered and dynamic content will
dominate email of the future

31. Contact Information
• Karen Talavera
• Synchronicity Marketing (www.synchronicitymarketing.com)
• Email: karen@synchronicitymarketing.com
• Phone: (561) 967-9665
• Facebook: www.facebook.com/SynchronicityMarketing
• Twitter: @SyncMarketing
• Austin Bliss
• FreshAddress (www.freshaddress.com)
• Email: austin@freshaddress.com
• Phone: (617) 965-4500
• Twitter: @FreshAddress