Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Email Template Systems


Published on

Design once and code once! Email template systems are the fast, flexible way to quickly publish email campaigns from ONE template. Plus templates are a great catch all for email best practices in mobile, social, images-off and more.

Published in: Design, Technology, Business
  • Be the first to comment

Email Template Systems

  1. 1. Template SystemsMatthew CaldwellVP Creative & Agency Services
  2. 2. Yesmail Confidential 2Topics1. Why do we need a Template System?2. What is a Template System?3. Benefits of a Template Systems– efficiency & email best practices4. Sticky Content
  3. 3. Yesmail Confidential 3What you’ll learn about template systems1. Efficient – design once, code one2. Flexible – use one master for all emails. Every. Single. One.3. Catch-all for best practices - mobile, social, images off, testing4. Collaborative – Template Guide gets the teams speaking the samelanguage. Design expectations are set before email is even created5. Sticky – small, bite-sized content marketing that works
  4. 4. Why do we need aTemplate System?
  5. 5. Yesmail Confidential 5Why do we need to use one?1. Multiple templates are inefficient1. Designing each email in Photoshop and slicing/coding every timetime is inefficient and error-prone.
  6. 6. What is a Template System?
  7. 7. Yesmail Confidential 7Template System• Unified headers and footers with a largevariety of internal stacked sections• The sections can be reordered, deletedor duplicated to make many messagecombinations – from long newsletters toshort postcards• One template for all messages
  8. 8. Yesmail Confidential 8All Sections Newsletters Hybrids Postcards
  9. 9. Yesmail Confidential 9All Sections Newsletters Hybrids Postcards
  10. 10. Yesmail Confidential 10
  11. 11. Yesmail Confidential 11Commonly used sections• Feature – 2 to 5 different styles• All Image – flexible, fixed width, variable height• Article – 2 to 5 different styles: small, medium, large• Product 2, 3 and 4 across• Video, large & small• Social Dispatch & product reviews• All text – best for transactional
  12. 12. Yesmail Confidential 12A Template System Consists of:1. All Sections Master Layout 2. Template Guide 3. Style Guide (optional)
  13. 13. Yesmail Confidential 13Template Guide• Shows all sections and their names• Image sizes• Word countsMediumArticleImageRight
  14. 14. Benefits of a Template SystemEfficiency & Best Practices
  15. 15. Yesmail Confidential 15Why use a Template System? Speed & Efficiency• Design once, code once• “Design into the code” instead of “Photoshop > Slice > Code”• Designers simply change copy, images & URLs• When you first see initial email layout, it’s the actual codedmessage and could be sent within hours• Avoid designing each email in Photoshop then slicing every time– It’s inefficient, much time spent coding– It increases likelihood of errors
  16. 16. Yesmail Confidential 16Why use a Template System? Consistent & Standardized• Highly consistent branding• Email Teams (Manager, Designer, Copy,Coder) all with a clear understanding of thelayout• Teams refer to same sectional names…“For this message I want one feature, one video largeand one small article”• Everyone involved will have clearexpectations of what will be created• Surprise, delays or redesigns are avoidedEmailManagementProductionDesign& CopyStrategy
  17. 17. Yesmail Confidential 17Why use a Template System? email best practices• Mobile Ready• Images-off Ready• Social Ready• Dynamic• Quick Versions for testing
  18. 18. Yesmail Confidential 18Why use a Template System? Mobile Ready• Desktop is scalable• Responsive code for phones• CSS3 @media queries createa 2nd, true mobile layout
  19. 19. Yesmail Confidential 19Why use a Template System? Images Off Ready• Bulletproof buttons• Under image colorblocking• Alt tags with style• Clear separation of copyand image (no copy inimages)
  20. 20. Yesmail Confidential 20Why use Template System? Social Ready• First design your button / Call to Actionhierarchy• Then attach optional sharing icons– Shares a part of your email,not the entire email
  21. 21. Yesmail Confidential 21Why use a Template System? Dynamic• Fully hybrid layouts mean all copy is html, not images• Merging and database automation• Clean separation of copy and images means that anything can bemerged in dynamically (images, copy, urls)
  22. 22. Yesmail Confidential 22Why use a Template System? Flexible & Testable• Use one template for all (yes, ALL) emails• Everything from transactional to newsletters to postcards• The modular sections opens up major possibilities for testing
  23. 23. Yesmail Confidential 23Why use a Template System? Easily Rebrandable• Simple color changes (background, button, type, etc) allow youto use it for multiple business lines or different brands
  24. 24. Yesmail Confidential 24Q: Doesn’t it look similar each time?It does not have to.• The template is simply a container• The content in it is what keeps it fresh• Also we recommend regularly mixing and matching sections tocreate new combinationsQ: Is it part of the mailing system?No, but it can be.• Basically, it’s nothing more than a single HTML document• But it can easily be plugged into CMS tools, WYSIWIG editorsand drag & drop tools
  25. 25. Sticky Content
  26. 26. Yesmail Confidential 26Sticky Content• Small, repeatable, value-added, non-product content• Trains users to open“What are they going to do this time”• Keeps users opening and engagedTIP: Create sticky content as a project; for example, create 1year worth of sticky content at one time
  27. 27. Yesmail Confidential 27Sticky Content
  28. 28. Yesmail Confidential 28Sticky ContentCallawayFunny Golf QuoteWarner Bros TriviaQuestion
  29. 29. Yesmail Confidential 29Sticky ContentHP Tech at WorkJargon WatchMy Coke Rewards Comic
  30. 30. Conclusion
  31. 31. Yesmail Confidential 31Summary:Template Systems1. Efficient - code once and “design into code” each time2. Flexible – use one master for all emails. Every. Single. One.3. Catch-all for best practices - mobile, social, images off, testing4. Collaborative – Template Guide gets the teams speaking the samelanguage. Design expectations are set before email is even created5. Sticky – small, bite-sized content marketing that works
  32. 32. Thank youMatthew CaldwellVP Creative & Agency