Ask DN: What's the optimal way to develop a newsletter template?

over 6 years ago from , art/design/lol @ mim.st

So I am in the brink of starting to develop a newlsetter template for the first time. But since there are some variations in rendering via email I would like to ask the DN Community what are the best practices to do so.

I've read in some articles that i.e. DIV elements should not be used primarily for sectioning content but tables instead.

Also would like to know if font-embedding is as straight forward as it is in a browser.

Thank you guys!


  • Jimmy OfisiaJimmy Ofisia, over 6 years ago (edited over 6 years ago )

    Back then, I just used a base template, customized it, inlined its CSS, then tested it. Now, I just compose using a newsletter editor. There is also a good resource to start.

    Tables are recommended for backward compatibility purposes.

    3 points
  • Calum SmithCalum Smith, over 6 years ago

    Also would like to know if font-embedding is as straight forward as it is in a browser.

    Mark my words: nothing is as straightforward in emails as it is in a browser. Suffice it to say that HTML in Outlook is like opening a webpage in Microsoft Word—because they literally use the same layout engine.

    If by font embedding you mean @font-face, then I believe it's impossible outside Apple Mail. And you're right not to use divs—you pretty much have to use tables for anything where you want control over the layout.

    Campaign Monitor has some great resources on what you can get away with. A bunch of it hasn't been updated in a couple years, but luckily that's not very long in email-land.

    2 points
  • Piero BorgoPiero Borgo, over 6 years ago

    Take a look at EDM Designer

    0 points
  • Marcel Neumann, over 6 years ago

    A few years ago I made a template based on Mailchimp's that we still use, but it hasn't been updated in years and there are other options nowadays.

    Recently I've been looking at some semi-automated solutions that use custom code to build the table layouts for you: Foundation for Emails and MJML made by the guys at MailJet.

    I still haven't used any of those for any real email work, but I want to give MJML a try. It takes care of adding conditional html comments targeting Outlook and it even makes responsive email possible on Gmail's official app (although that will not be a problem anymore since Google recently announced media queries support for Gmail).

    I recommend you check both of them out, see how their code works and use the one that best fits your needs :)

    0 points