Viewers: in countries Watching now:
This course provides hands-on training on all aspects of email marketing, from crafting emails and setting up effective marketing campaigns to managing spam filters and evaluating delivery services. Author Tim Slavin introduces the fundamentals of email marketing, including the differences between HTML email and web pages, how to code emails that display properly on receipt, and ways to stay current with HTML email standards and capabilities. The course includes several project-oriented tutorials on creating multi-column newsletter layouts and multi-product offer emails, and also explains how to automate email creation, test emails prior to delivery, outsource campaigns, and address common coding problems.
This video shows common problems you might encounter when you send an HTML email to Outlook, along with solutions. The typical issues you might find with Outlook have to do with borders around images, background images, floats, and margins versus padding. Let's start with image borders. By default, Outlook appears to attach borders to all images. As a result, you need to add the style border:none to every image that you don't want a border around.
This will fix the problem. The next image you might find with Outlook has to do with background images. Outlook 2007 and 2010, for example, do not display background images. Here is a solution from the Campaign Monitor blog, and the URLs are in the exercise file, but here's the code. You need to add Microsoft VML code. You open the code up here and you close it down here after the content.
So you need to put content between two chunks of VML code. Within the VML code there are several important details. One, you need to define where the background image can be found. Two, you need to define the height and the width in two separate places within the VML code. It's up here, and it's down here, and this height and width must match the height and width of the TD cell and the image that's being used as the background image.
This approach will display background images in Outlook 2007 and Outlook 2010. The final issues you might find with Outlook have to do with floats and margins versus padding. It's never a good idea when you code HTML email to use floats. Instead, at the TD level, the table- data level within your HTML tables, use the valign and the align elements to define whether data floats to the left, to the right, or the center, the top, middle, or bottom.
In addition, Outlook is more likely to respond to margin settings than it is to respond to padding. You may find, for example, that you use padding in your email design. When you test it in Outlook, however, the padding setting is ignored. If that's the case, simply switch padding for margin to see if that works. You can find the latest on Outlook compatibility with CSS at the Guide to CSS support that Campaign Monitor publishes on their web site.
There are currently no FAQs about Effective HTML Email and Newsletters.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.