Advice and tips

10 tips on how to code an email newsletter

2 Jul 2018 2 minutes read

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.

Next Previous

Read article

Accessibility, Advice and tips,

Why does Web Accessibility Matter?

Web accessibility is the practice of ensuring that websites are usable by everyone, including people with disabilities. The Internet is vital for education, work, healthcare, [...]

Read article

Advice and tips, E-Commerce,

Why are the first 3 seconds of a user's interaction with your website crucial?

The growing e-commerce industry In psychology, there’s a well-known concept called the Halo effect. It describes our tendency to attribute positive traits to people who [...]

Read article