Templates - Do’s and don’ts

Usage and possibilities depends on which template you have, but there are some do’s and don’ts that cover all the templates.

  • Do not make changes in the original template, except for links. Always make a copy or work in a draft.
  • Make sure the unsubscribe link in the template works like it should.
  • Be careful with adding margin and padding, as in never ever do it to the sides of a block. If your template is responsive, the added top or bottom margin will render on smartphones too – and might look a lot bigger than you intended.
  • Work with the layout of the template, not against it. I.e do not force the blocks to behave differently than what they are designed to do.
  • Try to limit the amount of  different styles in every text element – both for the sake of code and readability.
  • If you have ordered a new feature or block, or if something has been fixed, you will have to “Create new” and/or re-save your autos in order to see the change.
  • Make use of the “Remove formatting” button in Carma. If you tend to copy-paste text from other documents or often copy send outs – this is especially important. Excessive formatting can cause rendering issues which might not always be visible in Carma.
  • When using “Import content from another campaign”, be mindful of which template the different campaign are built from. Using content from different templates’ (no matter how similar they seem) may cause malfunction.
  • Responsive images should be about the same width as the placeholder image, and we recommend high resolution .png-files. You cannot change the size of these images in Carma. Non-responsive images have adjustable size, but should not be wider than 320px (and keep these high resolution .png-files too). Custom templates may have specific recommendations, you should follow these.
  • You are responsible for your template. Should the template require fixing, you will be charged for the production hours spent if your changes are the cause of it – even if those changes are made in Carma.

Designing for email

Regardless of template or editor, there are some key points to keep in mind when designing your new template. These are well known, often referred to as “best practice” within email. You can disregard them, but know you are doing so at the expense of readability and deliverability – the perhaps two most important things in email communication. Best practice is considered to be:

Mobile first

Always design with mobile first, since more than half of your recipients most likely will read the mail on a small screen first. For instance, if you have a lot of product images these will stack on top of each other in mobile which may lead to a whole lot of scrolling for the recipient.

Web safe fonts

Do use web safe fonts. Custom fonts are suggested in CSS, which means not all devices and clients will be able to support them and this may disrupt your design in line height and size, if the fall back font is very different.

Large, high resolution images

This is what differentiates your professional email from other D.I.Y emails in the recipients’ inbox, especially on smart phones’ retina screens.

Do not rely on CSS

Letter spacing, line height, shadows et cetera – what we can do in CSS is rapidly getting better and more exciting! But so far, we still see a lot of recipients in devices and email clients which do not support CSS. We highly recommend designing your template so that the mail looks great even without CSS-support, and do not expect exact line height in for instance Outlook. Yet.

Accessibility

It’s not more than fair, really. Everyone should be able to read your emails, so keep in mind that you are designing for different abilities. Visual impairment or color blindness should be considered in your design, as well as how different aids can read and interpret your mail.

”Good enough for most enough”

Aim for an all-round look for many different email clients and devices. Yes, most mails look great in iPhones native client, but even if a majority of your recipients use it – forgetting the rest is rude. With the same logic – should your link color look weird in Lotus Notes which 0.00002% of your recipients are using, you can probably do something better with your time than trying to solve that particular issue.

Colors and branding

Your brand should be recognizable, and the colors should not clash. Your mail should feel pleasant for the recipient while still represent you.

Image sizes

In the Carma Editor some of the image sizes are fixed in width but not height, to assure proper rendering in both desktops and smaller screens. Your original image should be close to the placeholder in width.