{
  "Status": true,
  "Message": "",
  "Response": {
    "post": {
      "postuid": "2rbcghfozs",
      "tenantuid": "d8b744fc-2e70-4089-bb80-dd1d08f6c7b2",
      "projectuid": "239698c5-f7eb-4574-8cc8-c6568f08b3a0",
      "title": "Email Designer Advanced Topics",
      "slug": "article/2rbcghfozs-email-designer-best-practices",
      "html": "\u003Cp\u003EBelow are some advanced topics related to the Email Designer.\u003C/p\u003E\u003Ch3\u003EImage best practices\u003C/h3\u003E\u003Cp\u003EIt\u0026#39;s important to use images in your email, but too many images can flag your email as potential spam. And, images should be resized for optimal display in the email.\u003C/p\u003E\u003Cp\u003EThe best-practice dimension of an email is 640 px wide. If your image is wider than 640 px it means the image will have to be resized to fit in the email and the image file size is likely bigger (and will take longer to download).\u003C/p\u003E\u003Cul\u003E\u003Cli\u003ETry to strike a balance between images and text content.\u003C/li\u003E\u003Cli\u003EAdd images to email containers so the container automatically adjusts the image size.\u003C/li\u003E\u003Cli\u003EBe sure the image width is set to 100% when used in a container. This will enable the image to automatically scale on smaller devices.\u003C/li\u003E\u003C/ul\u003E\u003Ch4\u003EUse scalable images\u003C/h4\u003E\u003Cp\u003EBy default any image added to your email through the designer will have a width of 100%. This will allow the image to resize itself automatically on smaller screens.\u003C/p\u003E\u003Cp\u003EHowever, it is possible to set the height/width to different percentages as well as fixed height/width where a specific height, e.g. 300px, is specified.\u003C/p\u003E\u003Cp\u003ESetting fixed width/height for an image should only be done for images that are not meant to scale. Furthermore, a best practice is to only use an image already at the correct size.\u003C/p\u003E\u003Ccite class=\u0022warning\u0022\u003E\u003Cspan class=\u0022title\u0022\u003E\u003Ci class=\u0022fa-duotone fa-circle-exclamation\u0022 aria-hidden=\u0022true\u0022\u003E\u003C/i\u003EWarning\u003C/span\u003E\u003Cp\u003E\u003Cstrong\u003EImportant:\u003C/strong\u003E Incorrectly setting an image to a fixed height/width will cause the image to display incorrectly on mobile devices.\u003C/p\u003E\u003C/cite\u003E\u003Ch3\u003EBuilding mobile friendly (responsive) emails\u003C/h3\u003E\u003Cp\u003EThe majority of your email will be read on mobile devices. And, it is important to optimize the email for mobile devices.\u003C/p\u003E\u003Cp\u003EFirst, ensure that for any fixed width tables, there is a CSS media query for your email so that the tables can be set to 100% width. While this won\u0026#39;t help for Microsoft Outlook clients, your iOS and Android mobile users will be appreciative.\u003C/p\u003E\u003Ch3\u003EEditing HTML in the designer\u003C/h3\u003E\u003Cp\u003EWhile typically not recommended, it is possible to \u003Ca href=\u0022/article/zuqmsg00xh-editing-html-in-the-email-designer\u0022\u003Eadd/edit HTML directly in the designer\u003C/a\u003E using a Text / HTML block.\u003C/p\u003E\u003Ch3\u003EAdding whitespace between widgets in your email\u003C/h3\u003E\u003Cp\u003EWhitespace is important to use in any design, but especially emails where you want to use whitespace to increase readability.\u003C/p\u003E\u003Cp\u003EFor example, if you have a set of buttons that are stacked, you had change the top and bottom padding of those buttons to create whitespace:\u003C/p\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://graffiti-auf7e6dwhxhcbwek.z03.azurefd.net/d8b744fc-2e70-4089-bb80-dd1d08f6c7b2/239698c5-f7eb-4574-8cc8-c6568f08b3a0/a9031cf926c6d30ef52423262b936637.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E",
      "publish_status": 0,
      "post_type": "Article",
      "featured_image_updating": false,
      "meta_description": "Below are some advanced topics related to the Email Designer. Image best practices It\u0026#39;s important to use images in your email, but too many images can flag your email as potential spam. And, images should be resized for optimal display in the email. The best-practice dimension of an email is 640 px wide. If your image is wider than 640 px it means the image will have to be resized to fit in the email and the image file size is likely bigger (and will take longer to download). Try to stri ...",
      "display_toc": true,
      "has_workingcopy": false,
      "allow_indexing": true,
      "sort_order": 7,
      "total_views": 661,
      "date_published": "2022-04-19T11:58:18",
      "date_updated": "2025-05-16T19:16:12.473",
      "date_created": "2025-04-24T15:02:29.937"
    }
  }
}