April 24, 2017
•Last updated November 5, 2023
Design A Custom Email Template - Part 1
I recently authored a blog post for Web Designer Depot about building a custom email template with Foundation for Emails.
It dawned on me that I should take advantage of the writing process and document the design process of a custom email template on my own blog. This short video series will be taking you halfway through the process of designing the email template and then later developing it over at Web Designer Depot.
You can find the source code to the project there as well. Unfortunately, the article isn't comprehensive do to length requirements so you'll need to use a bit of imagination if you're trying to follow along step by step. Nevertheless, I wanted to document a design-driven series to show you a little bit about how I take an idea and turn it into an interactive experience.
Why Custom Emails?
Branded email templates appear 100x more professional to me. I often find if I see a stock templated email from Mailchimp or a similar service I'm a little put-off. It's not that the content is bad but simply that it's not quite what it could be. Is this a big deal? Not at all, but since my own business builds brands, I need to have every public facet covered.
More Options
Many default templates are limiting. You can add custom imagery, content, and more but sadly your email template may appear very similar to competitors who utilize the same service.
Creating a custom template offers more options. You can create branded elements and use different layouts that better suit your purpose.
More Control
From a technical perspective, I like the idea of knowing what is under the hood in my emails. At the end of the day no one sees the code but being a developer I don't like creating code that isn't efficient or functional out of the gates. Many default templates from a service such as Mailchimp are tried and tested. This makes sending emails to your subscribers a breeze. Sadly, If you want more control you need to reinvent the wheel in some cases. This is where Foundation for Emails comes into play. You can read more about how it all works and or check out my tutorial for more information.
Email Design Inspiration
- Mailchimp Inspiration
- Really Good Emails
- Email Monks - Newsletter Design Inspiration
- Campaign Monitor - Best Email Marketing Campaigns
Other Links
Watch the complete series
Products and courses
-
Hello Hotwire
A course on Hotwire + Ruby on Rails.
-
Hello Rails
A course for newcomers to Ruby on Rails.
-
Rails UI
UI templates and components for Rails.