6 Fantastic and Easy-to-Use Responsive Email Templates


Written by Franco Varriano.

In this article, we’ll be talking about our fantastic responsive email templates which ecommerce entrepreneurs can use to easily setup and launch their campaigns.

These templates can be used for any purpose. We’ll cover six types in this article, but you can use any of the templates for any purpose you like. Go ahead and modify them to match your creative vision and the tone of your business.

We also provide variations so that you can customize the things like the number of product recommendations, different email flows, and styles (ranging from personal with a signature to bold and assertive).

Our template editor makes it easy to create beautiful, modern email newsletters – without having to touch a line of code. 

How To Create Responsive Emails (No Code Required!)

Traditional HTML email templates are pretty rigid: they let you change colors, images, and text, but not much more. Rare’s responsive templates give you a lot more flexibility. You can create new content, try new layouts—basically do everything you need to do to get the custom look and feel you want.

At the same time, we want you to be able to create responsive layouts and designs without having to edit CSS code. Responsive design means that the email displays well on pretty much any screen size, big or small, with content that moves and selectively change layouts on mobile or desktop readers. That’s a pretty tall order, so you can bet that we add features carefully and test extensively.

Fortunately, we have this visual design thing figured out. Our clients tell us that with Rare their creative teams waste NO time editing the tangled mess that is email CSS and HTML code—which means that they get to spend that time actually being creative.

A nifty side effect is that our clients are trying more varied, media-rich email designs for their campaigns, rather than being forced to use the same old templates with different images and text over and over or having to bug one of their developers to customize the template each time.

Rare Emails Are Compatible Across Devices and Platforms

Email generated by Rare has been tested extensively on all major email clients (both archaic and modern) using Litmus. These include:

  • Apple Mail 9, 10 and 11
  • Lotus Notes 8, 8.5 and all Lotus Notes
  • Outlook 2000, 2002, 2003, 2007, 2010, 2011, 2013, and 2016
  • Thunderbird
  • Android 4, 5, 6
  • Gmail App
  • Google Inbox
  • iPad Retina and Mini
  • iPhone 6 and 6 plus
  • Gmail (Explorer, Firefox, and Chrome)
  • Outlook.com (previously Hotmail, on Explorer, Firefox, and Chrome)

Email Design Just Got Even Easier

Here’s a breakdown of our email designer, highlighting the features that make it easier than ever to create the emails you need to drive more sales.

1. Interface Features

With Rare, you have an interface that gives you easy editing and control over as much or as little as you’d like of your email designs. Our interface designer supports platform visibility (all, desktop, mobile), minimum height, and control over the desktop margins and mobile margins for both the text and the bounding box.

Control of mobile margins is the big feature here because when an email is shown on a much narrower mobile device, you may want to have wider, narrower, or hidden margins around your text, and perhaps shrink away the bounding box altogether, as shown in the example below (right).

2. Lines and Spacers

With Rare, it’s easy to add lines and spacers to break up the different sections of your email. These design elements support platform visibility (all, desktop, mobile), as well as margins. You can set desktop margins and override on mobile using the mobile margins feature. If you are going to use margins on your lines or spacers, be sure to use the preview button to see how they look on both desktop and mobile and make any adjustments you need to fulfill your vision.

I am text block. Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

A note about Outlook: Most older versions of outlook will limit the height of lines to 8px. Some may also display round or “fuzzy” dots instead of the more normal square dots modern email clients display.

3. Buttons

Rare uses HTML/CSS buttons to ensure that they display even when customers have images turned off in their reader. HTML buttons always show up—and right away—because they are part of the email body and not something that needs downloading.

You can create trendy buttons like ghost buttons (buttons with a stroke and a background that matches the page around them), rounded buttons, or just plain old buttons in nearly any color or text configuration you like.

Below, you can see just a few of the possible customizations you can make with our button editor.

Easily edit common properties of the button text.
Adjust the button padding.
Adjust the container padding (no CSS required).
Change the button alignment, background color, and width.

4. Auto JPEG

Many designers like to keep their images in formats like PNG instead of JPEG. The problem with JPEGs is that they lose a little bit of quality every time you load them and save them again. This means that making small changes over time to an important image can limit its usability in the long run.

Image formats like PNG don’t have this problem—you can load, edit, and save all you want. But PNG files can be really big, and that’s never a good thing in email, especially on mobile devices, where the Internet can be slow (and expensive).

