Email Marketing Essentials: Designing Effective Emails | Fabio Carneiro | Skillshare
Search

Playback Speed


1.0x


  • 0.5x
  • 0.75x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Email Marketing Essentials: Designing Effective Emails

teacher avatar Fabio Carneiro, Email Design and Development Expert

Watch this class and thousands more

Get unlimited access to every class
Taught by industry leaders & working professionals
Topics include illustration, design, photography, and more

Watch this class and thousands more

Get unlimited access to every class
Taught by industry leaders & working professionals
Topics include illustration, design, photography, and more

Lessons in This Class

    • 1.

      Introduction

      1:26

    • 2.

      Your Project

      1:16

    • 3.

      Overview

      4:54

    • 4.

      Principles of Effective Design

      6:12

    • 5.

      Buy Me

      6:33

    • 6.

      Join Me

      2:26

    • 7.

      Read Me

      3:12

    • 8.

      Transactional

      2:29

    • 9.

      FAQs (and Email Clients)

      6:26

    • 10.

      Closing Thoughts

      1:23

  • --
  • Beginner level
  • Intermediate level
  • Advanced level
  • All levels

Community Generated

The level is determined by a majority opinion of students who have reviewed this class. The teacher's recommendation is shown until at least 5 student responses are collected.

15,154

Students

59

Projects

About This Class

Join Mailchimp's Fabio Carneiro and learn how to design a marketing email that helps you — the small business owners, freelancers, and startup teams — accomplish your business goals.

This class is an overview of email design, covering:

  • the difference between web design and email design
  • key considerations for designing and developing emails
  • best design practices for the 4 most common email types

Note: This class is an introduction to the craft of creating and developing effective email, not graphic design or the aesthetics of email.

An email's design has a huge impact on its effectiveness. Whether you want to design your own emails, tweak some templates, or just work more effectively with designers and developers on your team, use the tactics in this class to make the most of email!

_______________________

Mailchimp is an email marketing service provider founded in 2001. It has 9 million users that collectively send over 15 billion emails through the service each month.

Seeking an introduction to email marketing? Check out Mailchimp's first class on Skillshare, Getting Started with Email Marketing.

Meet Your Teacher

Teacher Profile Image

Fabio Carneiro

Email Design and Development Expert

Teacher

I'm an email developer and user experience designer, and pioneered a development method--Hybrid Coding, a.k.a. Spongy Development--that had industry-wide effects, and is used by the 15 million users of MailChimp's platform to send one billion emails a day.

I love helping others conquer email design--I've given talks at The Email Design Conference, Smashing Conference, and ConvergeSE, and shared my expertise in publications like Smashing Magazine and Smashing Book.

See full profile

Level: All Levels

Class Ratings

Expectations Met?
    Exceeded!
  • 0%
  • Yes
  • 0%
  • Somewhat
  • 0%
  • Not really
  • 0%

Why Join Skillshare?

Take award-winning Skillshare Original Classes

Each class has short lessons, hands-on projects

Your membership supports Skillshare teachers

Learn From Anywhere

Take classes on the go with the Skillshare app. Stream or download to watch on the plane, the subway, or wherever you learn best.

Transcripts

