[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"detail-sidebar-cat-1-en-105":3,"doc-seo-238892-105":53,"doc-detail-238892-en":126},{"code":4,"msg":5,"data":6},0,"success",[7,14,19,24,29,34,39,44,49],{"id":8,"doc_module":9,"doc_module_name":10,"category_name":11,"show_sort_weight":12,"slug":13},11,1,"Template","Presentations",90,"presentations",{"id":15,"doc_module":9,"doc_module_name":10,"category_name":16,"show_sort_weight":17,"slug":18},12,"Resumes",80,"resumes",{"id":20,"doc_module":9,"doc_module_name":10,"category_name":21,"show_sort_weight":22,"slug":23},14,"Invoices",70,"invoices",{"id":25,"doc_module":9,"doc_module_name":10,"category_name":26,"show_sort_weight":27,"slug":28},15,"Posters",60,"posters",{"id":30,"doc_module":9,"doc_module_name":10,"category_name":31,"show_sort_weight":32,"slug":33},16,"Social Media",50,"social-media",{"id":35,"doc_module":9,"doc_module_name":10,"category_name":36,"show_sort_weight":37,"slug":38},17,"Forms",40,"forms",{"id":40,"doc_module":9,"doc_module_name":10,"category_name":41,"show_sort_weight":42,"slug":43},18,"Letters",30,"letters",{"id":45,"doc_module":9,"doc_module_name":10,"category_name":46,"show_sort_weight":47,"slug":48},21,"Paper Templates",5,"papers-templates",{"id":50,"doc_module":9,"doc_module_name":10,"category_name":51,"show_sort_weight":4,"slug":52},158,"General","general-158",{"code":4,"msg":54,"data":55},"ok",{"site_id":56,"language":57,"slug":58,"title":59,"keywords":60,"description":61,"schema_data":62,"social_meta":119,"head_meta":121,"extra_data":123,"updated_unix":125},105,"en","the-better-email-on-design-a-practical-introduction-to-html-email-design-and-development","The Better Email - On Design - A practical introduction to HTML email design and development","","Practical guidance for building HTML-based email designs that work across inconsistent email clients. Covers core fundamentals—basic email structure, development tools, reusable building blocks, and typography—then extends to layout strategies, images, and mobile considerations. Explores responsive email design and multiple implementation workflows, including animation, effects, and interactivity. Includes troubleshooting approaches, best-practice critique, and resource guidance to help designers iterate effectively.",{"@graph":63,"@context":118},[64,80,101],{"@type":65,"itemListElement":66},"BreadcrumbList",[67,71,74,77],{"item":68,"name":69,"@type":70,"position":9},"https://docshare.wps.com","Home","ListItem",{"item":72,"name":10,"@type":70,"position":73},"https://docshare.wps.com/template/",2,{"item":75,"name":11,"@type":70,"position":76},"https://docshare.wps.com/template/presentations/",3,{"item":78,"name":59,"@type":70,"position":79},"https://docshare.wps.com/template/the-better-email-on-design-a-practical-introduction-to-html-email-design-and-development/238892/",4,{"url":78,"name":59,"@type":81,"image":82,"author":87,"headline":59,"publisher":90,"fileFormat":93,"inLanguage":57,"description":61,"dateModified":94,"datePublished":95,"encodingFormat":93,"isAccessibleForFree":96,"interactionStatistic":97},"DigitalDocument",{"url":83,"@type":84,"width":85,"height":86},"https://docshare.wps.com/thumbnails/the-better-email-on-design-a-practical-introduction-to-html-email-design-and-development/238892.png","ImageObject",442,249,{"name":88,"@type":89},"Maya Linwood","Person",{"url":68,"name":91,"@type":92},"DocShare","Organization","application/pdf","2026-11-01","2026-09-11",true,{"@type":98,"interactionType":99,"userInteractionCount":15},"InteractionCounter",{"@type":100},"ViewAction",{"@type":102,"mainEntity":103},"FAQPage",[104,110,114],{"name":105,"@type":106,"acceptedAnswer":107},"What does the book focus on?","Question",{"text":108,"@type":109},"It focuses on practical HTML email design and development, emphasizing techniques that remain reliable across real-world email clients.","Answer",{"name":111,"@type":106,"acceptedAnswer":112},"Why is email considered challenging compared with other web development?",{"text":113,"@type":109},"Email code can be hard to implement due to inconsistent client rendering, limited standard support for HTML/CSS, and many different email clients.",{"name":115,"@type":106,"acceptedAnswer":116},"How does the book handle responsive and mobile email?",{"text":117,"@type":109},"It explains understanding mobile behavior and responsive email design approaches, along with alternative layout strategies and development workflows.","https://schema.org",{"og:url":78,"og:type":120,"og:title":59,"og:site_name":91,"og:description":61},"article",{"robots":122,"canonical":78},"index,follow",{"doc_id":124,"site_id":56},238892,1791741197,{"code":4,"msg":5,"data":127},{"doc_id":124,"user_id":128,"nickname":88,"user_avatar":129,"doc_module":9,"category_id":8,"category_name":11,"doc_title":59,"doc_description":61,"doc_content":130,"file_id":131,"file_url":132,"file_type":133,"file_size":134,"view_count":15,"is_deleted":4,"is_public":9,"is_downloadable":9,"audit_status":9,"page_count":135,"language":136,"language_code":57,"site_id":56,"html_lang":57,"table_of_contents":137,"faqs":138,"seo_title":139,"seo_description":61,"update_tm":140,"read_time":141},962084928432,"https://ap-avatar.wpscdn.com/davatar_155a257f0dc6eb9ab79c44ca47cae57d","The Better Email: On Design  \nA practical introduction to HTML email design and development.  \nCopyright © 2022 Jason Rodriguez.  \nAll rights reserved. No part of this publication may be reproduced or distributed in any form or by any means, or stored in a database or retrieval system, without the prior written permission of the author.  \nFor licensing information for teams or organizations, please contact the author at [jason@thebetter.email](jason@thebetter.email).  \nTo learn more about email marketing, visit [thebetter.email](thebetter.email) online.  \nTable of Contents  \nA Note on Sanity ................................................................................1  \nA Note on Resources .........................................................................2  \nWhy email?..........................................................................................3  \nBasic Email .........................................................................................7  \nDevelopment Tools ............................................................................7  \nThe Building Blocks of Email ..........................................................13  \nTypography in Email ........................................................................49  \nTaking People Places .......................................................................75  \nImages in Email ................................................................................92  \nUnderstanding Mobile ..................................................................113  \nResponsive Email Design ............................................................. 120  \nDifferent Layout Approaches ....................................................... 135  \nAnimation, Effects, and Interactivity ............................................150  \nDifferent Development Workflows ..............................................181  \nTroubleshooting Emails ................................................................198  \nQuestioning Best Practices...........................................................218  \nAbout the Author...........................................................................221  \nNot sure why this broke Basic Email Development Tools into two lines here. Tried everything to fix it but ¯\\_ (ツ)_/¯  \nA Note on Sanity  \nIf you’ve spent any time around web designers, you know they’re largely a crazy bunch. Dealing with browser inconsistencies and keeping abreast of new developments in technology will do that to people. Email designers are no different. If anything, they’re likely crazier. Blame it on Outlook and Lotus Notes.  \nThis is just a note to say it’s OK to feel frustrated and crazy when designing email. It’s a hard racket—accompanied by little praise from others in the web industry (let alone most stakeholders and upper management) .  \nDon’t let it get to you. Email design can be amazingly powerful and you should feel proud to be part of a vibrant and growing community.  \nOn a related note, you shouldn’t get down when things break. And you shouldn’t strive for pixel perfection in every email client. It’s a ghost. It simply doesn’t exist.  \nThe beauty of email lies in the fact that most people forget about a campaign immediately after hitting delete. That sucks for posterity, but is fantastic since you can always send another email and fix whatever went wrong in the last campaign. It’s a beautifully iterative medium.  \nA Note on Resources  \nI’ve tried to make the code examples in this book as easy to understand as possible. Unfortunately, email code can sometimes still get unwieldy. For more complex examples or longer bits of code, I’ve included links to examples on CodePen, which will allow you to explore, update, and experiment with the code in real-time in your browser.  \nIf you notice anything wrong in the examples, please don’t hesitate to email me at [jason.rodriguez@thebetter.email](jason.rodriguez@thebetter.email).  \nI also maintain a r","cbCaiosdYGe853Gg","https://ap.wps.com/l/cbCaiosdYGe853Gg","pdf",11225345,225,"English","# A Note on Sanity\n# A Note on Resources\n# Why email?\n# Basic Email\n## Development Tools\n## The Building Blocks of Email\n## Typography in Email\n# Taking People Places\n# Images in Email\n# Understanding Mobile\n## Responsive Email Design\n# Different Layout Approaches\n# Animation, Effects, and Interactivity\n# Different Development Workflows\n# Troubleshooting Emails\n# Questioning Best Practices\n# About the Author","[{\"question\":\"What does the book focus on?\",\"answer\":\"It focuses on practical HTML email design and development, emphasizing techniques that remain reliable across real-world email clients.\"},{\"question\":\"Why is email considered challenging compared with other web development?\",\"answer\":\"Email code can be hard to implement due to inconsistent client rendering, limited standard support for HTML/CSS, and many different email clients.\"},{\"question\":\"How does the book handle responsive and mobile email?\",\"answer\":\"It explains understanding mobile behavior and responsive email design approaches, along with alternative layout strategies and development workflows.\"}]","The Better Email - On Design - A practical introduction to HTML email design and development | PDF",1789140722,79]