Email Design Guidelines

The very best of email marketing communication is true art. It is both attractive and effective. However, even a novice, who follows some simple considerations, can dramatically improve their chances of success.

Overall design
• Keep email width under 650 pixels. We’re designing for the preview pane and it doesn’t get much wider than that.
• Design above the fold. It’s okay for an email to scroll but basic idea is to design considering the fold area (Area visible at first glance). If the content is lengthy and overflows above the fold area please make sure that key elements are at the top (logo, call-to-action, navigation, primary subject matter, etc.) and by top ( within the first 300 pixels).
• Keep it short. Don’t overload your email with content. Use it as a tool to drive recipients to your website or landing page. Most people prefer to read large amounts of text in a web browser as opposed to their inbox. Give them a taste and a “Read more here…” link.
• Keep it simple. Don’t try and design a complex html masterpiece and expect everyone to see it the same way you do. The more difficult your email is to code, the more difficult it will be to see across the many email clients.

HTML Do’s and Don’ts (mostly Don’ts)
• Code emails by hand. Many “WYSIWYG” editors will typically add in a lot of extra code that email clients will tend to “cough on” and cause your email to display poorly. Never use the “Save as Webpage” feature of Microsoft Word. Dreamweaver is usually okay, but have a working knowledge of HTML so you can check for code that shouldn’t be there.
• Tables are your friend. In the web world designing with tables is on its way out. In the email world designing with tables is the only full-proof way to have your design rendered correctly across all email browsers. Use tables.
• Don’t use Javascript or other dynamic scripts. Even if a SPAM filter happens to let your email through untouched, most email clients will not allow these scripts to function.
• No Flash, Quicktime, Windows Media, Etc. By default, the ability to view these rich media platforms in email is turned off in most email clients. Provide a link to view your rich media on a custom landing page.

• Avoid excessive CSS. Many email clients strip out Cascading Style Sheets (CSS) or over
write it. The use of CSS is acceptable in email, but there are many strict guidelines you need to follow. Simple attributes like text style, color, and sizing are usually okay and acceptable across the majority of email browsers. When you start defining spacing, margin and other
positional elements with CSS you will run into problems.
• ALWAYS use inline styles. Do not attach style sheets or define all of your attributes in the section on your html.
• Avoid nested tables. A lot of times they are unavoidable, but we recommend using them sparingly. Some email clients, Lotus Notes and Netscape Messenger in particular, may not render them correctly.
• Avoid complex colspans and rowspans. Some email clients will choke on these and they can make content revisions a nightmare for the next edition. Use them sparingly.
• No body attributes. Most applications strip out everything that’s not in between the body tags.
So if you want to make a background green, do it with a stretch table background or CSS.
• Don’t embed images. Host images on your website or let your email service provider host them for you. Then make sure your image paths point to the full URL: (http://www.yourwebsite.com/yourimage.jpg)
• Avoid 1x1 pixel spacers. Some spammers use them and they may get your email flagged.

Images
• Don’t use images for important content such as headlines, links, or call-to-action. Or if you
do, make sure there is an html backup. Chances are images may be turned off making the key elements of your email useless.
• Use alt text for your images and make it say something compelling about the subject matter like “see this motorcycle in action”.
• Use image widths & heights. This way your design will maintain it’s basic structure when images are turned off in email browsers.
• Optimize. Make sure your image file sizes are as small as you can get without losing their visual integrity. Large images should be cut up into smaller, more downloadable sizes. No one wants to wait 10 seconds to see your 100kb jpeg.
• Background Images. Avoid using them. Many email clients do not allow.

Text Content
• Balancing act. Include an even balance of images and text. The email campaign that is sent as one image tends to end up in a Junk or SPAM file.
• Avoid gimmicky phrases like “Act Now”, “Special Clearance”, or even “Click here” in your emails. Spam filters look for these key words when diagnosing a potentially unsafe email. If you need to use them, put them in a graphic.
• Avoid invisible text. This is another trick spammers use and has become an instant flag for spam filters.
• Make it compelling. A no-brainer, but often overlooked. The more compelling your text is, the more your recipient will ignore possible design problems, be less likely to hit the delete button, and more likely to click your call-to-action.

Best Practice
• View this email in your web browser. Always give your recipient this option. Often even after every step is taken to ensure proper design, an email client will mangle an email. It happens. Make this a text link at the top of every email.
• CANSPAM. You must include an unsubscribe option in every email as well as your company name and address. Follow the rules like we do. Often this option is automatically built into your email provider’s application.
• Forward to a friend. What better way to reach more recipients than by adding a simple link to let others share your message? It’s also a good idea to include a “subscribe” option so the friend can subscribe to the mailing list. What better way to ensure deliverability and build your list?
• Subject Lines take first place. Without an accurate and compelling Subject Line, the chances of your email being viewed are very low. Give people a reason to open your email by branding your subject line and by highlighting the most important part of your message. Anything longer than 55 characters (and spaces do count) will get cut off for many recipients. A character count
of 35 really is a better number to aim for. Finally, test at least two subject lines to a portion of your list before selecting one to send to the majority of your recipients.
• Table of Contents. For scrolling newsletter-type emails, include a list of anchors at the top of the email so that users can easily navigate throughout the email.
• Subscriber Preferences. Having options is always nice. If your email provider offers it, include a link to update subscriber preferences. Allow recipients to add or change an email address or select content best fit for their tastes.

Testing Testing Testing.
• Test your email to various email clients and see which ones work best. If possible, compare this with your list analytics and design accordingly.
• Try turning images off to see what your email will look like. This will give you a reference for designing around this common occurrence.
• Use Spam-evaluation services Check it … It will make sure that it is not going in to recipient’s spam box।