--- title: "Server Side Guy Preview: Best Practices for Responsive HTML Emails" description: This Server Side Guy preview runs through the best practices for responsive HTML emails, including tips for accessible mobile design. image: https://go.fjorge.com/hubfs/Responsive%20HTML%20Emails.jpg --- [![Fjorge Digital](https://go.fjorge.com/hs-fs/hub/470506/file-2409773430.png)](http://fjorgedigital.com/) - [![LinkedIn](https://go.fjorge.com/hs-fs/file-2407883531-png/images/linkedinWhite.png)](https://www.linkedin.com/company/fjorge?__hstc=69507087.5dbeaf4d8d1a6d903f9ac7634b1bae3f.1422436931031.1422436931031.1422440381257.2&__hssc=69507087.1.1422440381257&__hsfp=1494918045) - [![Facebook](https://go.fjorge.com/hs-fs/file-2409753260-png/images/facebookWhite.png)](https://www.facebook.com/fjorgedigital?__hstc=69507087.5dbeaf4d8d1a6d903f9ac7634b1bae3f.1422436931031.1422436931031.1422440381257.2&__hssc=69507087.1.1422440381257&__hsfp=1494918045) - [![Twitter](https://go.fjorge.com/hs-fs/file-2409753285-png/images/twitterWhite.png)](https://twitter.com/fjorgedigital?__hstc=69507087.5dbeaf4d8d1a6d903f9ac7634b1bae3f.1422436931031.1422436931031.1422440381257.2&__hssc=69507087.1.1422440381257&__hsfp=1494918045) - [Home](http://fjorgedigital.com/) - [Process](http://fjorgedigital.com/process/) - [Work](http://fjorgedigital.com/work/) - [About](http://fjorgedigital.com/about/) - [Blog](http://blog.fjorgedigital.com/) - [Contact](http://fjorgedigital.com/contact/) - [![LinkedIn](https://go.fjorge.com/hs-fs/file-2407883531-png/images/linkedinWhite.png)](https://www.linkedin.com/company/fjorge?__hstc=69507087.5dbeaf4d8d1a6d903f9ac7634b1bae3f.1422436931031.1422436931031.1422440381257.2&__hssc=69507087.1.1422440381257&__hsfp=1494918045) - [![Facebook](https://go.fjorge.com/hs-fs/file-2409753260-png/images/facebookWhite.png)](https://www.facebook.com/fjorgedigital?__hstc=69507087.5dbeaf4d8d1a6d903f9ac7634b1bae3f.1422436931031.1422436931031.1422440381257.2&__hssc=69507087.1.1422440381257&__hsfp=1494918045) - [![Twitter](https://go.fjorge.com/hs-fs/file-2409753285-png/images/twitterWhite.png)](https://twitter.com/fjorgedigital?__hstc=69507087.5dbeaf4d8d1a6d903f9ac7634b1bae3f.1422436931031.1422436931031.1422440381257.2&__hssc=69507087.1.1422440381257&__hsfp=1494918045) [The fjblog](https://go.fjorge.com) # [Server Side Guy Preview: Best Practices for Responsive HTML Emails](https://go.fjorge.com/server-side-guy-preview-best-practices-for-responsive-html-emails) Posted by [Caleb Szydlo](https://go.fjorge.com/author/caleb-szydlo) on Thu, Oct 26, 2017 3:58 PM So you’re thinking of coding a responsive email? Good for you, fortune favors the bold! Before you start though, let’s take a moment to investigate the do’s and don’t’s of responsive email. Take a look below to see best practices for designing on of these beasts as well as device support. Most importantly however, manage expectations. Much like Brendan Fraser in *Blast From The Past* or *Encino Man*, HTML emails are a little behind the times. That being said, the support for responsive emails is limited.   ### **Designing for mobile, best practices** **Don't add, just subtract:**  Because support for the media-queries we use to hide images and elements are not supported by all devices/clients, mobile-only images will show up all the time in some cases. Therefore we cannot add any new content at mobile. **Larger buttons and calls to action:**  Some people have thick fingers, like farmers and thumb-wrestlers. Apple’s iOS Human Interface Guidelines recommend a minimum ‘tappable’ area of 44x44px. **Generous font sizes:**  Make them big so they’re easy to read. iOS devices generally won’t accept a value of less than 13px without a lot of coding and manipulation...   Learn more about mobile best practices, and find a complete CSS support breakdown, in the full Server Side Guy post. Click below! [![See more on Server Side Guy](https://no-cache.hubspot.com/cta/default/470506/0554546f-2e8a-40fc-92e8-bce6f08b433b.png)](https://cta-redirect.hubspot.com/cta/redirect/470506/0554546f-2e8a-40fc-92e8-bce6f08b433b)   Topics: [Web Development](https://go.fjorge.com/topic/web-development) ### Subscribe to Email Updates ### Recent Posts ### Posts by Topic - [Digital Strategy (11)](https://go.fjorge.com/topic/digital-strategy) - [Web Development (6)](https://go.fjorge.com/topic/web-development) - [CMS Maintenance (5)](https://go.fjorge.com/topic/cms-maintenance) - [SEO (5)](https://go.fjorge.com/topic/seo) - [Magento (4)](https://go.fjorge.com/topic/magento) - [Website Accessibility (4)](https://go.fjorge.com/topic/website-accessibility) - [Website Launch (4)](https://go.fjorge.com/topic/website-launch) - [Website Maintenance (4)](https://go.fjorge.com/topic/website-maintenance) - [Wordpress (4)](https://go.fjorge.com/topic/wordpress) - [eCommerce (3)](https://go.fjorge.com/topic/ecommerce) - [App Development (1)](https://go.fjorge.com/topic/app-development) - [Paid Search (1)](https://go.fjorge.com/topic/paid-search) - [Podcast (1)](https://go.fjorge.com/topic/podcast) - [Remarketing (1)](https://go.fjorge.com/topic/remarketing) - [Shopify (1)](https://go.fjorge.com/topic/shopify) - [Website Uptime (1)](https://go.fjorge.com/topic/website-uptime) see all [![LinkedIn](http://fjorgedigital.com/wp-content/themes/fjorge/images/linkedIn.png)](https://www.linkedin.com/company/fjorge?__hstc=69507087.a46a63fc1b98f5c6352c717d9379fc4b.1422437048503.1422437048503.1422437048503.1&__hssc=69507087.6.1422437048504&__hsfp=2346531666) [![Facebook](http://fjorgedigital.com/wp-content/themes/fjorge/images/facebook.png)](https://www.facebook.com/fjorgedigital?__hstc=69507087.a46a63fc1b98f5c6352c717d9379fc4b.1422437048503.1422437048503.1422437048503.1&__hssc=69507087.6.1422437048504&__hsfp=2346531666) [![Twitter](http://fjorgedigital.com/wp-content/themes/fjorge/images/twitter.png)](https://twitter.com/fjorgedigital?__hstc=69507087.a46a63fc1b98f5c6352c717d9379fc4b.1422437048503.1422437048503.1422437048503.1&__hssc=69507087.6.1422437048504&__hsfp=2346531666) #### [Email Us](http://fjorgedigital.com/contact) #### Phone Number: 612-877-3841 #### Address: 527 Marquette Ave Suite 2260 Minneapolis, MN 55402 [![Fjorge Digital](https://go.fjorge.com/hs-fs/file-2409753270-png/images/fjorge-digital-logo.png)](http://fjorgedigital.com) © 2015 fjorge ![](https://googleads.g.doubleclick.net/pagead/viewthroughconversion/949166300/?value=0&guid=ON&script=0)