It's always a good idea to spice up your marketing and transactional emails with a few images. Images can enhance the visual appeal of your email and make it more engaging for the recipient. They can help to capture attention and create a positive first impression.
Including your company logo, product images, or relevant graphics can reinforce your branding and help recipients identify your email as coming from your organization. Personalized images, such as a customer's profile picture, can also create a more personalized and tailored experience.
However, when adding images to emails, it's important to consider the file size to ensure quick loading times and compatibility across various email clients. You should also include alt text for your images to provide a text-based description in case the images don't load properly.
But let's take a look at the 3 most common ways of embedding images in your email messages using Notificare.
Hosted Images
This is, by far, the easiest way to get the job done. Using our email composer you can upload images, and we will host them for you.
There's nothing technical about this method, our drag & drop or WYSIWYG editors provide a graphical interface, we will simply add img elements that link to those hosted images.
<html>
<body>
<img src="https://push.notifica.re/uploads/xxxx" alt="My Logo"/>
</body>
</html>Of course, you can also use our API to upload images and add them to the content of your email messages.
Because we host images for you using a CDN (Content Delivery Network), you can rest assured that we can handle any kind of traffic, in case you decide to target hundreds of thousands of recipients at the same time. This method is also great because it will keep of your emails light. Plus, hosted images can still be changed after you send your email.
One thing to take into account tho. Hosted images might be blocked by default by certain email clients. This is why it is important you never create image-only email messages and that all your images have an alternative text.
Inline Images
This method is not as common as the previous one. In fact, it only offers one advantage over hosted images. With inline images, you do not have to worry about hosting them anywhere. But it will significantly increase the size of your email content, especially if you use more than one image.
Basically, you can only do this in Notificare using your own custom HTML content. You will also need to convert your image into a Base64 encoded string, maybe using a tool like this one.
Then you can add those encoded strings to img elements:
<html>
<body>
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABWAAAABgCAYAAACTz9t6AAAK..." alt="My Logo"/>
</body>
</html>Although this method might be tempting because you do not need to worry about hosting images, it does come with its pitfalls. Most email clients will block these images altogether. At the same time, because the size of the email sent will increase significantly, it will also slow down our system when sending your campaigns.
CID Images
Lastly, we need to mention Content-ID (aka CID). This is something that, if you are familiar with early versions of Outlook, was very common back in the day.
Basically, CID inline images work by attaching the image to the email you send and then using img elements that reference that image to eventually embed it in the email when the user opens it.
To use this method in Notificare, you will need to also use your own custom HTML. You will then upload, choose existing images or use images hosted somewhere else as attachments:
By assigning a name to your image attachments, you can then reference them in your HTML as follows:
<html>
<body>
<img src="cid:myimage" alt="My Logo"/>
</body>
</html>Although this method works pretty well in desktop email clients like Outlook (with this method images do not get blocked) it can be problematic in some web-based clients. It also slightly increases the size of your emails, which will slow down our system too when sending your messages.
Conclusion
Incorporating images in your email communications can greatly enhance the effectiveness and impact of your messages. By leveraging visual appeal, reinforcing branding, and facilitating clear communication, images can capture attention, convey information more effectively, and create a more engaging and personalized experience for your recipients.
Whatever method you choose will have its pros and cons. In Notificare, using our drag & drop editor and hosted images might just be the most convenient way to include images in your email campaigns. But if you're feeling brave and want to give other methods a try, it's always a good idea to proper test your content. In Notificare, this can be done using Email Proofing Reports where you can test your email campaigns in 90+ email clients running on real devices.
As always, if you have any questions, we are available via our Support Channel.