SlideShare ist ein Scribd-Unternehmen logo
1 von 8
Back to the Future:
Creating and Testing Responsive Email
Templates
By Lyn Muldrow, Front-End Developer
Coding like it’s 1999!
What’s the best thing about html emails?
Lead Generation
Customer Retargeting
Message/Brand Reinforcement
OUTLOOK
History and Use
Responsive Email Design was
coined by Ethan Marcotte circa
2010
Emails should offer a consistent
experience across devices
Speed, interaction, and
accessibility at the forefront of
design
Responsive, or nah?
webkit and moz used, but the
emails are still broken!
Bad
GOOD
Oh, the pain!Common pain
points include:
image sizes
nested tables in nested
tables
deprecated code bugs
(Outlook)
testing across platforms
inline CSS
What can we do?
Use effective, descriptive media
queries
Use templates that have been tested
across platforms
Consider deprecated HTML/CSS that
works:
<tbody>
<tfoot>
Create specific criteria for use cases
Testing, Testing, Testing!
Litmus, Email Lab, Mobile/RWD Tester
Resources/References
Email Lab: http://bit.ly/1IIQ5XD
Mobile/RWD Tester: http://bit.ly/1KJec7F
Litmus: http://litmus.com
Understanding Mobile Email: https://litmus.com/lp/mobile-email-kit
Twitter: @LynMuldrow
Facebook: http://facebook.com/lynmuldrow1
Email: hi@lynmuldrow.com
Web: http://lynmuldrow.com

Weitere ähnliche Inhalte

Andere mochten auch

John Ryan portfolio Type CV
John Ryan portfolio Type CVJohn Ryan portfolio Type CV
John Ryan portfolio Type CV
John Ryan
 
LEE HADLEY CV v8.1 (Post DABD)
LEE HADLEY CV v8.1 (Post DABD)LEE HADLEY CV v8.1 (Post DABD)
LEE HADLEY CV v8.1 (Post DABD)
Lee Hadley
 
CV-Europass-20161108-BrihacelVlad-EN
CV-Europass-20161108-BrihacelVlad-ENCV-Europass-20161108-BrihacelVlad-EN
CV-Europass-20161108-BrihacelVlad-EN
Nicusor Brihacel
 
KSI Presentation Expediting 2014
KSI Presentation Expediting 2014KSI Presentation Expediting 2014
KSI Presentation Expediting 2014
Samanta Ribeiro
 

Andere mochten auch (12)

Actividad 3 n .j.f 801
Actividad 3  n .j.f 801Actividad 3  n .j.f 801
Actividad 3 n .j.f 801
 
Resume_Nishat_Parveen
Resume_Nishat_ParveenResume_Nishat_Parveen
Resume_Nishat_Parveen
 
John Ryan portfolio Type CV
John Ryan portfolio Type CVJohn Ryan portfolio Type CV
John Ryan portfolio Type CV
 
LEE HADLEY CV v8.1 (Post DABD)
LEE HADLEY CV v8.1 (Post DABD)LEE HADLEY CV v8.1 (Post DABD)
LEE HADLEY CV v8.1 (Post DABD)
 
CV_Harja_2016
CV_Harja_2016CV_Harja_2016
CV_Harja_2016
 
Eurostat échanges courants
Eurostat échanges courantsEurostat échanges courants
Eurostat échanges courants
 
Propostas de venda únicas para ferro heme
Propostas de venda únicas para ferro hemePropostas de venda únicas para ferro heme
Propostas de venda únicas para ferro heme
 
Festival de cine_unad
Festival de cine_unadFestival de cine_unad
Festival de cine_unad
 
Kirac sigorta sirketleri 0532-787-95-65
Kirac sigorta sirketleri 0532-787-95-65Kirac sigorta sirketleri 0532-787-95-65
Kirac sigorta sirketleri 0532-787-95-65
 
Semiotic Thinking For Marketers - Semiofest 2013, Barcelona
Semiotic Thinking For Marketers - Semiofest 2013, BarcelonaSemiotic Thinking For Marketers - Semiofest 2013, Barcelona
Semiotic Thinking For Marketers - Semiofest 2013, Barcelona
 
