Close icon

Design Workflow Blog

Design and coding techniques

Branding, mobile, accessibility, digital forms, and more, for the web, and email marketing.

Modern form validation

Modern form validation

3 modern CSS techniques for advanced form validation customization.

Modern form design

Modern form design

Utilizing modern browser features to simplify the design process for forms.

Modern email design

Modern email design

What to look forward to after the legacy Outlook for Windows rendering engine.

The design of a design system

The design of a design system

Maintaining your design system and keeping it creative.

Rolling out your design system

Rolling out your design system

Auditing current patterns and workflows and having your team join in the process.

A primer on design systems

A primer on design systems

Why you should have one and the main aspects that should be included.

5 core landing page techniques

5 core landing page techniques

How to ensure your landing page seamlessly ties in with email marketing.

Template technique: handling spacing

Template technique: handling spacing

Maintaining consistent spacing in an email layout.

Template technique: levels of email dark mode

Template technique: levels of email dark mode

How to prepare your template for email clients and their dark mode affects.

Template technique: automatic mobile layout

Template technique: automatic mobile layout

Simple code for globally adjusting any column in an email template for mobile.

Letting go of Outlook for Windows

Letting go of Outlook for Windows

No more tables, no more VML, no more Outlook’s dirty code!

How code is handled by email providers

How code is handled by email providers

Ways that email providers mess with your code and what to do about it.

Modular design technique: the 3 phases of template design

Modular design technique: the 3 phases of template design

The design phases towards turning your email design into a design system: structure, branding, modules.

Modular design technique: using standard layouts

Modular design technique: using standard layouts

What do these emails have in common? They all use the same essential layout, each with completely different branded designs.

Making your emails shareable

Making your emails shareable

Adding share links and utilizing meta info.

Starter modular email boilerplate

Starter modular email boilerplate

The framework we use for coding custom email templates that are accessible and lightweight, available as open source.

Dealing with Outlook

Dealing with Outlook

Email clients have improved email rendering throughout the years. Except for Microsoft Outlook. Here’s how to support it and keep your sanity.

Modular design technique: components that work together

Modular design technique: components that work together

How DICK’S Sporting Goods designed their components to be reusable and plug into and along side each other.

Organizing your email design process

Organizing your email design process

3 steps towards systemizing your email’s production.

Modular design technique: Layout styles to break up content

Modular design technique: Layout styles to break up content

AAA’s newsletter allows for glanceable reading by using a wide range of content layout options.

Modular design technique: creative collage layouts

Modular design technique: creative collage layouts

How Funimation uses collage-based visuals to promote their wide range of shows and products.

Modular design technique: utilizing color for tone

Modular design technique: utilizing color for tone

How Headspace uses different color palettes for their email content while keeping layout and formatting consistent.

What is modular design?

What is modular design?

A framework for more clearly defining the language around your design system and templating techniques.

Turning to the dark mode

Turning to the dark mode

Should you make your email design dark mode compatible?

Making accessibility a habit

Making accessibility a habit

Accessibility in email design doesn’t have to be an arduous task.

An email design system for your thoughts

An email design system for your thoughts

Using a design system helps you better analyze your emails, streamline production, and iterate on strategy for your campaigns.

Responsive emails: modularize to mobilize

Responsive emails: modularize to mobilize

At least half of email opens now happen on mobile. So there’s no longer an excuse to not enhance your emails for mobile!

The use of brand in email

The use of brand in email

Branding and design aesthetics can sound like a fuzzy proposition, but understanding their underlying principles can lead to strategic results.