Learn tips and best practices for setting up HTML email notifications, including using CSS and adding images, or find answers to frequently asked questions.
|
Are you new to setting up and managing notifications? Read the article Setting up email notifications to learn more. |
Sending HTML email tips
Back to topCreating notifications and emails that render the same across all email platforms can be tricky since all email clients have their own rules. That said, a finely tweaked HTML email can organize your notifications and receipts in ways not available through plain text.
Here are some tips!
Keeping it simple
Back to topYou aren't building a web page. Overly complex HTML email can cause delivery and formatting issues. Use the minimum formatting to provide an attractive and functional layout.
Using a table structure
Back to topMany platforms don't support absolute positioning (float, margin, padding), so tables work much better as the framework for your design.
Using inline CSS
Back to topInline CSS is more reliable than using CSS in the header. Gmail, for instance, strips out the CSS in all emails. Using inline CSS will make your style visible to those Gmail recipients.
Hosting images online
Back to topImages and documents must be hosted online, such as on your website. You can solve this by using the full, absolute link to the location where your image or document is hosted, such as:
<img src="https://www.w3schools.com/images/lamp.jpg">
Google Drive and Dropbox do not work for hosting as they do not support hosting for third-party sites.
Avoiding image-only email
Back to topAvoid sending an email that contains images only. Sending image-only email notifications is a BIG Spam flag, and your email will likely end up in the Junk folder.
Avoiding background images
Back to topMany email clients don't support background images, so your recipient may not see the image.
Using ALT tags
Back to topImages with ALT tags improve SEO and display descriptive text if the browser displays the image.
Please ensure you correctly size the images with the dimensions specified before including them in your email.
If you don't specify the height and width dimensions, some email clients may set their size for your image, which could alter your email design.
Testing your email
Back to topSend tests to the most popular platforms and check out what it looks like for yourself.
Often, emails look fine in Gmail, Yahoo, Hotmail, etc., but they look entirely different in Outlook.
Frequently asked questions
Back to topHow do I prevent email notifications from getting caught in junk folders?
- You may need to add an SPF (Sender Policy Framework) record to your domain host to authorize us to send notifications for you. The SPF authorizes our IP address to send mail from your domain. Please check your domain provider's website for instructions.
I will likely separate the above task once I can plan the articles, as I expect a series of articles for the report.