CV-Europass-20161108-BrihacelVlad-EN
CV-Europass-20161108-BrihacelVlad-ENCV-Europass-20161108-BrihacelVlad-EN
CV-Europass-20161108-BrihacelVlad-EN
 
KSI Presentation Expediting 2014
KSI Presentation Expediting 2014KSI Presentation Expediting 2014
KSI Presentation Expediting 2014
 

Ähnlich wie Back to the future: creating and testing responsive email templates

Email building best practice - a guide for designers
Email building best practice - a guide for designersEmail building best practice - a guide for designers
Email building best practice - a guide for designers
VRAMP Employee Engagement
 
(UK Version) Email Design Approaches That Work for All Devices
(UK Version) Email Design Approaches That Work for All Devices(UK Version) Email Design Approaches That Work for All Devices
(UK Version) Email Design Approaches That Work for All Devices
Litmus
 

Ähnlich wie Back to the future: creating and testing responsive email templates (20)

Email building best practice - a guide for designers
Email building best practice - a guide for designersEmail building best practice - a guide for designers
Email building best practice - a guide for designers
 
Mobile Email User Experience Strategies
Mobile Email User Experience StrategiesMobile Email User Experience Strategies
Mobile Email User Experience Strategies
 
Samples - web design, blog posts, and infographics
Samples - web design, blog posts, and infographicsSamples - web design, blog posts, and infographics
Samples - web design, blog posts, and infographics
 
HTML email best practices
HTML email best practicesHTML email best practices
HTML email best practices
 
HTML email best practices
HTML email best practicesHTML email best practices
HTML email best practices
 
20 Tips to Improve Productivity with Microsoft Teams
20 Tips to Improve Productivity with Microsoft Teams20 Tips to Improve Productivity with Microsoft Teams
20 Tips to Improve Productivity with Microsoft Teams
 
20 Tips to Improve Productivity with Microsoft Teams Accel365
20 Tips to Improve Productivity with Microsoft Teams Accel36520 Tips to Improve Productivity with Microsoft Teams Accel365
20 Tips to Improve Productivity with Microsoft Teams Accel365
 
Single sourcing to the max
Single sourcing to the maxSingle sourcing to the max
Single sourcing to the max
 
Email Is Dead... Long Live Email!
Email Is Dead... Long Live Email!Email Is Dead... Long Live Email!
Email Is Dead... Long Live Email!
 
Sexy Email Lisa Harmon Responsys
Sexy Email Lisa Harmon ResponsysSexy Email Lisa Harmon Responsys
Sexy Email Lisa Harmon Responsys
 
Code generation
Code generationCode generation
Code generation
 
Common email display issues - a guide for email marketers
Common email display issues - a guide for email marketersCommon email display issues - a guide for email marketers
Common email display issues - a guide for email marketers
 
Standards Based Approach to User Interface Development
Standards Based Approach to User Interface DevelopmentStandards Based Approach to User Interface Development
Standards Based Approach to User Interface Development
 
(UK Version) Email Design Approaches That Work for All Devices
(UK Version) Email Design Approaches That Work for All Devices(UK Version) Email Design Approaches That Work for All Devices
(UK Version) Email Design Approaches That Work for All Devices
 
Eclipse Demo Camp 2010 - UI Bindings - An Introduction
Eclipse Demo Camp 2010 - UI Bindings - An IntroductionEclipse Demo Camp 2010 - UI Bindings - An Introduction
Eclipse Demo Camp 2010 - UI Bindings - An Introduction
 
Creating a successful continuous testing environment by Eran Kinsbruner
Creating a successful continuous testing environment by Eran KinsbrunerCreating a successful continuous testing environment by Eran Kinsbruner
Creating a successful continuous testing environment by Eran Kinsbruner
 
Html
HtmlHtml
Html
 
Postdesktop Usability
Postdesktop UsabilityPostdesktop Usability
Postdesktop Usability
 
Email Design Workshop - Don't Let Bad Email Code Ruin Your Day or Your Results
Email Design Workshop - Don't Let Bad Email Code Ruin Your Day or Your ResultsEmail Design Workshop - Don't Let Bad Email Code Ruin Your Day or Your Results
Email Design Workshop - Don't Let Bad Email Code Ruin Your Day or Your Results
 
