Whitepaper > Email Size and Layout

"Listrak’s podcast is the best, most insightful source of email marketing strategies and best practices I’ve found."

- Brian Fuller
Numetrics

Receive our monthly whitepapers, industry news, and invitations to webinars and events.

Email Size and Layout

Design HTML messages with a maximum width of 600 pixels so it can be viewed in the preview pane and by your recipients who still set their resolution to 800x600.
Keep important messaging, such as the main topics, calls-to-action, navigation, and logos, within the top 300 pixels so they remain above the fold.
Limit the size of an email to 40k, including images, to prevent long download times.
Use tables in your HTML code for maximum control over placement of text, images, and the width of the message. However, avoid nested tables if possible as they might not render properly in all email clients.
Limit the use of rowspans and colspans as they might not render properly in many email clients.
Set the height and width of your images to help your message maintain its proper layout even if images are turned off.

Check all HTML code to be sure it is valid and that all tags are closed.
Avoid CSS as many email clients strip it out or overwrite it. If your designers insist on using it, keep it to a minimum and only use simple attributes, such as text style and color, and be sure they use inline styles.
Don’t use java, JavaScript, frames, ActiveX, ASP, PHP, cache busters, or Dynamic HTML as most email clients do not support them.
Don’t use form elements as they could be stripped out of the message.
Don’t embed Flash and other rich media files and videos in your messages. Instead, your emails should link to a landing page containing the files.
Use <p></p> tags instead of <div></div> tags for alignment purposes and <br><br> tags to separate paragraphs of text.
Be careful using <body> tags as they could be stripped or ignored.
Remove Meta tags from the code as they are not used by email clients. They are extraneous code that is unneeded and, therefore, should be removed.
Review HTML code for extra code that shouldn’t be there. Using programs such as Dreamweaver or other WYSIWYG editors can add extra code to your HTML, which may cause some display issues.
If applicable, check personalization tags and dynamic content to be sure the code is correct. If they aren’t, recipients will see the wrong messaging.
Use title tags in link URLs for better readability, such as:
<a href="/" title="Listrak Site">

< Previous

1 2 3 4 5 6

Next >