{"id":5207,"date":"2016-10-03T19:27:10","date_gmt":"2016-10-03T13:57:10","guid":{"rendered":"https:\/\/email.uplers.com\/blogs\/?p=5207"},"modified":"2023-03-02T15:26:54","modified_gmt":"2023-03-02T09:56:54","slug":"accordion-in-emails","status":"publish","type":"post","link":"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/","title":{"rendered":"Accordion Effect in Email: Convey more in less space"},"content":{"rendered":"<p>In the world of cut-throat competition, there is a saying that \u2018Time is Money\u2019. The more time devoted is equivalent to more money invested. With an email \u201cscanned\u201d in 11 seconds, it is necessary to deliver the right information to your subscriber in concise time. But no two subscribers on your list may be on the lookout for same information.<br \/>The dilemma between content length and content specifics is eradicated with one of the most innovative interactive element\u2026.<strong> Accordion effect for Emails<\/strong>.<\/p>\n<p><span style=\"font-size: 1.14286rem;\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-5211 size-full\" title=\"Accordion in Email sample\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Email-sample.gif\" alt=\"\" width=\"406\" height=\"554\" \/><\/span><\/p>\n<h3><span style=\"font-size: 1.14286rem;\">How it works<\/span><\/h3>\n<p>With the help of interactive elements in email like Accordion, the content of your email can be categorized into tabs which expands or contracts based on user interaction. This way your email can cater to various information without increasing the overall length of your email. Moreover, the end-user also gets the choice of skip to the information of their interest.<\/p>\n<div class=\"banner_wrapper\" style=\"\"><div class=\"banner  banner-17419 bottom vert custom-banners-theme-default_style\" style=\"\"><a class=\"custom_banners_big_link\"  target=\"_blank\"  href=\"https:\/\/email.uplers.com\/interactive-email-templates\/\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"200\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/07\/rich-media.jpg\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/07\/rich-media.jpg 800w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/07\/rich-media-300x75.jpg 300w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/07\/rich-media-768x192.jpg 768w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/07\/rich-media-624x156.jpg 624w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/a><\/div><\/div>\n<h3>Advantages<\/h3>\n<p><strong>Stack-up your content<\/strong>: With Accordions, emails could stack up\u00a0 the content into smart categories and accommodate a lot of content in a sleek way. By collapsing the information and showing just the titles, almost 600% of vertical space is saved (assuming a paragraph is five lines and a title is one line long).<\/p>\n<p><strong>Copy would not kill the UX<\/strong>: Content-heavy emails are not something your subscribers appreciate. So, if you are an email marketer who needs to share a lot of content in your email; you can actually use Accordion to improve the overall UX and at the same time save user time providing them option to read what they like.<\/p>\n<p><strong>Measure the information consumed<\/strong>: There is no well-defined way to measure how much of your email was read (like Heatmaps for websites). With Accordion, marketers can measure the clicks on the tabs and identify which area of information was of more interest to the subscriber. A well-versed analysis can then help you improve your next <a href=\"https:\/\/email.uplers.com\/infographics\/email-marketing-strategy\/\" target=\"_blank\" rel=\"follow noopener\">email strategy<\/a>.<\/p>\n<h3>Compatibility and Limitations<\/h3>\n<p>The Accordion will work only on mobile <a href=\"https:\/\/email.uplers.com\/infographics\/ultimate-guide-email-client-hacks\/\" target=\"_blank\" rel=\"follow noopener\">email clients<\/a> that support external CSS only. So Windows-based clients, Gmail app and third party apps shall not support it.<br \/>Native Android and iOS email clients shall render Accordion as WYSIWYG (What You See Is What You Get).<\/p>\n<h3>Application<\/h3>\n<ul>\n<li>Retailers as always could show many products with different information clubbed in Accordions.<\/li>\n<li>Media and technology companies can show various information within their emails.<\/li>\n<li>Accordions are sure-fire ways to actually send feedback emails with a\u00a0questionnaire.<\/li>\n<\/ul>\n<h3>Real World Examples<\/h3>\n<p>Email Uplers :<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-16530 size-full\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Emails-EmailMonks-2.gif\" alt=\"\" width=\"159\" height=\"270\" \/><\/p>\n<p><strong>Property Dreams:<\/strong><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-6266 size-full\" title=\"Accordions-Property Dreams\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordions-Property-Dreams.gif\" alt=\"Accordions-Property Dreams\" width=\"320\" height=\"962\" \/><\/p>\n<p><strong>Saks Fifth Avenue:<\/strong><\/p>\n<p><strong style=\"font-size: 1rem;\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-5210 size-full aligncenter\" title=\"Accordion in Email sample\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Email-sample-Saks.jpg\" alt=\"Accordion in Email sample - Saks\" width=\"710\" height=\"682\" srcset=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Email-sample-Saks.jpg 710w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Email-sample-Saks-300x288.jpg 300w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Email-sample-Saks-146x140.jpg 146w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Email-sample-Saks-624x599.jpg 624w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Email-sample-Saks-24x24.jpg 24w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>Nu Yu:<\/strong><\/p>\n<p><span style=\"font-size: 1.14286rem;\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-5215 size-large aligncenter\" title=\"Accordion in Email sample\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Email-example-NU-Yu-137x1024.jpg\" alt=\"Accordion-in-Email-example---NU-Yu\" width=\"137\" height=\"1024\" srcset=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Email-example-NU-Yu-137x1024.jpg 137w, https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Email-example-NU-Yu-40x300.jpg 40w\" sizes=\"auto, (max-width: 137px) 100vw, 137px\" \/> <\/span><\/p>\n<p><span style=\"font-size: 1.14286rem;\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-5216 size-full aligncenter\" title=\"Accordion in Email sample\" src=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Email-sample-NU-Yu.jpg\" alt=\"Accordion-in-Email-sample---NU-Yu\" width=\"108\" height=\"1978\" \/><\/span><\/p>\n<h3><span style=\"font-size: 1.14286rem;\">Few Best Practices<\/span><\/h3>\n<ul>\n<li>Consider finger targets of mobile users while placing the Accordion and content therein.<\/li>\n<li>Don\u2019t overload Accordion with too many categories. It will create a clutter and make it hard to act upon.<\/li>\n<\/ul>\n<p>Interested to receive a sample of Accordion effect in your inbox? <a href=\"https:\/\/email.uplers.com\/contact-us\/\" target=\"_blank\" rel=\"follow noopener\">Contact us now!<\/a><\/p>\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>In the world of cut-throat competition, there is a saying that \u2018Time is Money\u2019. The more time devoted is equivalent to more money invested. With an email \u201cscanned\u201d in 11 seconds, it is necessary to deliver the right information to your subscriber in concise time. But no two subscribers on your list may be on [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":5213,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[381],"tags":[534,218],"class_list":["post-5207","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-email-design","tag-accordion-effect","tag-accordion-in-email"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Accordion in Emails: Convey more in less space<\/title>\n<meta name=\"description\" content=\"Ever needed to convey more but dont wish to increase the email length? Accordion in emails can help you categorize your content for mobile devices.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Accordion in Emails: Convey more in less space\" \/>\n<meta property=\"og:description\" content=\"Ever needed to convey more but dont wish to increase the email length? Accordion in emails can help you categorize your content for mobile devices.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/\" \/>\n<meta property=\"og:site_name\" content=\"Email Uplers\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/email.uplers\/\" \/>\n<meta property=\"article:published_time\" content=\"2016-10-03T13:57:10+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-03-02T09:56:54+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Emails-Large-540x282.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"540\" \/>\n\t<meta property=\"og:image:height\" content=\"282\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Kevin George\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@email_uplers\" \/>\n<meta name=\"twitter:site\" content=\"@email_uplers\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kevin George\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/\",\"url\":\"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/\",\"name\":\"Accordion in Emails: Convey more in less space\",\"isPartOf\":{\"@id\":\"https:\/\/email.uplers.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Emails-Large.jpg\",\"author\":{\"@id\":\"https:\/\/email.uplers.com\/blog\/#\/schema\/person\/7ffa431167e8be5eb07b050cd5c663fa\"},\"description\":\"Ever needed to convey more but dont wish to increase the email length? Accordion in emails can help you categorize your content for mobile devices.\",\"breadcrumb\":{\"@id\":\"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/#primaryimage\",\"url\":\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Emails-Large.jpg\",\"contentUrl\":\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Emails-Large.jpg\",\"width\":\"1170\",\"height\":\"470\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/email.uplers.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Accordion Effect in Email: Convey more in less space\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/email.uplers.com\/blog\/#website\",\"url\":\"https:\/\/email.uplers.com\/blog\/\",\"name\":\"Email Uplers\",\"description\":\"Email Marketing Blog\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/email.uplers.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/email.uplers.com\/blog\/#\/schema\/person\/7ffa431167e8be5eb07b050cd5c663fa\",\"name\":\"Kevin George\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/email.uplers.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/03\/Img-96x96.png\",\"contentUrl\":\"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/03\/Img-96x96.png\",\"caption\":\"Kevin George\"},\"description\":\"Kevin is the Head of Marketing at Email Uplers, one of the fastest-growing full-service email marketing companies. He is an email enthusiast at heart and loves to pen down email marketing content. You can reach him at kevin.g@uplers.com or connect with him on LinkedIn.\",\"sameAs\":[\"https:\/\/www.linkedin.com\/in\/kevin-george-email\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Accordion in Emails: Convey more in less space","description":"Ever needed to convey more but dont wish to increase the email length? Accordion in emails can help you categorize your content for mobile devices.","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:\/\/email.uplers.com\/blog\/accordion-in-emails\/","og_locale":"en_US","og_type":"article","og_title":"Accordion in Emails: Convey more in less space","og_description":"Ever needed to convey more but dont wish to increase the email length? Accordion in emails can help you categorize your content for mobile devices.","og_url":"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/","og_site_name":"Email Uplers","article_publisher":"https:\/\/www.facebook.com\/email.uplers\/","article_published_time":"2016-10-03T13:57:10+00:00","article_modified_time":"2023-03-02T09:56:54+00:00","og_image":[{"width":540,"height":282,"url":"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Emails-Large-540x282.jpg","type":"image\/jpeg"}],"author":"Kevin George","twitter_card":"summary_large_image","twitter_creator":"@email_uplers","twitter_site":"@email_uplers","twitter_misc":{"Written by":"Kevin George","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/","url":"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/","name":"Accordion in Emails: Convey more in less space","isPartOf":{"@id":"https:\/\/email.uplers.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/#primaryimage"},"image":{"@id":"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/#primaryimage"},"thumbnailUrl":"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Emails-Large.jpg","author":{"@id":"https:\/\/email.uplers.com\/blog\/#\/schema\/person\/7ffa431167e8be5eb07b050cd5c663fa"},"description":"Ever needed to convey more but dont wish to increase the email length? Accordion in emails can help you categorize your content for mobile devices.","breadcrumb":{"@id":"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/email.uplers.com\/blog\/accordion-in-emails\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/#primaryimage","url":"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Emails-Large.jpg","contentUrl":"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2016\/10\/Accordion-in-Emails-Large.jpg","width":"1170","height":"470"},{"@type":"BreadcrumbList","@id":"https:\/\/email.uplers.com\/blog\/accordion-in-emails\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/email.uplers.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Accordion Effect in Email: Convey more in less space"}]},{"@type":"WebSite","@id":"https:\/\/email.uplers.com\/blog\/#website","url":"https:\/\/email.uplers.com\/blog\/","name":"Email Uplers","description":"Email Marketing Blog","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/email.uplers.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/email.uplers.com\/blog\/#\/schema\/person\/7ffa431167e8be5eb07b050cd5c663fa","name":"Kevin George","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/email.uplers.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/03\/Img-96x96.png","contentUrl":"https:\/\/email.uplers.com\/blog\/wp-content\/uploads\/2019\/03\/Img-96x96.png","caption":"Kevin George"},"description":"Kevin is the Head of Marketing at Email Uplers, one of the fastest-growing full-service email marketing companies. He is an email enthusiast at heart and loves to pen down email marketing content. You can reach him at kevin.g@uplers.com or connect with him on LinkedIn.","sameAs":["https:\/\/www.linkedin.com\/in\/kevin-george-email\/"]}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/posts\/5207","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/comments?post=5207"}],"version-history":[{"count":19,"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/posts\/5207\/revisions"}],"predecessor-version":[{"id":35263,"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/posts\/5207\/revisions\/35263"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/media\/5213"}],"wp:attachment":[{"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/media?parent=5207"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/categories?post=5207"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/email.uplers.com\/blog\/wp-json\/wp\/v2\/tags?post=5207"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}