Design

Now that you have a solid understanding of how HTML emails work, we can get to the fun stuff: designing and coding your emails. Use existing materials to craft the tone and look of your email into a solid and effective layout. Keep your design simple and straight forward, focus on your message, not your craftiness.

Focus on typography first. The type is the one thing that is consistently rendered across different email clients. Most email clients block images from first-time senders by default, so your subscribers will almost always see the text of your email before they see anything else. Your message should still come across without images.

Keep in mind that your email’s layout should stay right around 600 pixels in width. Many email clients provide a preview window that’s rather narrow, and this helps to ensure your entire design will be visible. Even with the limit of 600 pixels, there are plenty of ways for you to lay out your content to create a clean-looking design for viewing in standard email clients or on mobile devices.

In this section, we delve into the specifics of designing your email for both desktop and web email clients as well as mobile devices.