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
38

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
49
Front End Workshop 2015
Avatar for Rachel Ober rachelober
0
65
Front End Overview for Interns 2015
Avatar for Rachel Ober rachelober
1
44
IE Classes
Avatar for Rachel Ober rachelober
0
47
Front End Overview (2014)
Avatar for Rachel Ober rachelober
0
44
Team Communication Through Code
Avatar for Rachel Ober rachelober
0
70
What I Learned About SVG
Avatar for Rachel Ober rachelober
0
48
Paperless Post Sass
Avatar for Rachel Ober rachelober
1
87
SassConf Custom Framework/Style Guide Panel
Avatar for Rachel Ober rachelober
0
100

Other Decks in Programming

See All in Programming
Result型で“失敗”を型にするPHPコードの書き方
Avatar for Takuma Kajikawa kajitack
4
120
FormFlow - Build Stunning Multistep Forms
Avatar for Yonel Ceruto González yceruto
1
190
エラーって何種類あるの？
Avatar for Takuma Kajikawa kajitack
5
280
GoのWebAssembly活用パターン紹介
Avatar for syumai syumai
3
10k
イベントストーミング図からコードへの変換手順 / Procedure for Converting Event Storming Diagrams to Code
Avatar for nrs nrslib
1
220
20250628_非エンジニアがバイブコーディングしてみた
Avatar for ponponmikan ponponmikankan
0
220
Enterprise Web App. Development (2): Version Control Tool Training Ver. 5.1
Avatar for Koichi NAKAGAWA knakagawa
1
120
DroidKnights 2025 - 다양한 스크롤 뷰에서의 영상 재생
Avatar for 이가은 gaeun5744
3
300
Composerが「依存解決」のためにどんな工夫をしているか #phpcon
Avatar for hideki kinjyo o0h
PRO
1
150
設計やレビューに悩んでいるPHPerに贈る、クリーンなオブジェクト設計の指針たち
Avatar for panda_program panda_program
4
530
ReadMoreTextView
Avatar for Sungyong An fornewid
1
450
統一感のある Go コードを生成 AI の力で手にいれる
Avatar for Kotaro Otaka otakakot
1
3k

Featured

See All Featured
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.3k
No one is an island. Learnings from fostering a developers community.
Avatar for Antonio thoeni
21
3.3k
Adopting Sorbet at Scale
Avatar for Ufuk Kayserilioglu ufuk
77
9.4k
The Language of Interfaces
Avatar for Des Traynor destraynor
158
25k
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
299
21k
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
90
590k
The Pragmatic Product Professional
Avatar for Laura Van Doore lauravandoore
35
6.7k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.4k
Fashionably flexible responsive web design (full day workshop)
Avatar for Andy Clarke malarkey
407
66k
Writing Fast Ruby
Avatar for Erik Berlin sferik
628
61k
[RailsConf 2023] Rails as a piece of cake
Avatar for Vladimir Dementyev palkan
55
5.6k
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
233
17k

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