Email Designer Advanced Topics

Rob Howard Updated by Rob Howard

Below are some advanced topics related to the Email Designer.

Image best practices

It's important to use images in your email, but too many images can flag your email as potential spam. And, images should be resized for optimal display in the email.

The best-practice dimension of an email is 640 px wide. If your image is wider than 640 px it means the image will have to be resized to fit in the email and the image file size is likely bigger (and will take longer to download).

  • Try to strike a balance between images and text
  • Resize images to 640 px width using an image editing tool
  • Use percentage to specify the width of an image - this will enable the image to scale on smaller devices.

Building mobile friendly (responsive) emails

The majority of your email will be read on mobile devices. And, it is important to optimize the email for mobile devices.

First, ensure that for any fixed width tables, there is a CSS media query for your email so that the tables can be set to 100% width. While this won't help for Microsoft Outlook clients, your iOS and Android mobile users will be appreciative.

Second, follow image best practices and use images that scale. This will allow the image to resize itself automatically on smaller screens.

Adding whitespace between widgets in your email

Whitespace is important to use in any design, but especially emails where you want to use whitespace to increase readability.

For example, if you have a set of buttons that are stacked, you had change the top and bottom padding of those buttons to create whitespace:

Use whitespace

How did we do?

Send an email to a single contact

Email Merge Tags