Responsive Email Design Increases Click-Through Rate By > 20%
Responsive Email Design Increases Click-Through Rate By > 20%Responsive Email Design Increases Click-Through Rate By > 20%
Responsive Email Design Increases Click-Through Rate By > 20%
 

Kürzlich hochgeladen

FULL ENJOY Call Girls In Majnu.Ka.Tilla Delhi Contact Us 8377877756
FULL ENJOY Call Girls In Majnu.Ka.Tilla Delhi Contact Us 8377877756FULL ENJOY Call Girls In Majnu.Ka.Tilla Delhi Contact Us 8377877756
FULL ENJOY Call Girls In Majnu.Ka.Tilla Delhi Contact Us 8377877756
dollysharma2066
 

Kürzlich hochgeladen (20)

Unlocking the Mystery of the Voynich Manuscript
Unlocking the Mystery of the Voynich ManuscriptUnlocking the Mystery of the Voynich Manuscript
Unlocking the Mystery of the Voynich Manuscript
 
Elevate Your Advertising Game: Introducing Billion Broadcaster Lift Advertising
Elevate Your Advertising Game: Introducing Billion Broadcaster Lift AdvertisingElevate Your Advertising Game: Introducing Billion Broadcaster Lift Advertising
Elevate Your Advertising Game: Introducing Billion Broadcaster Lift Advertising
 
BDSM⚡Call Girls in Sector 19 Noida Escorts >༒8448380779 Escort Service
BDSM⚡Call Girls in Sector 19 Noida Escorts >༒8448380779 Escort ServiceBDSM⚡Call Girls in Sector 19 Noida Escorts >༒8448380779 Escort Service
BDSM⚡Call Girls in Sector 19 Noida Escorts >༒8448380779 Escort Service
 
Instant Digital Issuance: An Overview With Critical First Touch Best Practices
Instant Digital Issuance: An Overview With Critical First Touch Best PracticesInstant Digital Issuance: An Overview With Critical First Touch Best Practices
Instant Digital Issuance: An Overview With Critical First Touch Best Practices
 
BDSM⚡Call Girls in Sector 128 Noida Escorts >༒8448380779 Escort Service
BDSM⚡Call Girls in Sector 128 Noida Escorts >༒8448380779 Escort ServiceBDSM⚡Call Girls in Sector 128 Noida Escorts >༒8448380779 Escort Service
BDSM⚡Call Girls in Sector 128 Noida Escorts >༒8448380779 Escort Service
 
W.H.Bender Quote 61 -Influential restaurant and food service industry network...
W.H.Bender Quote 61 -Influential restaurant and food service industry network...W.H.Bender Quote 61 -Influential restaurant and food service industry network...
W.H.Bender Quote 61 -Influential restaurant and food service industry network...
 
Busty Desi⚡Call Girls in Sector 49 Noida Escorts >༒8448380779 Escort Service
Busty Desi⚡Call Girls in Sector 49 Noida Escorts >༒8448380779 Escort ServiceBusty Desi⚡Call Girls in Sector 49 Noida Escorts >༒8448380779 Escort Service
Busty Desi⚡Call Girls in Sector 49 Noida Escorts >༒8448380779 Escort Service
 
Elevating Your Digital Presence by Evitha.pdf
Elevating Your Digital Presence by Evitha.pdfElevating Your Digital Presence by Evitha.pdf
Elevating Your Digital Presence by Evitha.pdf
 
FULL ENJOY Call Girls In Majnu.Ka.Tilla Delhi Contact Us 8377877756
FULL ENJOY Call Girls In Majnu.Ka.Tilla Delhi Contact Us 8377877756FULL ENJOY Call Girls In Majnu.Ka.Tilla Delhi Contact Us 8377877756
FULL ENJOY Call Girls In Majnu.Ka.Tilla Delhi Contact Us 8377877756
 
Distribution Ad Platform_ The Role of Distribution Ad Network.pdf
Distribution Ad Platform_ The Role of  Distribution Ad Network.pdfDistribution Ad Platform_ The Role of  Distribution Ad Network.pdf
Distribution Ad Platform_ The Role of Distribution Ad Network.pdf
 
