10 tips on how to code an email newsletter

Want to create an HTML email template? Remember that it is not only its design what matters. It is also the dysfunction of tools available on the market. For example, some mail applications may not support the solutions you want to use in your email code. So, how to make your newsletter look good on every device and in every email application? See our checklist of best practices in coding emails!

5 tips on HTML email template

  • Use tables when coding a newsletter. <table>, <td>, <tr> are usually read properly by most email applications, while <div> and <p> can mess up your email design.
  • Use UTF-8 coding standard. It allows email application read out letters, numbers, and special characters of all languages around the world.
  • Use inlines for creating styles. The great majority of email providers delete a <head> section from an email code.
  • Set the margins and paddings to zero. Thanks to this, you will minimize the risk that the content of the newsletter will move when displayed.
  • Try not to use colspan and rowspan options in your HTML email so that its layout doesn’t mess up.

What other nuances remember about?

  • The width of your newsletter template should be 600 px. Thanks to this, your message will display well on every kind of device. At the same time, a universal size for a background image is 1600 x 600 px. However, remember that email clients often don’t support CSS background images. For this reason, use HTML background attribute on table or <body> elements.
  • Use graphics as block elements (display: block) if you do not want spaces to appear under the newsletter images.
  • Bet on popular fonts. Use the ones that are so universal that they will display correctly in every email application. The safe font families are, for example, Times New Roman, Arial, Georgia, and Verdana. If you want to use extravagant fonts in your HTML email design, put them on graphics.
  • Save colors in HEX or RGB formats. There is a high risk that other formats will not be supported by some email applications.
  • Don’t use Flash animations. Replace them with GIF ones, as they are commonly supported by email providers. Also, avoid using JavaScript in your HTML email template as almost all email clients block it.

Do you already know how to encode mailing? It’s high time you get down to it! We keep our fingers crossed.

You might also like

Read article Magento, Woocommerce, and Shopify logos rising across the graph
Advice and tips, E-Commerce,

How to stand out in E-commerce?

When you’re ready to start selling your product, the number of options available can seem overwhelming. The internet offers countless platforms that allow you to [...]

Read article Graphic of a girl with both arms outstretched and wondering between Shopify and Shopify Plus
Advice and tips, E-Commerce,

Shopify vs Shopify Plus

Do you think of running your e-commerce store on Shopify? Brilliant idea. When you already decided on the selling platform, you are about to select [...]

Read article A simple graphic showing the silhouette of a man working at a computer
Advice and tips,

What Is LLMs.txt and Why Does Your Website Need It in the AI Era?

The age of AI is here, and businesses are racing to adapt to this transformative shift. Your website isn’t just a digital storefront anymore—it’s a [...]