Postcard Design Guidelines

MailSnail best practices to follow when designing postcards.

MailSnail.io
MailSnail Help Center
4 min readMay 8, 2017

--

Download all postcard template guidelines (PDF) here.

Postcard Front Guidelines

Bleed Size
The design that you are sending is should actually be4.25" x 6.25" instead of 4" x 6". This extra space is what we call the bleed area. The bleed area is included to ensure that artwork gets printed to the edge - artwork gets printed with larger dimensions and is subsequently trimmed down. Although, backgrounds and graphics should be extended into the bleed area as shown with the background in the below examples. Not having them extend into the bleed area could result in a white or unprinted border around the edge of the postcard.

Safe Zone
Keeping all text within the safe zone is important to make sure no important content is cut off during the trimming process.

Postcard Back Guidelines

Address Block and Postage
On the back of the postcards, there is a space marked off as *RED: INK-FREE AREA*. Anything in this area will not be printed to leave room for the postage and address information.

HTML

When designing content with HTML, use inline styles or an internal stylesheet. Do not use an external stylesheet. If you are linking to images, make sure they are at least 300 dpi. Because the content is only being designed for a single size, we recommend using absolute positioning.

Image Formats

When using PNGs or JPEGs with Lob, we require a minimum of 300 dpi. The dpi is calculated as (width of image in pixels) / (width of product in inches) and (length of image in pixels) / (length of product in inches). For Example: 1275px x 1875px image used to create a 4.25" x 6.25" postcard has a dpi of 300.

Hosting Images

If you use HTML we recommend you host any images on a performant file hosting provider such as Amazon S3.

Fonts

If you use HTML we do allow the use of Google Fonts.

Postcard Personalization

MailSnail uses the Liquid Template language (which is similar to mail merge) to allow you to customize your HTML template designs.

Merge Fields

If you want to include a customer’s attribute in your template, you’ll want to include a merge field that references that attribute. For example:

{{ customer.fullname }}

When you insert a merge field into your HTML template, we’ll replace the tag with the content stored in the corresponding list field. Anything you include should start with customer. before the attribute name.

Here are the available merge fields:

Filters

There are a number of different filters you can use within tags. In the fullname, if you wanted to make sure it was capitalized, add a capitalize filter to the tag:

{{ customer.fullname | capitalize }}

If you wanted to include only the first word/name, you could use:

{{ customer.fullname | split: " " | first }}

Check out the other standard filters.

Conditionals & Fallbacks

If only a subset of your customers have a specific attribute or match a specific condition, you can include specific content that only that matched customer will see. You also have the ability to set up a fallback.

--

--