In case you missed it, we recently released a new email template language that makes it pretty easy for web designers to code custom templates using some basic HTML and CSS that will tie into the MailChimp design inspector, so your clients can tweak certain design elements with out destroying the layout or design.

Follow these best practices and you are sure to create awesome emails that your clients will love:

• Your email layout should be no wider than 600 pixels for best viewing in various email clients
• Avoid using the following CSS in your templates:
  • Floats
  • Positioning
  • Background images (doesn’t work in Outlook and Gmail)
• Use this wonderful reference created by our friends at Campaign Monitor to see what CSS is supported in major email clients http://www.campaignmonitor.com/css/
• It’s a good idea to limit the number of editable spaces in the template to keep things simple
• Name all editable spaces consistently. The name you assign via mc:edit="somename" is used to create a field in the database to store the user’s content. If they switch templates after writing content, they could lose their copy if the editable space names aren’t consistent. Use the following conventions common content areas:
  • mc:edit="header – used to name the header
  • mc:edit="header_image" – used to name an editable header image
  • mc:edit="sidecolumn" – used to name an editable left or right side column
  • mc:edit="main" – used to name the main content space
  • mc:edit="footer" – used to name the footer
• Editable images should not be placed within an editable content container
• Set the @theme declaration in your CSS for the page background, header, footer and content space so templates can be quickly customized with the MailChimp color themes. See the template language docs for the correct names to be used.
• Be creative with the use of merge tags. Use the social merge tags to provide readers of your email new ways to connect with you and share your content. Use The table of contents merge tag (*|MC:TOC|*) to create an automatic list of links to the <h1> and <h2> headings in an email.
• Be sure to include the required CAN-SPAM info in the footer (*|UNSUB|* *|LIST:DESCRIPTION|* *|LIST:ADDRESS|*)
• Include target="_blank" in links to ensure they open a new browser window or tab when emails are viewed in browser based email clients
• Include a link for users to update their subscription preferences <a href="*|UPDATE_PROFILE|*" target="_blank">change subscription preferences</a>
• Include a link to let users view the email in a browser: <a href=”*|ARCHIVE|*” target=”_blank”>view this email in a browser.</a>
• Include a link to your website: <a href=”*|LIST:URL|*” target=”_blank”>visit our website</a>
• Feature the forward to a friend link somewhere prominent <a href=”*|FORWARD|*” target=”_blank”>forward to a friend</a>. Make a cool button treatment for it where possible to encourage sharing
• Once you’ve created a template, put test it in a campaign and try customizing it by changing color, adding content, etc to make sure it will work well for others who might be using it in different situations.