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

Responsive Emails

Avatar for Rachel Ober Rachel Ober
September 10, 2014
Programming
0
41

Responsive Emails

Avatar for Rachel Ober

Rachel Ober

September 10, 2014
Tweet

More Decks by Rachel Ober

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

Other Decks in Programming

See All in Programming
GPUを計算資源として使おう！
Avatar for prime number primenumber
1
250
PicoRuby on Rails
Avatar for makicamel makicamel
2
140
Claude Code + Container Use と Cursor で作る ローカル並列開発環境のススメ / ccc local dev
Avatar for Yuichi Maekawa kaelaela
12
7k
なぜ「共通化」を考え、失敗を繰り返すのか
Avatar for Rinchoku rinchoku
1
680
AI駆動のマルチエージェントによる業務フロー自動化の設計と実践
Avatar for 岡本秀明 h_okkah
0
230
猫と暮らす Google Nest Cam生活🐈 / WebRTC with Google Nest Cam
Avatar for Yutaro Muta yutailang0119
0
170
Modern Angular with Signals and Signal Store: New Rules for Your Architecture @enterJS Advanced Angular Day 2025
Avatar for Manfred Steyer manfredsteyer
PRO
0
270
TypeScriptでDXを上げろ！ Hono編
Avatar for Yusuke Wada yusukebe
3
770
効率的な開発手段として VRTを活用する
Avatar for Yosuke Ishikawa ishkawa
0
160
AIと”コードの評価関数”を共有する / Share the "code evaluation function" with AI
Avatar for Shintani Teppei euglena1215
1
180
AWS Summit Japan 2024と2025の比較／はじめてのKiro、今あなたは岐路に立つ
Avatar for Satoshi Kaneyasu satoshi256kbyte
0
120
AI時代の『改訂新版 良いコード／悪いコードで学ぶ設計入門』 / ai-good-code-bad-code
Avatar for MinoDriven minodriven
23
9.6k

Featured

See All Featured
StorybookのUI Testing Handbookを読んだ
Avatar for Shingo Yamazaki zakiyama
30
5.9k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
Avatar for Dan Newman danielanewman
229
22k
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
16k
The Art of Programming - Codeland 2020
Avatar for Erika Heidi erikaheidi
54
13k
Making Projects Easy
Avatar for Brett Harned brettharned
116
6.3k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
524
40k
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
278
23k
Optimizing for Happiness
Avatar for Tom Preston-Werner mojombo
379
70k
Sharpening the Axe: The Primacy of Toolmaking
Avatar for Bryan Cantrill bcantrill
44
2.4k
Writing Fast Ruby
Avatar for Erik Berlin sferik
628
62k
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
Avatar for Aki / @LoveIdahoBurger aki_iinuma
126
53k
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
32
1k

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