1. Introduction: My name is Fabio Carneiro. I am the lead email developer for MailChimp. I think to this point in my career, I've handcoded- I think it's just over 1100 emails. That's probably too many, that's a lot. Today, we're going to be talking about how to design more effective email. Design is important and it's not just fluff. Research has shown that people delete ugly emails. So it's worth making the effort to make them look nice. Remember that you're trying to build an impression and create trust and make something that people will want to read and want to go back to you over time. Regardless of whether you're a marketer, or a copywriter, a developer, a designer, or if you run your own business, this will be helpful to you just because it will give you a good ground level overview of what email design is. The difficulties inherent of it. How do you do it well? And kind of what goes into that. So, by the end of this class you'll know the difference between email and web design, you'll be able to determine the design and assume the email's purpose and you'll understand some of the principles of responsive email design. If you're just getting started with email, I'd recommend checking out MailChimp's first class on SkillShare, getting started with email marketing. 2. Your Project: The project in this class is to share in email which design made you take an action, or made you feel something. So, I recommend you share an image of an email, something that you found effective, and then write a brief description of why you think it's a good and effective email. It should only take a couple of minutes. Just use your own inbox. We all get tons and tons of email every day. So, it should be pretty simple to go in and find one that's pretty effective and that you think works well. When you're looking for an example of a good email, ask yourself a few questions about it. Does the email have a specific purpose? Is its content appropriate for that purpose? Is it mobile-friendly or responsive? All of these things are building blocks to what makes an email look good. So, by building this gallery of emails, you're basically creating an inspiration page. You can see what other people feel work well, you get ideas for your own email designs, and you can just get a better view of what works well, what people respond to, and then implement that stuff in your own work. If you're designing your own emails, you can share those and ask other students for feedback. Essentially, what you are doing in a great post is teaching others. That's the best thing you can do, is help other people be better. 3. Overview: So one of the first big questions to answer is, what is the difference between email design and web design? And it's actually a giant gulf of difference. A web design is different and there's kind of a build for everyone approach. Websites tend to be pretty general on focus because there's a whole audience out there that can come to you and you don't always know who they are. But email is actually the reverse. Email is very intimate and very focused and it allows you to peg your audience pretty closely and because you know your audience you can actually make your content much more relevant and effective. From a technical standpoint, email design is different than web design because it's not backed by the current standards set forth by the W3C and because you have to support older clients that means you're going to be building in tables instead of divs and really using older techniques that were more popular in the late 2000s than they are today. Despite the difference between web and email design, there are principles that translate. It's just a matter of whether or not they translate fully, something's might need a bit of adjustment. Just because email design is different and maybe a little older, doesn't mean that you should throw out the window every good principle of design you know. Email is still part of the larger web ecosystem and that means that the things you do to make a website good, can actually translate and make an e-mail good as well. It's important to remember that when you're sending an email, you're not just sending a website, it might seem like it's a single serving website but emails it's own channel with its own considerations for what makes good design and good content. So if you're not a developer, do you need to know all these little details about email design? I'd say that you actually should and that's really only so that when you inevitably have to talk to a developer, you know what you're asking for and you can communicate effectively without having to drive anybody up the wall. In the world of email, audience means everything and an effective email is generally geared towards a specific audience. The best way to determine your audience is to use sign-up forms. In a sign-up form, you could actually segment by specific interests. Ask people questions like, are you a developer? Are you a designer? Are you're a researcher? And by asking just simple questions you begin to build a picture of who your audience is and then you're actually able to take that data and create more relevant email. If you find that your audience will be mostly developers for instance, you could actually make your content much more technical. You could generally probably make your design much simpler as well, so that it's the textual information that stands out for designers on the other hand it might appreciate something that looks a little nicer and for the content to be maybe less technical and more subjective. An email should always be designed with a purpose in mind because everything else follows from that purpose, the content you write, how you design it, who you send it to, if you're trying to sell a product, you wouldn't necessarily want to waste whole lot of time telling a long drawn out story. People want to see your product. They want to be able to buy it. If on the other hand you're sending a newsletter you can be pretty confident that people want to read a story. So, being able to find your audience and design of the purpose, means that you can make an e-mail more relevant than any website could ever hope to be. Another important aspect to email design is responsive design. That's because more than half of all emails are open on mobile devices. Now, what is responsive design? It's essentially the idea that regardless of the device or screen size that your email or even the website is viewed on, it will present information in a way that is still clear and concise and makes sense for that medium. If you do want to get into the code yourself, there are a lot of considerations for responsive design for email. You have to deal with different clients and how they treat code and it's really just a lot of information to that end, you could actually refer to templates.mailchimp.com. It's a guide I've written that answers the big, what you need to know questions for responsive email development. So, how does this all translate to business strategy. Well, it comes down to user experience and knowing your audience. First and foremost, be human. Remember that email is an open line of communication. It's something that nothing else matches. Social media doesn't do it. Websites don't do it. You have direct access to a person, email is a conversation. Design is important and it's not just fluff. Research has shown that people delete ugly emails so it's worth making the effort to make them look nice. Remember that you're trying to build an impression and create trust and make something that people will want to read and want to go back to you over time. At its core, good design and e-mail is about purpose. You're guiding a recipient to an action you want them to take and so your designs should be geared towards that. Your content and visuals will work together in tandem but it's the design that grab someone's attention first. 4. Principles of Effective Design: Now, let's dive into some of the principles of effective email design. One of the most important things in email design is text. Regardless of where a person views in email, texts is the one thing that gets rendered consistently. It doesn't matter which email client and emails viewed in, what platform it's viewed in, texts is the one thing that will always show up. So, it's good to pay attention to how you treat texts because if all else fails, that's what your email is. Ideally, your emails message to come across without images, so think about your email as a whole and translate that in the text, make the message easy to digest, pay attention to typography and make your content easy to read. In something like a long form email, nice topography is really important because you're asking people to devote a lot of time, the're reading your content. It's important to pay attention to your type size, to line-heights, and even text color because all of that goes into making an email comfortable to read especially on smaller displays. Not all fonts are shared across systems, Helvetica is present on a lot of Apple machines. But on Windows, it's actually Ariel that's used instead. So, it's good practice to build a font stack where you specify something like Helvetica and Arial and then for the sans-serif so that your texts will always display the way you intend. It's important to stick with ones that are well supported across multiple platforms. Typefaces like Helvetica and Arial and Georgia and Times New Roman will get you very wide coverage across systems and will act as a fail-safe in case you're using some fancier font set may not be present on some machines. Another option is to use web fonts. Now these are typefaces that you can serve via the web that aren't necessarily present on many user machines. If you do use web fonts, it's important to provide a fallback to system safe fonts so that your text will render how you intend regardless of whether or not the user has access to a specific web font. A great way to learn about where web fonts work is by referring to style campaigns matrix on web fonts support in email. They've done a lot of the groundwork for you, so you know where the work and where it won't, I've included the link in the resources, so you can refer to it later. When I talk about having a fallback font, I mean specifying it in the CSS, you write in your email. So, if you're using a web font say like Open Sans from Google Fonts, you can actually fall back to Helvetica and then Arial and then sans-serif in your font stack and in the case of one of those fonts is not present in the system, your email will fall back to the next one that is available and so your emails texts will render how you intent. It's important to check what options you have available for fonts regardless of email service provider. At MailChimp we do the work for you by providing a font stack automatically dependent on the font you select as your primary. Another way to handle texts in your emails is by using image based text which is a great option if you have to stay on brand. It does have some downfalls however. So, if you have to use image based text, make sure that you provide a plaintext fallback in case the image never load. The most important thing is to always make sure that your message comes across and if an image doesn't load and it's full of text, the user won't see it. Ultimately, your best option for textual content in emails is regular text. Even if you do use image based text, it's important to provide a fallback. Another use of image-based texts and emails comes in the form of calls to action like buttons. Image based buttons suffer the same downsides as image-based text, meaning that if the image never loads, a user will never see your call to action, so it's good to actually code buttons out using HTML and CSS. If you're including a button in your email, it's best to code it using HTML. This is also called a bulletproof button. If you're looking for specific ways to build a button, you can refer to templates at MailChimp.com and there's a whole section on calls to action and writing buttons using code. Now, all this talk about texts may make it seem like images aren't important in email but that's not true, they're very important. It's just a matter of finding a balance between text and images. Remember, people are visual, so images go a long way to making an email effective. If you're selling a product, it's a great idea to have an image of that product. Images also provide you a great way to add motion to your email in the form of a gif not "jif". Video is the new kid on the block and getting video is easier and easier these days, If you're in marketing video is a very exciting choice but it does come with some significant downsides. First, there's the huge data costs involved in video, anyway you slice it, videos are large in size and so you're incurring a data cost on the recipient. Additionally, videos aren't supported on very many clients, a great alternative to video and email is gifs,. They render in more places, they're generally lower impact as far as data size goes, and they provide the same amount of visual interest. Another big difference between email design and web designers. Email design can't be pixel perfect, that's because there are tons of email clients that you have to consider and they all act a little bit differently than one another. I like to call email design the exact science of inexactness. Like Bruce Lee said, "Be water my friend". That means you have to design your emails so that there's a little bit of give-and-take from client to client, so that your design isn't perfect from one client to the next, but works as best as it can from one client to the next. Regardless of the rendering differences from client to client, your email will still retain its design fidelity and though it will still achieve its purpose regardless of where it's viewed. Because of the differences between how email client render styles and the sheer number of email clients that exist, exactness of design just isn't a viable goal, it's better to design with a little bit of flexibility in mind, so that your design keeps its fidelity regardless of their email client your email might be viewed in. There are no hard and fast rules for creating visual interest in an email. Well, might work well for one brand and audience in one version, might not be effective in another, but there are hard and fast rules about making an email easy to digest, concise, comprehensive, well-written copy is very important and so does optimizing your design to work effectively across multiple clients. 5. Buy Me: So, now that we've gotten a good overview of what email design is, let's dive a little deeper and look back at those four main types of emails. So, the first one is the buy me email, which is an e-commerce based email. It's focused around creating the incentive for a recipient to spend money. If you're trying to sell something, you're sending a buy me email. The second type is the read me email. Anytime you're trying to tell a story; newsletters, company announcements, that kind of thing falls under read me emails. Those guys are relying on really good copyrighting, which is easier said than done and good typography just to make the delivery of content smoother and easier for recipient to take in. The third type is the join me email. These are event-focused emails. They can be event announcements, survey requests. Essentially, an email that's built around enticing the user to take an action; whether it's to donate money or to come to an event. Then the fourth one is a little bit of an outlier but it's no less prevalent in all of our inboxes and it's the transactional email. That's basically any email that needs to deliver focused information from one point to another based on transactions. So, order receipts, shipping updates, things like that, security announcements. The first is the buy me email. The buy me email has a specific purpose of building an enticement for the user to spend money. To that end, buy me emails are most effective when they present clear, beautiful product images in simple calls-to-action in order to get the recipient to buy a product quickly. If you're a service company, you may not be selling an individual product, but likely you're still talking about a feature that is of interest to a recipient. You can treat it much the same way; provide compelling imagery and explain why that particular feature of your service is worth the cost. The call-to-action in the buy me email is important. Generally, it should be something like purchase, or buy me, or shop now. Finding the right wording however, is just one of those things you'll have to test and tweak over time. Some word combinations may work better than others and that's all borne out through data and time. Give your products enough space where they shine on their own. Using the whitespace effectively can focus a recipient's attention on a particular product or products. If you're selling multiple products, arrange them on a grid so they're uniformly displayed and the presentation is just nicer overall. When you're including an image of a product, ask yourself a few questions. Is it better to include a zoomed out image of a product or is it better to include a close-up shot that shows more details and features of your product? These are things you have to ask yourself when you're including images in a buy me email. One of the biggest mistakes I see in buy me emails because they're still image heavy, is a lack of text. Email clients that don't load images when the email is opened, you can end up with an email that doesn't make a lot of sense because there's no texts that backs up what's included visually in the email. Buy me emails are also very heavily dependent on knowing your audience. Make sure that the email you send those specific segment of your list is relevant to them. If you're sending an email out that advertises men's clothing for instance, think about how you would design an email differently than one advertising children's clothing. If your email has multiple products, make sure they're all at least a little bit related to each other. Stuffing an email full of, let's say, 30 or 40 products, just kind of overkill. You may not get the results that you want and people might not actually buy anything just because there's no focus, there's no clarity. Instead of sending one giant all-purpose emails to your list, segment the list and send by interest. Make sure that the email is relevant to the smaller segments of your list. The hierarchy of a buy me email is very important. Make sure that your product images are towards the top of the email. Let people see those first. Then back it up with some textual content so that in case those images don't load, people will still have something to refer to. Remember the idea that people are visual. Letting them see your product first means that you're grabbing their attention right away. So, keep your products towards the top of your e-mail. With all that in mind, let's look at an example of a well-designed buy me email, like this one from GoldCoast Skateboards. If you take a look, the first thing you see is their logo, nice and big. All that does is reinforce the fact that this email comes from GoldCoast Skateboards. It's just a brand impression. The next thing you see is this 40-percent-off declaration at the top of the email. It's important because they want people to take advantage of this sale. They've done well, they've put it up at the top. Next it's followed by some nice compelling imagery. Nothing too distracting, just something simple that works well with the overall design of the email. After that image, they've got their discount code and then they're backing up all of that image-based texts with some actual textual content so that if the images fail to load, the user still knows what the email is for. Under that text, there's a nice big call-to-action and then one final image of a selection of their skateboards. Which acts as a nice tag at the very end of the email; it says, "Look at what we've got on offer." The design of this email looks like it originated from MailChimp template. Looks like just a simple single column email that they then exported and modified to suit their own needs. What makes this email so effective is it's focus. It's not trying to sell me a bunch of different products, it's just announcing a 40 percent off sale and it does that with simplicity of content, with some compelling imagery, and with some nice, bold and clear calls-to-action. If you're looking for good examples of buy me emails in your own inbox, think about how focused those emails are. Are they trying to sell too many products or are they focused well on just one or a small selection of related products? Is the imagery used compelling? Is it clear? Is it a nice product shot? Are you having trouble deciding whether they're trying to sell a jacket or jeans because the shot is taken from too far away? All of these things are important. When you're looking at these emails, think about how they make you feel and think about whether or not they drive to click that Buy Now button. If so, then it's a pretty successful buy me email. If not, look and see what they could have done better and then incorporate that into your own designs. 6. Join Me: So moving on to our second major email type, we come to the "Join Me" email. These emails included event announcements and survey requests, and they're designed to urge the recipient to devote a measure of their time, either by attending an event or filling out a short survey. Design-wise, a "Join Me" email relies more on content hierarchy than visuals to get its point across. A good "Join Me" email has all the event or survey details towards the top, where it could be clearly read and understood immediately. If your "Join Me" email is for an event, you should have the event date and location towards the top, and never bury under other content. If it's a survey request, a couple of sentences describing the purpose of the survey is always helpful, followed by the call to action to complete the survey itself. Our example of the well-designed "Join Me" email comes from Brother Moto. If you take a look at it, you'll see that it's for a launch party and all of the pertinent details are located towards the top of the email. The address is at the very top, followed by a short description of what the event is, in this case, a launch party, followed by the date and the address of where the event will be. Below that information is one last call to action, having to do with winning this motorcycle. All of the details around that are also clearly laid out. There's a nice clear heading and then short descriptions on either side of the motorcycle image to let people know what they're entering to win, followed by that call to action at the bottom. All of these details in the design and in the content drive people to attend the event. If you're not necessarily interested in going off-hand, then maybe the chance to win the motorcycle will actually act as that push to get you to the event. Either way, all of the information you need is there in the email and is clearly laid out. In "Join Me" emails, it's really important to balance how nice they look visually with how effectively they deliver information about the event or survey. In this email from Brother Moto, they do a nice job of creating excitement for this party by using this motorcycle jumping over cars, for instance, and balancing it against the important information about the event itself. If your "Join Me" email is for a survey, then the call to action is the most important part, because you're not necessarily asking people to show up to an event, you're just asking people to devote a measure of their time to fill out a survey. In those cases, the call to action is the most important part, so I would recommend using a button instead of a complicated link to send people to a survey. 7. Read Me: Next is our third type of email, the "Read Me" email. These emails work really well if you're trying to tell a story or spread ideas. The unique thing about Read Me emails, is that it's really the only type that can break the brevity rule, that shorter is better rule of thumb for email can actually be thrown out the window here. Short-form and long-form emails can both work. It just depends on the audience and what they're looking for. Any company can send the Read Me email. It's not always about selling a product, sometimes you just want to tell a story and if you have a compelling story to tell, chances are, your subscribers wanna hear it. Read Me emails are perfect for that. Design wise, the two biggest factors for success in the Read Me email, are nicely thought out typography and really strong writing. As far as layout goes, a Read Me email tends to work a little bit better when it's single column, although that doesn't mean that you can't use a multiple column layout. Just keep in mind that the multiple column layout, works well in print like newspapers and may not translate as well to the screen. Remember, readers love simplicity. So, single column layout might work better for you. The emails from subtraction.com for example, qualifies a short form email because a textual content is abbreviated. There's a summary paragraph and then a link out so you can read the rest of the article on this site. MailChimps UX newsletter on the other hand, is a long form email, where all of the content is in the email itself. This can make an email very long and it's really dependent on what your audience wants. For the UX newsletter, the audience expects long sort out articles on different aspects of user experience design. So, we give them that in the email without making them go to a site to read the rest. Your sending frequency can also play a part in how long or short your email is. If you're sending more emails, then maybe keep them a little bit shorter, so people can get through them more quickly at the pace you send. If you're sending less often, then the long form email can work better for you. The MailChimp UX newsletter for example, is only sent every couple of weeks, so that people have time to read the long articles and digest the content before the next one hits their inbox. If you have links in your Read Me email, it's good to abide by some best practices that govern links on the web as a whole. Make sure that your links are a different color from the text, but don't stop there. Make sure that they're visually distinct from your text as well and use something like an underline or a background color that set apart from the rest of your text. Avoid having lots of links close together because if your emails viewed on a mobile device where the finger rules and not the mouse cursor. That people might have a difficult time tapping on a specific link and just because it's called the Read Me email doesn't mean that you can't include images. Images work just as well in these kinds of emails as they work in others a good rule to follow when you're creating content for a Read Me email, especially when images are concern, should be that email should work regardless of whether or not the images are there. If you're including images in your Read Me emails, remember that make their role that of support to the textual content instead of the main focus of the email itself. You're Read Me email should read just as well without images as with. 8. Transactional: Our fourth and final email type is transactional. These are emails like order receipts, shipping confirmations, and security notices, and they are used to present information or data in a simple and easy to understand manner. Transactional emails are a little bit of an outlier because they have their own rules which govern how effective they can be. Transactional emails should be focused in scope and include only relevant information. If you're sending somebody like a credit card declined email, you shouldn't include links to your latest blog post or to your newest product, keep the email focused on the task at hand. Relatedly, transactional emails should also be short but comprehensive. That means that you cover all of the important details but not in the long-winded manner. Going back to our credit card declined example, you wouldn't want to include jokes or lighter content in something that's a fairly serious matter. An email like that would work best with a simple explanation of what happened, followed by details on how to correct the problem. It's also important for transactional emails to be practical in design. That means they should be easily printable. They should be responsive and they should also have a really strong information hierarchy. A good rule of thumb for transactional email is to include a print style sheet in your CSS especially for emails that might get printed out often, like an invoice. Because transactional emails are so different from the other three kinds of emails we've discussed, they need to be treated a little bit differently as well. You can send transactional email through MailChimp, but if you need to send at a higher volume, you can explore Mandrill, a service we've built specifically to handle transactional email and its specific needs. Let's take a look at a well designed transactional email. This one is a billing email from MailChimp. If you take a look, you'll see that it's pretty spartan in design. Our logo is at the top followed by a very clear heading that describes the emails' purpose, in this case your order has been processed. Even though the design is very spartan, we've included this bright red stamp image so the user knows, beyond a shadow of a doubt, that their order has been processed and they've paid their account. The rest of the email is also simple with a focus on information hierarchy. The invoice number is large and it's bolded and below that, we list what the user paid for, and if they received any discounts. If a user needs more detail than that, the bold called the action follows, allowing them to view this invoice in their account and get more information if they need it. As you can see this email is simple in design, but it's also very effective. Simplicity and clarity of information is key here. 9. FAQs (and Email Clients): Four our last major lesson, I'd like to touch on some major email design best practices. The first rule of thumb is to know and create for your audience. Remember that audience determines everything in the email. The more you know about them, the more relevant and the better your emails can be. In email, there tends to be this natural drop off of interest that occurs over time. So, it's a good idea that every once in a while change things up, either in your design or in your content to perk your readers interest every once in a while. Avoid sending email that there's only images. It's a bad practice that can leave a lot of your users twisting in the wind if images fail to load for any reason. Relatedly, avoid the image-based text but if you don't have a choice make sure you provide a fallback with some regular text. Content-wise try to be personable and personal. I love reading NextDraft for example, because Dave Pell is such a great writer. He adds jokes, he writes each issue as if it's a letter to me, and so that keeps me much more engaged over time and I look forward to each issue before it even hits my inbox. As much as you can, try to make sure that someone can just hit reply to your email and reach a person. Avoid using addresses like no reply ad if you can. Remember that email is a communication medium between two people and you shouldn't get in the way of that. When you're developing email, take a look at the distribution of email clients across the list you're sending to. Avoid spending a lot of time developing for difficult clients that have small user bases and instead focus on the ones that have the largest user bases. It's important to know how different clients render emails. Know the main work arounds from client to client so that you have less difficulty developing your email and dealing with problem clients. If you're building your own emails, remember to use tables for structure versus divs. This is the main developmental difference between a website and email design. When you're developing email, make sure you develop for graceful degradation first and progressive enhancements second. What that means is you build for the oldest less capable clients first, and then enhance beyond those to provide more and better features for newer clients that can handle them. Testing email is an iterative process, meaning you'll have to test and retest and retest to make sure that your email is rendering the way you need it to render. Over time, all of this testing allows you to learn the ins and outs of email clients and what works best in design for an email. Keep in mind that an email's effectiveness may not be adequately measured with just one data point. It's best to get an idea of how an email performs over time. Just because your email was red text performed well on one day, doesn't mean it will perform well on the other. There are so many factors that go into why or why not a particular email was effective. Avoid drawing hard conclusions from a small sample of data. Take a step back and take the long view of email and remember to test and tweak and listen to what your audience says, so you can build something that's more effective. One of the best ways to test email is to do it yourself practically. That means opening email accounts across various services like Gmail and Outlook.com, and send the test yourself so you could see how the email renders in your own inbox. Building on that idea of practical testing is a device lab, which is just a collection of common devices that you use every day. Something like an iPhone or a tablet or a Windows machine and sending e-mails to those devices so you could see how they render in those inboxes. In those cases, you could turn to a service like Liveness which does device testing for you and returns a screenshot of your email on a different platform. If you're MailChimp customer, you have access to litmus test results in the form of inbox inspections in the application. If you choose to build a device lab, remember that it's about building the broadest possible view of client distribution for the smallest possible investment. That means you should buy a good selection of Android and iOS phones and perhaps even a tablet or two, so you have a good overview of different email clients on different platforms. The top five email clients are iOS mail, Apple mail, Gmail, Outlook.com, and Outlook desktop. There's a wide variability between how all of these clients render emails, so avoiding that pixel perfect design is really important. The first two clients, iOS mail and Apple mail are pretty much perfect, so you don't need to do too much that's out of the ordinary as far as design and development goes. Gmail on the other hand, presents a couple of significant problems to watch out for. First, when you write CSS for your email it must all be inlined in the markup itself because Gmail doesn't support an inline CSS. Second, Gmail also doesn't support media queries which are essential for responsive design. That requires building an email in a specific way so that they are quote unquote, responsive in a platform that doesn't support it. For more information on that technique, you could actually refer to templates.mailchimp.com, where I cover it in detail. Outlook.com and Outlook desktop, despite both being from Microsoft, act very differently from one another. Outlook.com is actually on par with Apple mail and iOS mail and that it's a really good email client. There aren't any significant pitfalls to watch out for on Outlook.com, but the reverse is true for Outlook desktop. If there's one client that email developers hate, it's outlook desktop, and that's really because it's such an outdated email client. The biggest problem in Outlook desktop is that it doesn't use an HTML rendering engine to render HTML. It actually uses the engine from Microsoft Word which is a word processing engine. That means that there are significant shortcomings in the HTML elements and CSS properties that the Word engine supports. What this means is that you'll likely be doing more testing of your email in Outlook to make sure that it renders correctly. So again, make sure you avoid pixel perfect design. If you abide by the principles we've talked about today, your email can still be very effective regardless of all the rendering variances from client to client. Hopefully, all these lessons will help. Remember that above all, email development and design is difficult work, so don't get discouraged if you have a hard go of it at first. It took me a little while to get good at it and it'll take you a little while to get good at it but it can be done. Eventually, email becomes second nature and it's actually easy. 10. Closing Thoughts: So, today we've talked about the main differences between email and web design, the four main email types: by me, read me, join me, and transactional, and we've covered some best practices for an email design in general. If you're new to email design, be sure to check out our templates so you can get a nice look at different sorts of layouts and different ways to approach emails according to their different purposes. If you're diving into developing your own templates, you can download ours and take a look at the code on your own and see how they work, see how they're put together, and then try it yourself. You could also refer to resources like templates.mailchimp.com, and examples of different coding techniques that you can use in your own emails. I've also included lots of links to resources you'll find helpful and that'll help you become a better email designer. Now it's your turn to share an email whose design made you take action. Share something you feel was evocative and really made an impression on you, and write a little bit about why you feel it was such an effective email. Also be sure to ask questions and leave comments on the other emails that are shared in the gallery, and start discussions on what good email design is or isn't. Feel free to post emails that you've designed and built, and ask for feedback from the rest of the class. Remember that email can be an intimate communication medium between two people. It's a conversation, and good email design takes advantage of that fact. That allows you to build trust and relationships with your subscribers.