Images are a powerful tool in your emails. However, they are widely misused. You should not use images for displaying text, buttons, or anything else that has a native equivalent. This leads to bloated emails, invisible content, and accessibility issues. Each image translates to a
<img /> tag in HTML.
<img src="http://example.com/my-image.jpg" alt="my image" width="100" />
Inferring the width
HEML lets you infer the width from the image file. If you don't want to set the width value manually,
infer will set it for you.
<img src="http://example.com/my-image.jpg" alt="my image" infer />
If you are using a retina sized image you can set
infer=retina which will set the width to half of what the image file width actually is.
<img src="http://example.com/my-image.jpg" alt="my image" infer="retina" />
This element supports the global attributes.
|src url||Sets the image source. This is required.|
|alt string||Sets the image description. Defaults to
|width pixels||Sets the exact width of the image.|
|height pixels||Sets the exact height of the image.|
|infer string/boolean||This should be used instead of the width and height. If present, the image width will be set to the exact width of the actual image. If set to
|srcset list||Directly passes through to the image. See the Mozilla docs for more.|
All styles given directly apply to the HTML