{"id":3655,"date":"2016-05-17T12:40:20","date_gmt":"2016-05-17T10:40:20","guid":{"rendered":"https:\/\/blog.bancomail.com\/?p=3655"},"modified":"2025-06-17T15:04:05","modified_gmt":"2025-06-17T15:04:05","slug":"tricks-of-how-to-pre-load-faster-html-emails","status":"publish","type":"post","link":"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/","title":{"rendered":"Tricks on how to pre-load images in HTML Emails"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_76 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\"><\/p>\n<span class=\"ez-toc-title-toggle\"><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#Why_to_optimize_images\" >Why\u00a0to optimize\u00a0images?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#Inside_the_code\" >Inside the code<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#Slice_and_dice_%E2%80%93_still_a_useful_practice\" >Slice and dice &#8211; still a useful practice<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"Why_to_optimize_images\"><\/span>Why\u00a0to optimize\u00a0images?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Converting email readers into customers it largely depends on developing a positive &#8216;customer impression&#8217;, and this is where your newsletter performance come into play.<\/p>\n<p>Quality images and ultra-fast loading speed gives customers a positive psychological impression encouraging sales and their loyalty. This way the \u2018user experience\u2019 in terms of email performance and responsiveness become a fundamental factor impacting conversion rates in web marketing campaigns. A successful newsletter it&#8217;s about delivering the right information, products or services at the right time, thing that is not possible without ultra-fast page load times. On the other hand in a world with an increasing reliance on smartphones and tablets, web marketers and online retailers must understand the need to deliver content efficiently from web servers to the mobile screens, because a successful email marketing campaign depends, among other things, on the ability to embrace a mobile approach in reaching the exploding population of mobile subscribers.<\/p>\n<p>What happens if we don\u2019t consider this things? Your\u00a0subscribers will abandon the reading of your\u00a0newsletter due to slow page speed and, considering the competition, users eventually will read someone else&#8217;s newsletter. So in order to deliver our message quickly to all type of users you\u00a0can make an email to work well across a range of device sizes just like with responsive websites, by using fluid layouts or media queries. However, this doesn\u2019t guarantee that our html email will load fast. We still have to load the same images for pc, tablet and smartphones instead of loading different images with different resolutions in order to make the best use of available bandwidth. So how can we optimize our images for smartphone or tablet devices?<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Inside_the_code\"><\/span>Inside the code<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>In responsive web design we can now display different images for differing circumstances, with the help of &#8216;&lt;picture&gt;&#8217; tag.\u00a0Unfortunately this is not possible in email design which is still an outrageously outdated practice. In the \u2018Post Pc Era\u2019 we still have to build layouts using tables and style them with HTML attributes and inline css styles. However, in email design we can apply the &#8216;flexible image&#8217; technique, it\u2019s about defining a general css rule\u00a0to ensure that\u00a0images never go beyond the width of their parent container.<\/p>\n<pre>img {\r\n max-width: 100%;\r\n height: auto;\r\n}<\/pre>\n<p>But this is not enough! We should try to \u2018prevent\u2019 that our smartphones and tablets users get bored while images are downloading and to close or delete our newsletter.\u00a0So, to do that we will use a very well known trick and css media queries. Using images in email is very similar to using them on the web. We can load images using regular &#8216;&lt;img&gt;&#8217; tags\u00a0or by using css like this:<\/p>\n<pre>td{\r\n background: url(myimage.jpg);\r\n }<\/pre>\n<p>Let&#8217;s now suppose that we have the following situation:<\/p>\n<pre>&lt;td&gt;\r\n&lt;img src=\"awesome_banner.jpg\" alt=\"banner\" style=\"max-width: 100%;\"\/&gt;\r\n&lt;td&gt;<\/pre>\n<p>The image can be downloaded fast enough on a \u2018pc\u2019 but very slowly on a smartphone device. To avoid this, a possible solution is to pre-load a smaller version of the same image in the parent\u2019s background by using css &#8216;background&#8217; property, which will load faster than the original image.<\/p>\n<pre>&lt;td style=\"background:url('small_awesome_banner.jpg') center center no-repeat;\"&gt;\r\n&lt;img src=\"awesome_banner.jpg\" alt=\"banner\" style=\"max-width: 100%;\"\/&gt;\r\n&lt;td&gt;<\/pre>\n<p>And to be sure that our smaller version of the image will be available only for mobile users, we use css media queries:<\/p>\n<pre>\/*SMARTPHONE STYLES*\/\r\n@media only screen and (max-width: 480px) {\r\n#imageHolder{\r\nbackground:url('small_awesome_banner.jpg') center center no-repeat;\r\n}\r\n}<\/pre>\n<pre>&lt;td id=\"imageHolder\"&gt;\r\n&lt;img src=\"awesome_banner.jpg\" alt=\"banner\" style=\"max-width: 100%;\"\/&gt;\r\n&lt;td&gt;<\/pre>\n<p>We can also use URI for the the \u2018background-image\u2019 css property, which is another useful method for reducing HTTP requests. Using URI it saves HTTP Requests, the image is basically, a super long string and the page loads faster, seeing that we don\u2019t have to download anything from the server.<\/p>\n<p>Checkout the \u2018src\u2019 attribute\u00a0of the image below:<\/p>\n<p style=\"text-align: center;\">[uniform-resources-identifier]<\/p>\n<p>An interesting fact is that every image embedded in this manner will evade image blocking in Mozilla Thunderbird. Anyway,\u00a0 you should use URI with caution because some email clients like Google\u2019s Gmail blocks URI resources by cancelling them so we could end with an empty \u2018src\u2019 attribute like this one:<\/p>\n<pre>&lt;img src=\"\" alt=\"my image\" width=\"100%\" \/&gt;<\/pre>\n<p>However, if we load our URI resources in the parent\u2019s background using css syntax like we did before, nothing bad will happen if the email is open in Gmail, since our original image \u2018awesome_banner.jpg\u2019 will continue to be downloaded normally .<\/p>\n<p>This tricks are very useful when we have to deal with animated gif images in our newsletters. We could preload a smaller jpg version of the animation, usually a screenshot of the first frame in the animation timeline, which will be quickly loaded for the user, avoiding this way to present empty spaces while the animated gif is loading.<\/p>\n<p>[esempio-animazione]<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Slice_and_dice_%E2%80%93_still_a_useful_practice\"><\/span><strong>Slice and dice &#8211; still a useful practice<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Last but not least we should remember the old practice of slicing. The slicing method it&#8217;s an obsolete web design tehnique, but may be still usefull in html email design. Here is how it works: to avoid long time loading of an image we cut the image into smaller sections, with the help of Photoshop or other tool. Then we reassemble the whole image in our html page. The point is that by breaking the image into smaller pieces, this pieces will begin to load quickly, reducing &#8220;page weight&#8221; or load time considerably.<\/p>\n<p>By using this tricks we don&#8217;t perform a \u2018real optimization\u2019, instead we are trying to solve a common problem: it\u2019s well known that visitors would rather spend excessive time browsing for the information elsewhere than waiting a few seconds for the right website to load. This is valid for html emails too!\u00a0So, serving our images as quickly as possible will enhance customers satisfaction, retention and loyalty, reducing email unsubscribe rates due to slow internet connection.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Why\u00a0to optimize\u00a0images? Converting email readers into customers it largely depends on developing a positive &#8216;customer impression&#8217;, and this is where your newsletter performance come into play. Quality images and ultra-fast loading speed gives customers a positive psychological impression encouraging sales and their loyalty. This way the \u2018user experience\u2019 in terms of email performance and responsiveness&#8230;<\/p>\n","protected":false},"author":20,"featured_media":36149,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[896],"tags":[888,921,991,993,989,985,987],"post_template":[],"top_category":[],"class_list":["post-3655","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-email-design-code","tag-design-en","tag-email-en","tag-html-en","tag-optimization-en","tag-pre-load-images","tag-responsive","tag-uri"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Tricks on how to pre-load images in HTML Emails - Bancomail Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/\" \/>\n<meta property=\"og:locale\" content=\"it_IT\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Tricks on how to pre-load images in HTML Emails - Bancomail Blog\" \/>\n<meta property=\"og:description\" content=\"Why\u00a0to optimize\u00a0images? Converting email readers into customers it largely depends on developing a positive &#8216;customer impression&#8217;, and this is where your newsletter performance come into play. Quality images and ultra-fast loading speed gives customers a positive psychological impression encouraging sales and their loyalty. This way the \u2018user experience\u2019 in terms of email performance and responsiveness...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/\" \/>\n<meta property=\"og:site_name\" content=\"Bancomail Blog\" \/>\n<meta property=\"article:published_time\" content=\"2016-05-17T10:40:20+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-06-17T15:04:05+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2016\/05\/how-to-preload-images-in-html-emails-1024x683.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1024\" \/>\n\t<meta property=\"og:image:height\" content=\"683\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Cosmin Horvath\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Cosmin Horvath\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minuti\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/\"},\"author\":{\"name\":\"Cosmin Horvath\",\"@id\":\"https:\/\/www.bancomail.com\/blog\/#\/schema\/person\/5c0a66453a5a3babc52b0527c313ec3b\"},\"headline\":\"Tricks on how to pre-load images in HTML Emails\",\"datePublished\":\"2016-05-17T10:40:20+00:00\",\"dateModified\":\"2025-06-17T15:04:05+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/\"},\"wordCount\":939,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.bancomail.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2016\/05\/how-to-preload-images-in-html-emails.png\",\"keywords\":[\"design\",\"email\",\"html\",\"optimization\",\"pre load images\",\"responsive\",\"uri\"],\"articleSection\":[\"Email Design and Code\"],\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/\",\"url\":\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/\",\"name\":\"Tricks on how to pre-load images in HTML Emails - Bancomail Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.bancomail.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2016\/05\/how-to-preload-images-in-html-emails.png\",\"datePublished\":\"2016-05-17T10:40:20+00:00\",\"dateModified\":\"2025-06-17T15:04:05+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#breadcrumb\"},\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#primaryimage\",\"url\":\"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2016\/05\/how-to-preload-images-in-html-emails.png\",\"contentUrl\":\"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2016\/05\/how-to-preload-images-in-html-emails.png\",\"width\":1536,\"height\":1024},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.bancomail.com\/blog\/en\/homepage-en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Tricks on how to pre-load images in HTML Emails\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.bancomail.com\/blog\/#website\",\"url\":\"https:\/\/www.bancomail.com\/blog\/\",\"name\":\"Bancomail Blog\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/www.bancomail.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.bancomail.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"it-IT\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.bancomail.com\/blog\/#organization\",\"name\":\"Bancomail Blog\",\"url\":\"https:\/\/www.bancomail.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\/\/www.bancomail.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2025\/06\/bancomail-logo-q400.png\",\"contentUrl\":\"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2025\/06\/bancomail-logo-q400.png\",\"width\":400,\"height\":400,\"caption\":\"Bancomail Blog\"},\"image\":{\"@id\":\"https:\/\/www.bancomail.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.linkedin.com\/company\/bancomail\/?viewAsMember=true\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.bancomail.com\/blog\/#\/schema\/person\/5c0a66453a5a3babc52b0527c313ec3b\",\"name\":\"Cosmin Horvath\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\/\/www.bancomail.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2016\/05\/cosmin-300x300.jpg\",\"contentUrl\":\"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2016\/05\/cosmin-300x300.jpg\",\"caption\":\"Cosmin Horvath\"},\"description\":\"Front-end alchemist who combines humanist knowleadge with IT skills to design reactive and surprising experiences.\",\"url\":\"https:\/\/www.bancomail.com\/blog\/author\/cosmin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Tricks on how to pre-load images in HTML Emails - Bancomail Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/","og_locale":"it_IT","og_type":"article","og_title":"Tricks on how to pre-load images in HTML Emails - Bancomail Blog","og_description":"Why\u00a0to optimize\u00a0images? Converting email readers into customers it largely depends on developing a positive &#8216;customer impression&#8217;, and this is where your newsletter performance come into play. Quality images and ultra-fast loading speed gives customers a positive psychological impression encouraging sales and their loyalty. This way the \u2018user experience\u2019 in terms of email performance and responsiveness...","og_url":"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/","og_site_name":"Bancomail Blog","article_published_time":"2016-05-17T10:40:20+00:00","article_modified_time":"2025-06-17T15:04:05+00:00","og_image":[{"width":1024,"height":683,"url":"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2016\/05\/how-to-preload-images-in-html-emails-1024x683.png","type":"image\/png"}],"author":"Cosmin Horvath","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Cosmin Horvath","Est. reading time":"5 minuti"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#article","isPartOf":{"@id":"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/"},"author":{"name":"Cosmin Horvath","@id":"https:\/\/www.bancomail.com\/blog\/#\/schema\/person\/5c0a66453a5a3babc52b0527c313ec3b"},"headline":"Tricks on how to pre-load images in HTML Emails","datePublished":"2016-05-17T10:40:20+00:00","dateModified":"2025-06-17T15:04:05+00:00","mainEntityOfPage":{"@id":"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/"},"wordCount":939,"commentCount":0,"publisher":{"@id":"https:\/\/www.bancomail.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#primaryimage"},"thumbnailUrl":"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2016\/05\/how-to-preload-images-in-html-emails.png","keywords":["design","email","html","optimization","pre load images","responsive","uri"],"articleSection":["Email Design and Code"],"inLanguage":"it-IT","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/","url":"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/","name":"Tricks on how to pre-load images in HTML Emails - Bancomail Blog","isPartOf":{"@id":"https:\/\/www.bancomail.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#primaryimage"},"image":{"@id":"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#primaryimage"},"thumbnailUrl":"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2016\/05\/how-to-preload-images-in-html-emails.png","datePublished":"2016-05-17T10:40:20+00:00","dateModified":"2025-06-17T15:04:05+00:00","breadcrumb":{"@id":"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#breadcrumb"},"inLanguage":"it-IT","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/"]}]},{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#primaryimage","url":"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2016\/05\/how-to-preload-images-in-html-emails.png","contentUrl":"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2016\/05\/how-to-preload-images-in-html-emails.png","width":1536,"height":1024},{"@type":"BreadcrumbList","@id":"https:\/\/www.bancomail.com\/blog\/en\/tricks-of-how-to-pre-load-faster-html-emails\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.bancomail.com\/blog\/en\/homepage-en\/"},{"@type":"ListItem","position":2,"name":"Tricks on how to pre-load images in HTML Emails"}]},{"@type":"WebSite","@id":"https:\/\/www.bancomail.com\/blog\/#website","url":"https:\/\/www.bancomail.com\/blog\/","name":"Bancomail Blog","description":"","publisher":{"@id":"https:\/\/www.bancomail.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.bancomail.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"it-IT"},{"@type":"Organization","@id":"https:\/\/www.bancomail.com\/blog\/#organization","name":"Bancomail Blog","url":"https:\/\/www.bancomail.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/www.bancomail.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2025\/06\/bancomail-logo-q400.png","contentUrl":"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2025\/06\/bancomail-logo-q400.png","width":400,"height":400,"caption":"Bancomail Blog"},"image":{"@id":"https:\/\/www.bancomail.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.linkedin.com\/company\/bancomail\/?viewAsMember=true"]},{"@type":"Person","@id":"https:\/\/www.bancomail.com\/blog\/#\/schema\/person\/5c0a66453a5a3babc52b0527c313ec3b","name":"Cosmin Horvath","image":{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/www.bancomail.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2016\/05\/cosmin-300x300.jpg","contentUrl":"https:\/\/www.bancomail.com\/blog\/wp-content\/uploads\/2016\/05\/cosmin-300x300.jpg","caption":"Cosmin Horvath"},"description":"Front-end alchemist who combines humanist knowleadge with IT skills to design reactive and surprising experiences.","url":"https:\/\/www.bancomail.com\/blog\/author\/cosmin\/"}]}},"_links":{"self":[{"href":"https:\/\/www.bancomail.com\/blog\/wp-json\/wp\/v2\/posts\/3655","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.bancomail.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.bancomail.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.bancomail.com\/blog\/wp-json\/wp\/v2\/users\/20"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bancomail.com\/blog\/wp-json\/wp\/v2\/comments?post=3655"}],"version-history":[{"count":27,"href":"https:\/\/www.bancomail.com\/blog\/wp-json\/wp\/v2\/posts\/3655\/revisions"}],"predecessor-version":[{"id":3697,"href":"https:\/\/www.bancomail.com\/blog\/wp-json\/wp\/v2\/posts\/3655\/revisions\/3697"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.bancomail.com\/blog\/wp-json\/wp\/v2\/media\/36149"}],"wp:attachment":[{"href":"https:\/\/www.bancomail.com\/blog\/wp-json\/wp\/v2\/media?parent=3655"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.bancomail.com\/blog\/wp-json\/wp\/v2\/categories?post=3655"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.bancomail.com\/blog\/wp-json\/wp\/v2\/tags?post=3655"},{"taxonomy":"post_template","embeddable":true,"href":"https:\/\/www.bancomail.com\/blog\/wp-json\/wp\/v2\/post_template?post=3655"},{"taxonomy":"top_category","embeddable":true,"href":"https:\/\/www.bancomail.com\/blog\/wp-json\/wp\/v2\/top_category?post=3655"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}