Tonight We're Gonna Code Like It's 1999: Responsive Emails

on YouTube ↗21m

" summary

Redesign of all consumer-facing emails becomes a responsive, table-based codebase that actually works: templates live on GitHub, styles are inlined, and traffic shot through the roof after the rollout. Uses tables and inline styles to support Outlook (Word-rendering), media queries plus !important to override inline rules, and a background-image swap to force retina images to resize where HTML resizing fails. Targets max width 550–600px, notes Gmail strips head link colors, and tests with Litmus and Email on Acid.

AI-written summary · about

" chapters (16)

1. 0:00Intro
2. 0:20Who am I
3. 0:45Learning to code
4. 1:30My Story
5. 1:47Welcome Email
6. 2:18Indiegogo
7. 4:17Email Takeaways
8. 5:26Planning
9. 9:07Template
10. 9:42Table Elements
11. 10:35Where to Use Inline Styles
12. 12:04Image Alt Alternatives
13. 12:55Media Queries
14. 14:34Important
15. 15:48Things I learned
16. 19:01Resources

" related talks

• 37mEmail Code Can Be Cool, HonestMark Robbins · Pixel Pioneers Bristol 2017
• 49mSmartWeb 2016 - Vitaly FriedmanVitaly Friedman · SmartWeb 2016
• 40mInteractive EmailMark Robbins · Beyond Tellerrand Munich 2018
• 30mWeb Components: Just in the Nick of TimeAlex Russell · Polymer Summit 2017
• 42mDirty little front-end tricksVitaly Friedman · JSConf Iceland 2016
• 48mDeep dive into Experience Manager Core Components for E-Mail and FormsVarun Dua, Burkhard Pauli · Adobe Developers Live: Composable Experiences 2023
• 55mA Little Story About A Big Bang RedesignVitaly Friedman · Mirror Conf 2017
• 58mNew Adventures in Responsive Web DesignVitaly Friedman · Beyond Tellerrand Munich 2018