HTML Email Coding Options

In the early days, most email newsletters were typed up and sent directly from an email client, sometimes using a mail merge for personalisation, or a more visual document was attached as a PDF to an email. Then came the ability to obtain software that would allow you to send emails in bulk via an email service provider (ESP). With this came the option to create image-rich emails using a text-based editor, given that you had HTML coding skills. Fortunately it wasn't too long before someone created a WYSIWYG (pronounced wiz-ee-wig) What-You-See-Is-What-You-Get editor that would allow email marketers without HTML email coding knowledge to create similar image-rich emails.

A WYSIWYG HTML editor allows someone without coding knowledge to add rich elements to an email by using a tool kit. Similar to using the tools in a Word programme, a WYSIWYG editor is easy to use and does not require any knowledge of HTML. Some WYSIWYG editors allow you to switch between the visual version and the HTML version of your email, which is a benefit for those who do know basic HTML and can fix any errors that may appear while using the WYSIWYG editor. Newer WYSIWYG editors have a drag-and-drop feature, which allows the user to drop all the elements into the editor and quickly compose the email.

A text-based editor is very much more hands-on, and requires a good knowledge of HTML and CSS styling in order to create attractive emails. Some web developers and email marketers prefer to code an email manually as it ensures that the code is clean and accurately read in modern email clients. Adding certain elements using a WYSIWIG editor can sometimes shift your HTML around or input it differently than what you would've preferred so sometimes this can only be done properly using an HTML text editor. Read more about email HTML design tips & best practices here.

In both the WYSIWYG and the text editor, it is important to consider responsive design to ensure that your email shows up correctly on all devices. Some WYSIWYG editors may not have the ability to convert the code in to a responsive HTML email, here a text editor will be required in order to ensure that emails work on all devices.

Depending on whether an email marketer is comfortable outside of a visual editor or if they prefer to work directly with HTML, designing & editing an email template can have its pros and cons.

Pros of a WYSIWYG editor

  • Easy to use and requires no knowledge of HTML.
  • Usually faster than coding from scratch.
  • Allows the email marketer more control over the design of the email, focusing on what it looks like as it is created.

Cons of a WYSIWYG editor

  • If something is broken or not showing up correctly in a preview, one will need to switch to the text editor to fix the HTML.
  • Email may not end up looking exactly as planned; using HTML and CSS will give more precise results.
  • May not include all metadata when adding elements using the toolbar.

While most modern ESP’s, like Total Send, offer both the WYSIWYG and the text editor, there are some standalone editors that are more comprehensive. For a WYSIWYG editor, software like Adobe Dreamweaver and Flux are popular, among a that are available for Windows, Mac and Linux.

As for text editors, there are hundreds of good programmes, from open source to paid programmes. The notable editors include Notepad++, Sublime and HTML kit.

No matter which editor you use, it is always extremely important to test your emails thoroughly before send out. Read more about A/B split testing here.