Best way to include images in HTML email?

Jon Cox picture Jon Cox · Jan 29, 2013 · Viewed 12.1k times · Source

I'm creating some HTML emails with images included. For each email the size of the images + email is less than 150kb.

I'm trying to make them work well for the main clients mentioned here http://www.campaignmonitor.com/resources/will-it-work/email-clients/


As far as I can tell there are two main ways of including images with the email:

  • Embedding the images directly.

    • Pros: Images load as soon as email is opened (in most clients).
    • Cons: Does not seem to work well on mobile browsers.


  • Hosting them yourself and just using links to them in the email
    • Pros: Seems to have better compatibility.
    • Cons: Receiver always has to click 'Display all images' button/link, added complexity of maintaining the images on a server.


It seems to me that embedding the images would be the best solution, as it means users will see them straight away after opening the email. Is this correct or would you suggest another way?

Thank you very much for your help :-)

Answer

John picture John · Jan 29, 2013

There is no embedding of images where images will auto load. 'Display Images' will always be an option for recipient where there are images.

I assume embedding is to attach the image and then load it into the body, as would happen via pasting an image into Outlook. This method makes larger file sizes in the inbox, and looks messy with all the images as attachments.

By linking to a hosted image, whether you host it yourself or automatically with the Email Service Provider (Campaign Monitor or Mailchimp for example) you don't need to worry about that. That is the industry standard way of sending commercial emails.

Go with an ESP and let them host your images.