Outlook is notorious for its HTML rendering. The system is relatively hostile to the coding, which is why “Send HTML email Outlook” is a common search query. Given the variety of versions, how can you do it properly? Marketers adapt their messages to Outlook. This system is used by millions. You can be sure a share of your audience reads messages on Windows. Mail recipients are annoyed by broken links and missing images. These may trigger a flow of unsubscriptions. What started as a thoughtful marketing campaign may cause your audience to shrink. Plain text will not receive much attention. This is why professionals use HTML in Outlook. Colorful messages in HTML are now the marketing standard. If you have a template ready, it is easy to insert HTML into Outlook.
How to Put HTML in Email via Templates
The following sequence will help you insert HTML into Outlook 2016 and other versions. With a template, the process is quick and straightforward.
- Open MS Outlook and go to the “Home” tab.
- Click on “New Email” to create a new email message or use a Ctrl+N shortcut.
- In the new email window, click on the “Insert” tab.
- Within the “Insert” tab, click on “Attach File” or “Attach Item” (depending on your version of Outlook).
- Locate and select the HTML file you want to insert into the email. Click “Insert” to attach the file.
- Once the HTML file is attached, it will appear as an attachment at the bottom of the email.
- Right-click on the attached HTML file and select “Save As” to save the file to a location on your computer.
- Open the saved HTML file in a text editor or HTML editor.
- Customize the HTML template according to your needs, adding images, text, and formatting as desired.
- Once the HTML template is ready, select and copy all the HTML code.
- Go back to the email message in Outlook and click on the “Insert” tab.
- Within the “Insert” tab, click on “Signature” and then select “Signatures” from the drop-down menu.
- In the “Signatures and Stationery” window, click on the “New” button to create a new email signature.
- Give the new signature a name, and then paste the copied HTML code into the “Edit signature” box.
- Click “OK” to save the new signature.
- Close the “Signatures and Stationery” window.
- To use the HTML template in a new email, click on the “New Email” button, and your signature with the HTML template will be automatically inserted into the message.
- You can further customize the email if needed, add recipients, and send the email as usual.
Note: The steps provided might vary slightly depending on the version of MS Outlook you are using.
The attachment option may also be added to your Quick Access Toolbar. To do this, access options through “File“. You will see “Quick Access Toolbar” on the list on the left. Choose “Attach File“. This allows you to embed HTML in Outlook quickly.
Important Tips for HTML in Outlook
So, how can you make sure your message is not distorted? Here are a few tips from experts. These will prevent the most common problems like broken links and formatting disasters. Create HTML email in Outlook with these factors in mind.
1. Use Alt Text for Every Image
The mail client may block images. A possible solution is the addition of alt text. This is a simple word or phrase describing the image. If it is missing, the recipient can still read the description in the box and unblock it.
<img class=”vodafone-logo logo” alt=”Dashboard” src=”vf-logo-white.png” width=”40″ height=”40″>2. Make Sure Fonts Are Right
One major downside is that MS Outlook recognizes a limited range of fonts. Anything unfamiliar is automatically converted to Times New Roman, which may look awful. To be safe, use standard options like Courier, Arial, Veranda, or Georgia.
But what is your font that is part of the brand image? In this case, force the system to use an acceptable standard font instead of Times New Roman. This will serve as your fallback.
3. Tables Are Handy
This format helps to structure your message template. You can easily split content, choose backgrounds, style text, etc. Use tables to ensure all recipients see the same rendition regardless of their mail system. Remember to add align=”left” to make the message responsive. This way, boxes will be displayed conveniently on both wide and small screens. In the first case, they will be aligned next to one another. In the second case, they will be placed on top of each other.
4. Not Too Wide!
A rule of thumb is to stick to 550-600 pixels. This is because wider emails may be displayed incorrectly. Keep your messages narrow, so they can be viewed on any screen. There will still be enough space for an eye-catching design.
Testing is Crucial
Knowing how to send HTML email in Outlook is important. Do not forget to test your work before sending it. Check how it looks on every platform. This stage is worth your time, as it guarantees the right look.
More Knowledge Base articles
Thanks, Alex,
I found some email content format got something wrong, such as font type is not correctly, but I don’t know what happen to it? For example, I found it’s original code by email, when I remove some tag, the font will change normal. But I don’t know why suddenly added these tags?