Analysis of Sineing Website and how to fix
Analysis of Sineing Website and how to fixAnalysis of Sineing Website and how to fix
Analysis of Sineing Website and how to fix
 
Unraveling the Mystery of The Circleville Letters.pptx
Unraveling the Mystery of The Circleville Letters.pptxUnraveling the Mystery of The Circleville Letters.pptx
Unraveling the Mystery of The Circleville Letters.pptx
 
Social media, ppt. Features, characteristics
Social media, ppt. Features, characteristicsSocial media, ppt. Features, characteristics
Social media, ppt. Features, characteristics
 
Martal Group - B2B Lead Gen Agency - Onboarding Overview
Martal Group - B2B Lead Gen Agency - Onboarding OverviewMartal Group - B2B Lead Gen Agency - Onboarding Overview
Martal Group - B2B Lead Gen Agency - Onboarding Overview
 
Labour Day Celebrating Workers and Their Contributions.pptx
Labour Day Celebrating Workers and Their Contributions.pptxLabour Day Celebrating Workers and Their Contributions.pptx
Labour Day Celebrating Workers and Their Contributions.pptx
 
Unveiling the Legacy of the Rosetta stone A Key to Ancient Knowledge.pptx
Unveiling the Legacy of the Rosetta stone A Key to Ancient Knowledge.pptxUnveiling the Legacy of the Rosetta stone A Key to Ancient Knowledge.pptx
Unveiling the Legacy of the Rosetta stone A Key to Ancient Knowledge.pptx
 
Busty Desi⚡Call Girls in Sector 135 Noida Escorts >༒8448380779 Escort Service
Busty Desi⚡Call Girls in Sector 135 Noida Escorts >༒8448380779 Escort ServiceBusty Desi⚡Call Girls in Sector 135 Noida Escorts >༒8448380779 Escort Service
Busty Desi⚡Call Girls in Sector 135 Noida Escorts >༒8448380779 Escort Service
 
Enhancing Business Visibility PR Firms in San Francisco
Enhancing Business Visibility PR Firms in San FranciscoEnhancing Business Visibility PR Firms in San Francisco
Enhancing Business Visibility PR Firms in San Francisco
 
Rise and fall of Kulula.com, an airline won consumers by different marketing ...
Rise and fall of Kulula.com, an airline won consumers by different marketing ...Rise and fall of Kulula.com, an airline won consumers by different marketing ...
Rise and fall of Kulula.com, an airline won consumers by different marketing ...
 
Choosing the Right White Label SEO Services to Boost Your Agency's Growth.pdf
Choosing the Right White Label SEO Services to Boost Your Agency's Growth.pdfChoosing the Right White Label SEO Services to Boost Your Agency's Growth.pdf
Choosing the Right White Label SEO Services to Boost Your Agency's Growth.pdf
 

Back to the future: creating and testing responsive email templates

  • 1. Back to the Future: Creating and Testing Responsive Email Templates By Lyn Muldrow, Front-End Developer
  • 2. Coding like it’s 1999! What’s the best thing about html emails? Lead Generation Customer Retargeting Message/Brand Reinforcement OUTLOOK
  • 3. History and Use Responsive Email Design was coined by Ethan Marcotte circa 2010 Emails should offer a consistent experience across devices Speed, interaction, and accessibility at the forefront of design
  • 4. Responsive, or nah? webkit and moz used, but the emails are still broken! Bad GOOD
  • 5. Oh, the pain!Common pain points include: image sizes nested tables in nested tables deprecated code bugs (Outlook) testing across platforms inline CSS
  • 6. What can we do? Use effective, descriptive media queries Use templates that have been tested across platforms Consider deprecated HTML/CSS that works: <tbody> <tfoot> Create specific criteria for use cases
  • 7. Testing, Testing, Testing! Litmus, Email Lab, Mobile/RWD Tester
  • 8. Resources/References Email Lab: http://bit.ly/1IIQ5XD Mobile/RWD Tester: http://bit.ly/1KJec7F Litmus: http://litmus.com Understanding Mobile Email: https://litmus.com/lp/mobile-email-kit Twitter: @LynMuldrow Facebook: http://facebook.com/lynmuldrow1 Email: hi@lynmuldrow.com Web: http://lynmuldrow.com