Created by Mailchimp.com this eBook takes you through what you need to know to undertake a professional email marketing campaign. You don’t have to be a professional web designer to use this guide, but a little HTML knowledge will help. First, we’ll cover all the basics, like how HTML email works (and why it always seems to break when you try to send it yourself). Then we’ll get into the technical stuff, like how to design and code your HTML email. Finally, we’ll run through email-marketing best practices for list management, deliverability and measuring performance. (PDF file, 22 pages, 4,137 KB)

Request this document for free by email:   ► Show all documents 

Unformated preview of the document: 'A Field Guide to Email Marketing' (Part 4):

up with a system and process for archiving, so that each newsletter
isn't a chore to publish.
Nowadays we don't even bother, because we use MailChimp's built-in
archive functionality. It'll save a copy of every campaign you send from our
system. You can build a page on your website called "Newsletter Archives"
and paste a little code snippet from MailChimp. We'll keep your page
updated with your most recent campaigns. Saves so much time.
4. An FTP program, like Fetch for the Mac, or CuteFTP for PCs. When you
design your email and slice out all your graphics, you'll use FTP to move
those files from your computer to the server.
5. A test machine (or two), loaded with as many different email applications
and accounts as possible. You'll want to check your HTML email
designs under lots of different scenarios. Unlike web design, where you
only have to check your work in a small handful of browsers, there are tons
of email applications out there, and they all handle HTML email differently.
If you use MailChimp, you our Inbox Inspector tool will do all the
testing for you.
Tip: You can use MailChimp's Inbox Inspector to get screenshots of your
work in all the major email programs and webmail clients, to see if your
CSS is breaking. Saves a lot of time and hassle.
Design guidelines
Here are some pointers for designing your email. Early warning: If you're a
seasoned web designer, you won't be happy with all the compromises and
hacks you'll have to make when designing for email applications.
Set your width to about 500-600 pixels.
If you've ever worked on a website, you're probably used to designing pages
to fit in 800x600 pixel resolution screens, or maybe even 1024x768.
But that won't work when you design HTML email. Most recipients will be
looking at your email through their preview pane, which is usually a small
portion of their available screen. A width less than 600 pixels is safe for
most programs.
Simple layouts and tables work best.
You wouldn't believe all the different ways email applications garble up
HTML email. Keep your email designs nice and simple. Avoid complicated
layouts, too many embedded tables, and tables with too many rows and
columns. A simple two-column table with a row across the top is about as
complex as you can get. Lots of email applications don't cooperate when
you code tables with colspans, which are table cells that span across multiple
columns. One application that's particularly finicky when it comes to
tables (and just about everything else) is Lotus Notes.
If you're working on an email layout and find the tables are getting complex,
and you're having to code too many colspans, you might think about
chopping it up into separate tables. For instance, we almost always use
separate tables for the header, body and footer of our emails. Better to go
with more simple tables, than one big complex table.
If you're a CSS master, you're probably rolling your eyes in disdain with all
this "tables" talk. But trust us—you're not going to be able to use all that
cool, timesaving CSS stuff in your HTML emails. DIVs and CSS positioning
don't work. We'll cover that later in this guide.
6
Special Considerations for Webmail Services
A lot of your recipients will be checking their email in their web browser,
such as with Yahoo!Mail, Hotmail or Gmail. Since they're viewing email in
browsers, there are certain things you need to know when you code your
HTML emails:
• They'll strip out your <HTML>, <HEAD>, and <BODY> tags, in order to
keep your code from interfering with their web pages. That means...
• Any background colors you specify in your <BODY> tag will be lost. So
wrap your entire email inside a larger, 100% wide table, and set a background
color to that table.
• Any CSS that you place inside the <HEAD> tags will be lost. So don't
try to link to CSS files hosted on your server. Use embedded CSS instead,
and make sure it's below the <BODY> tag. If you're a web designer,
that'llmake you feel kinda dirty because that's not exactly the proper place
to put embedded CSS. But no worries—it'll work. If you just can't stomach
that, use inline CSS.
• Some webmail clients are starting to strip even the most basic CSS,
even if it's embedded below the BODY tag (like we described above). We
think it's because they don't want any of your CSS

Unformated preview of the document: 'A Field Guide to Email Marketing':  Part 1, Part 2, Part 3, Part 4, Part 5, Part 6, Part 7, Part 8, Part 9, Part 10, Part 11, Part 12, Part 13, Part 14, Part 15, Part 16, Part 17, Part 18, Part 19