Email design that matches the site

Jason Yochim

Tags:e-marketing

Templates built in HTML, sized for the inbox, and using the same type and color as the website.

An email that is a screenshot of a poster will break in half the inboxes that open it. A template built in HTML, with the same type and color as the site, can be sent again next month.

Email design that matches the site

What the template includes

A header, a readable column of type, a button, and a footer with the details a real email needs. Images are support, not the whole message. The width is the width inboxes expect, not a desktop homepage squeezed into a preview pane.

If you send from Shopify, Klaviyo, Mailchimp, or similar, the template has to land in that tool. Designing it in a place you cannot export is the same problem as a website that never gets deployed.

What to decide first

Who sends it, how often, and whether it is one campaign or a template the team will duplicate. One campaign is a fixed piece of work. A template you will reuse belongs with the brand system and the site.

Where it sits in the studio

Email is part of UX/UI and HTML, using the same system as the brand. If email is one item on a longer list, put it on a plan and send the request as a ticket.

Services related to this content

Ready to put this into practice?

Here's where I can help you build it.

  1. UX/UI & HTMLWebsite & media redesignsEmail, HTML & deploymentRedesigns and rebrands, email design, HTML, and deployment. View service
  2. BrandingLogo, color, typeWeb and printLogo, type, and color, applied on the site and in print. View service
  3. ShopifyWeb Store & POSPartner / Dev workflowsCustom themes, store builds, and migrations. View service

Plans bill the time tracked on a subscription, or one price on a fixed rate. Contact if this is the work you want done.

More E-Marketing guides

From the same topic.

All E-Marketing guides