Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Responsive Emails

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Rachel Ober Rachel Ober
September 10, 2014
Programming
53
0

Responsive Emails

Avatar for Rachel Ober

Rachel Ober

September 10, 2014

More Decks by Rachel Ober

See All by Rachel Ober
So, You Want to Organize a Conference
Avatar for Rachel Ober rachelober
0
65
Front End Workshop 2015
Avatar for Rachel Ober rachelober
0
81
Front End Overview for Interns 2015
Avatar for Rachel Ober rachelober
1
59
IE Classes
Avatar for Rachel Ober rachelober
0
67
Front End Overview (2014)
Avatar for Rachel Ober rachelober
0
72
Team Communication Through Code
Avatar for Rachel Ober rachelober
0
88
What I Learned About SVG
Avatar for Rachel Ober rachelober
0
75
Paperless Post Sass
Avatar for Rachel Ober rachelober
1
100
SassConf Custom Framework/Style Guide Panel
Avatar for Rachel Ober rachelober
0
130

Other Decks in Programming

See All in Programming
KMP × Kotlin 2.3 - How Android Got Slower While iOS Builds Improved by 47%
Avatar for Ryosuke Shimizu (RIO) rio432
0
130
(Re)make Regexp in Ruby: Democratizing internals for the JIT
Avatar for TSUYUSATO Kitsune makenowjust
3
1k
リセットCSSを1行消したらアクセシビリティが向上した話
Avatar for pvcresin pvcresin
4
480
クラウドネイティブなエンジニアに向ける Raycastの魅力と実際の活用事例
Avatar for Nealle nealle
2
240
GoogleCloudとterraform完全に理解した
Avatar for Terisuke terisuke
1
190
AgentCore Optimizationを始めよう！
Avatar for matsukada licux
3
200
Claude Code × Gemini × Ebitengine ゲーム制作素人WebエンジニアがGoでゲームを作った話
Avatar for webzawa webzawa
0
220
when storing skills in S3 file
Avatar for watany watany
3
1.3k
Back to the roots of date
Avatar for jinroq jinroq
0
720
10 Tips of AWS ～Gen AI on AWS～
Avatar for matsukada licux
5
540
Claude CodeでETLジョブ実行テストを自動化してみた
Avatar for yoshiki kasama yoshikikasama
0
1.1k
Symfony AI in Action - SymfonyLive Berlin 2026
Avatar for Christopher Hertel chr_hertel
1
120

Featured

See All Featured
ラッコキーワード サービス紹介資料
Avatar for ラッコ株式会社 rakko
1
3.2M
Automating Front-end Workflow
Avatar for Addy Osmani addyosmani
1370
200k
Claude Code どこまでも/ Claude Code Everywhere
Avatar for nwiizo nwiizo
65
55k
SEO Brein meetup: CTRL+C is not how to scale international SEO
Avatar for Linda Hogenes lindahogenes
1
2.6k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
9
1.3k
Redefining SEO in the New Era of Traffic Generation
Avatar for Szymon Słowik szymonslowik
1
290
Git: the NoSQL Database
Avatar for Brandon Keepers bkeepers
PRO
432
67k
AI in Enterprises - Java and Open Source to the Rescue
Avatar for ivargrimstad ivargrimstad
0
1.3k
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
3k
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
225
10k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
57
6.8k
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
302
52k

Transcript

  1. RESPONSIVE EMAILS with Rachel Ober

  2. RESPONSIVE EMAILS https://flic.kr/p/bWugk2

  3. Lotus Notes https://flic.kr/p/bWugk2

  4. 4 DESIGNING RESPONSIVE

  5. 5 BUILDING BLOCKS OF RESPONSIVE @media FLUID GRIDS FLEXIBLE IMAGES

    MEDIA QUERIES

  6. CLASSIC EMAIL TRICKS https://flic.kr/p/uEhmK

  7. CLASSIC EMAIL TRICKS https://flic.kr/p/69fTME

  8. CLASSIC EMAIL TRICKS https://flic.kr/p/diXxXU

  9. RESPONSIVE EMAIL TRICKS

  10. RESPONSIVE EMAIL TRICKS

  11. That wasn’t funny

  12. PROGRAM LIKE IT’S

  13. 13 WHY RESPONSIVE EMAIL DESIGN? 47% 150 80% times a

    day of emails are opened on a mobile device your eyeballs are on your mobile phone of people delete an email if it looks crappy

  14. 14 MOBILE FIRST

  15. 15 DESIGN RESPONSIVE EMAIL

  16. 16 APPLICATION SUPPORT iPhone Gmail App iPhone Mailbox App iPhone

    Yahoo! Mail App Android Gmail App Android Yahoo! App Blackberry OS 5 Windows Mobile 6.1 Windows Phone 7 Windows Phone 8 Not Supported:

  17. 17 Image & Icon Credits • http://thenounproject.com/Mikhail1986/ • https://flic.kr/p/9fpnZi •

    https://flic.kr/p/6ao3nd • https://flic.kr/p/2W1CBG