Rare lets you choose whether to convert large PNG files into JPEGs automatically. Small PNG images, such as icons, won’t provide the option and will display as PNG files. Because Rare maintains all your email and product images in a CMS (Content Management System) we can change formats, and dimensions as required to deliver an efficient email.

PNG files are excellent for two things other than being lossless: non-photographic images, and transparent images. The locomotive in the example above is a transparent PNG. When it’s displayed as a JPEG, which does not support transparency, the background becomes white, and that looks pretty bad on a colored background.

In the scenario above, the PNG format is the better choice because the locomotive is transparent. This way you can adjust the background color in the container until you find the one you like.

6 Responsive Email Templates to Get You Started Making Sales

Now that we’ve gone over some of the general features that distinguish Rare’s Template Designer, we want to show you six responsive email templates you can use to get started with your ecommerce email marketing today.

1. Basic

Perfect for product recommendations, showcasing new inventory, or welcoming new customers to your store, this template has just enough to get you started. At the same time, it leaves plenty of room for creativity when choosing the colors, fonts, and other design elements. If you’d prefer a template with a more established design, then we recommend Turn That Frown Upside Down or Friends Forever, two of our Designer Templates pictured below.

2. Newsletter

Sending out newsletters is an important part of any ecommerce email marketing strategy. It’s a chance to let your subscribers now what’s happening at your company, as well as alert them of any new products or deals available. To help you create these essential emails, we offer the Newsletter template. This basic template is beautifully designed and functional on its own, but it also allows plenty of room for customization.

If you want a newsletter with a more clearly defined design, then we recommend Just Checking In, a designer template pictured below.

3. Video

Whether it’s to showcase a new product, give a tour of your production facility, or just to share an important message with a more personal touch, video is an excellent way to distinguish your email marketing from your competitors. But you need to make sure that if you do include video, your subscribers can easily view it. The Video template makes this a breeze. All you have to do is paste the link into the editor, pick a caption, and choose a thumbnail image, as shown below.

4. Post-purchase Follow Up

People who have bought from you in the past are far more likely to buy from you than people just coming across your site for the first time. This is something you can use to your advantage in email marketing in the form of post-purchase follow up emails. These emails serve two functions:

  1. Ensure that your customer was satisfied. Exceptional customer service and experience are the lifeblood of ecommerce stores. Sending a brief email using our template lets your customers know you care and gives them a chance to voice any concerns or comments.
  2. Suggest relevant additional products. When someone has made a purchase, it indicates that they like some aspect of your brand and products. This is the perfect moment to suggest additional relevant products (something that’s a breeze with Rare’s Recommended Product Engine). See the screenshot below for an example of how this looks in the template.

5. Abandoned Cart

Following up when a customer abandons their cart is key to closing more ecommerce sales. When you combine our responsive templates with Rare’s Abandoned Cart Automation, you can ensure that those abandoned carts turn into closed sales. Note in particular how the template allows the customer to jump right back to their cart and complete their purchase.

6. Win-Back

Your customers are busy, and this can result in them forgetting about you. For an easy way to remind them, you can use are Winback templates. Pictured above is the Winback – General #1 template, in which you make your customer feel special and even offer them a discount in the hopes that they’ll give your store another look. You can use Rare’s automation features to ensure these emails send automatically. For another look at Winback emails, check out our Winback – General #2 template below.

Start Boosting Your Ecommerce Sales Today

If you’re an ecommerce merchant and don’t have automated email marketing campaigns setup for your store, you’re losing money. Right now.

Rare.io makes it easy to start using automated email campaigns for common challenges like: Welcome Series, Abandoned Carts, Order Follow-up emails and more!

And if you’re one of the thousands of merchants who are already using Rare’s Smart Email Marketing software and want to see how our Customer Success Team can work with your brand to grow your revenue – feel free to book a call at your convenience here.

Want More Email Marketing Insights - Specifically Designed to Help You Grow Your Online Store?

Sign-up for the Rare.io Newsletter to get exclusive insights, tactics, and proven strategies from Top Ecommerce Experts that we don't publish here:


Get proven ecommerce tactics & strategies from real ecommerce entrepreneurs!

Get proven ecommerce tactics & strategies from real ecommerce entrepreneurs!

Leave a Comment

Your email address will not be published.