Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

Designing Emails That Actually Work

29 100 vues

Publié le

These are the slides I presented at Mixwest 2014, a digital marketing conference in Indianapolis, Indiana. My topic was designing and building emails that perform well and deliver results on screens and devices of all kinds.

Publié dans : Design, Marketing
  • Unlock Her Legs is your passage way to a life full of loving and sex... read more >>➤➤ https://tinyurl.com/unlockherlegss
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici
  • Hey guys! Who wants to chat with me? More photos with me here 👉 http://www.bit.ly/katekoxx
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici
  • Lindsay, would you NOT agree that -Design alone is not the same as good messaging alone; while Design WITH Messaging is most powerful to build (and retain) response.
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici
  • Lindsay, while i agree with the bulk of your "design' comments in terms of increased visibility where was the messaging writing tips that keep all good communication (whatever the platform) communicating? Design will not work without a strong memorable message to make the mails point...
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici
  • Thanks for sharing such an informative and interesting presentation with us.
       Répondre 
    Voulez-vous vraiment ?  Oui  Non
    Votre message apparaîtra ici

Designing Emails That Actually Work

  1. @lindsaylee13
  2. @lindsaylee13
  3. @lindsaylee13 @lindsaylee13
  4. Email is Your Friend; It Does Not Suck. @lindsaylee13
  5. You Can Create Emails That Perform Well and Deliver Results. @lindsaylee13
  6. @lindsaylee13
  7. @lindsaylee13
  8. @lindsaylee13
  9. @lindsaylee13
  10. @lindsaylee13
  11. @lindsaylee13
  12. The subscriber experience is the flow in which someone digests your email before converting. @lindsaylee13
  13. From Name Subject Line Preheader Open Preview Pane Full Message Tap/Click Landing Page @lindsaylee13
  14. From Name ✔
  15. @lindsaylee13 Subject Line ✔
  16. @lindsaylee13 Preheader ✔
  17. @lindsaylee13 Open
  18. @lindsaylee13 Preview Pane
  19. @lindsaylee13 Full Message
  20. @lindsaylee13 Tap/Click
  21. @lindsaylee13 Landing Page
  22. @lindsaylee13
  23. Concise Content Over Length • Your email is a doorway into other channels • Tell them the essentials
  24. Scannable Layout • Clear headings • One or two column layout • Contrast of weight and color for content distinction
  25. Make Your Calls to Action Obvious • Only have a few moments to catch attention • Can you narrow down to one main CTA? • Repeat your main CTAs
  26. Be Transparent in Your Language NO • Click Here • Big Announcement! • You Don’t Want to Miss This! • New Items YES • Donate Now • Sign Up for Our Webinar • Start Your Free Trial Now • We Have New Shoes
  27. Remember Image Blocking • When possible, use HTML text instead of graphical text • Alt text is your friend
  28. Design with Mobile in Mind • 65% of all opens are on mobile • Single column layout • Make headlines ~28px • Body copy ~16-20px
  29. …More Mobile Considerations • Think about elements you see in apps • What can be communicated through icons? • Let your content breathe • Huge buttons
  30. Fun Stuff • Animated GIFs can add extra interactivity • Video…
  31. @lindsaylee13
  32. Email HTML CSS Images Text Design Links Hierarchy Web HTML CSS Images Text Design Links Hierarchy ✔ ✔ ✔ ✔ ✔ ✔ ✔ Some Ways Email and the Web are the Same
  33. Web <div> <h1> <p> em <style> background-color margin Email <table> <td> <td> px style=“font-face” bgcolor padding Some Ways Email and the Web are Different
  34. Time to Code Like its 1999
  35. Tables are Your BFFs • Use nested tables to structure the layout of your email • Poor support for CSS positioning, floats, and clears <table width=“600”><tr><td> <table width=“100%” cellspacing="0" cellpadding="0" border="0"> <tr> <td width=“250”></td> <td width="350"></td> </tr> </table> </td></tr></table>
  36. KYSS (Keep Your Styles Simple) • Inline CSS • Don’t attach styles externally • Can use some CSS3 but proceed with caution <table> <tr> <td style=“font-family:Helvetica, sans-serif; font-size:16px; font- weight:bold; color:#e98300;>Hi, I’m text!</td> </tr> </table> Hi, I’m text!
  37. Styling Block-Level Elements <h1>I am a headline</h1> <td style=“font-size:24px;font-weight:bold;>This is a headline in email</td> <p>I am a paragraph</p> <td style=“font-size:18px;font-weight:bold;>This is a paragraph in email</td> ✔ ✔
  38. Format Perfect Images • Style alt attributes • Set borders to “0” • Add style=“display:block” to prevent gaps • Set height and widths <img src=“http://www.emails.com/image/cat.j pg” height=“250” width=“200” alt=“Cute kitty” style=“display:block; font- family:Helvetica; color:#0084ff; font- size:18px;” border=“0”>
  39. What About Responsiveness?
  40. Responsive Email Uses Media Queries
  41. @lindsaylee13
  42. There are tons of email clients out there @lindsaylee13
  43. Know Your Audience • You never know…sometimes plain text emails will do the trick • Look for the lowest common denominator
  44. Email Client Market Share Stats from Litmus’ emailclientmarketshare.com, June 2014
  45. 65%of all emails are opened on a mobile device
  46. Test, test, test
  47. @lindsaylee13
  48. @lindsaylee13 Litmus Learning Center litmus.com/learning • Email client market share • Code tips
  49. @lindsaylee13 Email Design Review emaildesignreview.com • Lots of inspirational email design
  50. @lindsaylee13 ExactTarget Blog blog.exacttarget.com • Current market trends • Home to the Email Swipe Files
  51. @lindsaylee13 Email Swipe File on Pinterest pinterest.com/exacttarget/ email-swipe-file/ • Curated examples of great email design
  52. @lindsaylee13 Some People I Follow on Twitter ETMC Design @ETMC_Design Andrea Smith @andreasmith77 Chad White @chadswhite Justine Jordan @meladorri Brian Graves @briangraves Anna Yeaman @stylecampaign
  53. Thank You! @lindsaylee13

×