How to Test Email Before Sending

One of the best email practices is to test the email before sending it to the whole list. During the test you can not only check how your HTML email is displayed for your recipients but also ensure that your email is delivered into the Inbox but not into the Spam or Bulk email folder.

Read more on How to Test Email Before Sending…

Embedding Images into HTML Email

Using HTML Effects in the Email Message

The capability to use images and photos in the messages is the main reason why people want to send HTML emails. The images allow you show your products to potential buyers, in addition they’re often used to track email open rates. But like many HTML tricks, they have their down sides. Spammers often abuse the images, so some email clients don’t show them at all without the user’s permission. Other email programs display the images included in an "img" tag, but not the images that are included with CSS, or as a background image, or both.

You can embed an image into a HTML email in a couple of ways:

#1. Inserting an image from the disk

- Save the image to a folder on the disk, for example,
D:\Work\Helps\G-Lock EasyMail\Pictures\image.gif

- Put the cursor at the place in your email where you want to insert the image
- Click on "Insert Picture" button in your email program
- Click "Browse" and select the image file on the disk
- Click "Open" to insert the image into the message

Read more on Embedding Images into HTML Email…

Using the Image ALT Tags

When an image doesn’t show, or when a recipient is scrolling the mouse over a displayed image, you can let them see a text description of the image using the HTML "alt" tags in the message code.

It’s a good idea to use the "alt" tags for logos, headers, section titles and other images in your newsletters. In e-commerce emails you can include the "alt" tags to describe the product photos and banners.

A sample "alt tag" that displays the image description looks like this:

<IMG alt="some text here" src="C:\Documents and Settings\...\Disco\Disco_01.gif">

Type the description that would clearly tell the recipient what is on the image, for example, "Samsung Z400" if you write about mobile phones, or "Nissan Frontier" if you write about cars. A vague text like "Click here" or "Photo" doesn’t give an incentive to download and view the image. 

Using the "alt" tags in your HTML emails can be important because:

Read more on Using the Image ALT Tags…

CSS in HTML Email

CSS (Cascading Style Sheets) is nice for websites, but don’t relay too much in it with HTML email. For instance, you shouldn’t expect DIVs to work. And definitely avoid CSS positioning – it won’t work. Use old-fashioned <TABLES> tags for your layouts in HTML email, and only use CSS for simple font formatting and colors. Always design your email so that it looks decently if someone removes your CSS. Before you send your HTML email, delete the CSS and see how it displays.

CSS is especially a touchy situation if you’re using a WYSIWYG to design your HTML email, because WYSIWYGs insert all kinds of crazy CSS and DIVs by default. It’s one of the drawbacks of WYSIWYGs for HTML email. It may help you get things coded, but you still have to understand HTML enough to go back and remove some of the code, so things won’t break in email applications.

Stylesheets that Stick

When you’re coding an HTML email with CSS, make sure that you don’t use linked CSS files (.css files attached using link or @import). These stylesheets are most widely ignored by email clients.

CSS style declarations in the head of an HTML document (using style tags) are ignored by some email clients, such as Gmail, so they should be avoided for styles that are key to the email design.

The most reliable way to include CSS in an HTML email is to use inline styles. They aren’t pretty, but few email clients ignore them. These styles are defined within the HTML tags in the body of the document, like this: <p style="color:green;font-family:sans-serif;">green and arial text</p>.

Using span tags to apply inline styles also works well.

Layout Techniques

Most people suggest using table, tr, and td tags for page layout within an HTML email. Tables are the most stable option, especially if you’re creating email messages that require a more complicated multi-column layout. Gmail simply removes div tags, and coverage in other clients like Hotmail is spotty. Also, floating div tags don’t work in several email clients, so any floating elements can be placed in a table (using <table align="left">, for example).

Using a div tag for a layout or background color is a better option when you’re working with a single-column layout. Applying styles to div tags using inline styles versus a style tag will help keep that style in place when the email ships out to the masses.

On the bright side, you can scale back on div tags if they’re causing problems, and use the almost universally supported table, tr, and td tags for anything you can’t accomplish reliably with a div.

