Slides for my presentation about HTML Email Design: WebDesignDay on October 1, 2011 http://webdesignday.com ConvergeSE on June 24, 2011 http://convergese.com/ Altanta Web Design Group on May 26, 2011 http://www.awdg.org/events/17396885/

1. Email Jitsu
JASON BEAIRD - OCTOBER 1, 2011

2. http://mailchimp.com/resources/guides/email-jitsu/

4. Why Email?
92% of netizens use email. Only 65% use a social network.
Use Email
Get Directions
Read News
Buy Products
Social Networks
Share Photos
Play Games
Do Actual Work*
0 25 50 75 100
* just kidding. http://pewinternet.org/Trend-Data/Online-Activites-Total.aspx

5. Why Email?
Email lists are opt-in and permission based.
Allows you to engage with your exact
(or even segments of) your exact target audience.
Significantly lower production and delivery costs than other
forms of marketing.
No delay between distribution and delivery means your content
is as fresh as a hot Krispy Kreme.
Results are fast and extremely measurable.

6. In Summary: Pick 3
Good Fast
Cheap

8. WHY HTML EMAIL?
You can still deliver a plain-text alternative.
Makes tracking open rates possible - well, easier.
Don’t have to use ALL CAPS or punctuation ascii art to
denote headlines or -=important=- text.
Hooray for hyperlinks!
Because your client wants their logo on it.
(...and you can make it bigger.)

9. http://jgx.me/bx

10. WHY HTML EMAIL?
MailChimp Supply Co.
====================
Plushies are here!
------------------
We teamed up with Shawnimals to make 100 of these
cool little MailChimp plushies. They’re laser cut
by robots and hand-sewn by humans. Small enough
for your desk but big enough to hug real tight.
Guides for Everything
---------------------
We’re hard at work stuffing all our wisdom into
downloadable guides that will surprise and delight
you. Whether you’re just getting started or trying
to build your very own MailChimp, we’re here to
help Learn more at MailChimp.com
Cardstock Freddies
------------------
All you need is quality paper, a razor blade and
some tape to assemble and army of monkeys.
Login Screens
-------------
Check out some of MailChimp’s recent login screens
on our Flickr page:
http://flickr.com/photos/freddievonchimp
Propoganda Posters
------------------
Our limited edition posters are signed & numbered

16. http://jgx.me/9j

18. http://jgx.me/bn

19. Major email Types
NEWSLETTER
Scheduled, Interesting, Relevant
EVENT OR ANNOUNCEMENT
Time-Sensitive, Short, Irregular
PRODUCT OR CATALOG
Featured, New & Sale Items
TRANSACTIONAL
Signup, Welcome, Receipt

20. http://jgx.me/bo

21. http://jgx.me/9p

22. http://jgx.me/a0

24. Know your opponents

25. Know your opponents
It looks like you're trying
to design an “HTML” Email.
Would you like me to make
some suggestions?
Lose the background images.
I hate forms. They are stupid.
Floats? I'll take root beer!
Nobody hovers links anyway...
CSS3? I'm still learning about
the width property!

26. Know your opponents

27. Know your opponents

28. Know your opponents
RefreshColumbia.org SouthernSavers.com

29. http://campaignmonitor.com/css

30. https://github.com/mailchimp/Email-Blueprints/

33. http://jgx.me/bp

34. What we
really
Need is...

35. http://jgx.me/bq

36. http://jgx.me/9n

37. http://jgx.me/9u

38. http://jgx.me/9o

39. http://jgx.me/br

40. http://jgx.me/9r

41. http://jgx.me/9s

42. http://jgx.me/bs

43. http://jgx.me/bt

44. http://jgx.me/bu

45. http://jgx.me/9x

47. http://jgx.me/9z

48. http://jgx.me/bw

49. Good (email) Design is...
1. Layout
2. Color
3. Texture
4. Type
5. Imagery

50. “ Great ” Design...
…solicits strong emotional response
…justifies its creation
…inspires other designers
-Cameron Moll

51. “We are the
music makers
and we are the
dreamers of
the dreams.”
-Willy Wonka

52. Questions?