hello@digitalethos.net
0333 772 0189How to build an HTML email
1 min read
Sophie Rizan
Creating an HTML email from scratch can be a challenging, tedious and difficult task and, as a result, the majority of developers do not enjoy building emails.
This is mainly because developers have to get to grips with a complex coding systems that can be difficult to master and extremely time consuming.
We’ve created a helpful guide outlining how to build a HTML email – we hope you find it helpful!
Structuring your email
As a general rule of thumb, you should always build with tables when it comes to structuring your email.
This is not only one of the easiest ways to build your email, but it is also one of the most reliable ways to write an HTML email. And rather than using tags such as <section> and <div> alongside CSS, it’s much better to use old tags that, which were first introduced around 1995 and 1996.
The majority of developers also prefer to use a basic structure of two boxes placed next to each other, however, all boxes must be contained within one table.
Creating the body of your email
To get started you should begin with a <body> tag, set your margins and padding. This should be set to zero in order to avoid any unexpected space.
You will then need to place a table of 600 pixels wide inside the container table, as this will allow you to display the vast majority of your content comfortably.
And remember, if an attribute exists in HTML, you should use that instead of CSS.
Creating the structure and header
Now it’s time to create the structure and header. Your email should be divided into three sections, with a row for each part of the email. Then you should input the coding accordingly.
Styling your email
During this process, you will need to create text formatting, an image size, media queries and specify the media type, these are all vital components when it comes to creating a responsive email.
Testing
It’s vital that you check and test your HTML emails and there are lots of different online tools that will allow you to do this effectively including Litmus, which is an email testing environment that allows you to build, test and send your HTML emails in real time.
Always set your values in pixels
You should always set your values in pixels when creating an email and remember, it’s best to set your widths on images as an HTML attribute and not a style.