Formatting Text

The best way to make sure your text formatting sticks is to use inline styles, but applying an inline style to every bit of text is tedious and may add too much extra weight to the HTML. If you aren’t especially picky about details like the exact pixel size of your text, whether your "black" text shows up dark gray, and how your links are underlined, you’ll probably be happier applying text formatting with a style tag rather than inline.

One place where inline styles may make a real difference is in the headings and special notes within your email. When you want to ensure that a certain notice is always red, or that headings are the same shade of orange as your logo, you should use inline styles for that formatting.

Some email clients are notorious for changing text in strange ways that can only be overridden with inline styles. Hotmail, for example, always displays links in small blue Verdana, regardless of the appearance of the rest of the email. If this is a problem for you, you should use inline styles on each link tag to override it.

General "Do’s" and "Don’t’s" for HTML Emails with CSS

Do …

Read more on CSS in HTML Email…

How Different Email Applications Render HTML Email

The recipients will be viewing your email newsletter in different email applications which render HTML email differently. For this reason, you need to test your email first and make sure it works in as many different email applications as possible. There are many email applications out there and they all render HTML email in different sometimes unpredictable ways. Do you need to test every single newsletter across every single application, every single time you send? No. Just setup a good, simple, foolproof template and test it as much as possible. In the future all you’ll need to do is to vary the content. It really helps to setup a test computer (or two) in your office. If it’s not possible, send the email to a few friends or office-mates. Just ask them to let you know if anything looks "off" or broken to them.

In the table below we summarize the particularities of most popular email clients. Knowing common issues of various email applications will help you find the optimal HTML design so that you email newsletter is displayed in the suitable way for all the subscribers.

Read more on How Different Email Applications Render HTML Email…

Finding the Optimal Message Width

Now when you’re familiar with the common HTML components and know how they are handled by the most popular email clients and web-based services, you can start with composing your email newsletter.

In this chapter we’ll give you some tips and advices how to optimize your email message and how to create a good, healthy email newsletter that would produce high delivery results and draw the recipient’s attention among hundreds of other emails flooding their inboxes every day.

Read more on Finding the Optimal Message Width…

Tailoring “From” and “Subject” Lines for Email Clients

So you got a great email message design, wrote a perfect Subject line, added your company name to the From field and you think you’re ready to send the email out. Wait a minute. You work may not be over yet. You probably will need to spend some time for optimizing your From and Subject lines. What does it mean and why is optimizing the From and Subject lines so important?

You know different email clients render the From and Subject lines in different ways. This is one of the challenges of distributing email newsletters.

Some email clients limit the quantity of characters if the From and/or Subject lines. So, if your Subject is too long, it will be cut off and may be unreadable for the recipient. In some email programs the From and Subject lines are interrelated – the longer the From field, the shorter the Subject line is allowed. The From field can be displayed either as Name + Email Address, or Name, or Email Address in different email programs.

It’s good if you know what email clients your recipients use to view your emails. You can then tailor your "From" and especially "Subject" lines to display properly for all the recipients. If you don’t have the information about your recipients’ email programs, try to optimize your message at least for the most common email clients listed in the table below.

Read more on Tailoring “From” and “Subject” Lines for Email Clients…

Best Email Delivery Practices Gone Bad

OK, we’ve just described best email practices you should follow to pass as a good email marketer and get better delivery results. But you know there is nothing constant on the Internet. New methods are being adapted; old ones go out of date. Email delivery practices change as well. Email practices that were widely and successfully applied yesterday may not be so effective today. 

With all that said, we feel it’s reasonable to get you familiar with email sending tactics that are no longer good. If you are using any of such tactics or may just be thinking about applying any of them, you may consider changing your mind and not engage into them.

Read more on Best Email Delivery Practices Gone Bad…

Anti-Spam Filters in Email Clients and Web Mail Services

Along with the ISP spam filtering systems, people can use anti-spam filters in their email clients to protect against unsolicited emails. In the table below we summarized the information about anti-spam filters in most popular email applications and web-based email services.

Read more on Anti-Spam Filters in Email Clients and Web Mail Services…