Executive Summary
A vague layer name turns a five-minute edit into a forty-minute hunt. This article hands you a shared email design naming convention so any builder can open your file and know what each layer and merge field does. You get clear naming rules and a formula your team can paste into its wiki. You also get the review habit that stops the convention from rotting.
The Problem: Names Written for the Designer, Not the Builder
Most email files are named in a hurry. The design tool assigns labels like Rectangle 14 and Group 3 the moment you draw a shape and never add a text layer. That is fine while the designer still remembers the layout. It falls apart the day someone else opens the file.
A single campaign template often carries more than a hundred layers. Hero image, logo row, headline, subhead, two buttons, legal text, a divider, a footer and social icons. When half of them read Frame 27, the builder has to reverse-engineer the design by clicking each node.
That reverse-engineering costs money. A rebuild that should take ten minutes stretches past an hour. Worse, the builder guesses at intent. A placeholder labeled Rectangle 14 gets rebuilt as a primary button when it was meant to be a quiet text link. Now the email shows two loud calls to action and the reader freezes.
The Real Cost Hides in the Merge Fields
Layer names are only half the story. The fields that carry subscriber data travel from design to the sending platform and those names matter just as much. A field written as FirstName in one place and first_name in another will not match.
Picture a welcome email going to 40,000 people. The personalization token reads Hi {{first_nmae}}. A single swapped letter sends that typo to every inbox on the list.
This is why the naming convention has to cover both the visual layers and the data fields.
The Fix: A Shared Email Design Naming Convention
Give every layer and field a name that describes its job. The convention below uses lowercase words joined by hyphens, which keeps names readable and avoids the spaces some builders strip out.
Start with a role and a variant: the role is the job and the variant tells you which version. So btn-primary is the main button and btn-secondary is the quieter one. body-copy is the running text.
The naming formula
Use this pattern: [element]-[variant] and keep it to two parts where you can. Add a third part only when it removes real confusion.
A name like blue-button breaks the moment marketing swaps the palette to orange. The job stays the same while the look does not. Naming by role survives every rebrand.
Field names follow the same logic
For data, pick one pattern and never mix it. first_name and last_name beat FirstName and LName every time. Keep field names in lowercase with underscores because most sending platforms expect that style and treat uppercase differently.
Names That Earn Their Keep
- hero-image – the main visual at the top of the email.
- cta-button-primary – the single action you want most readers to take.
- body-copy – paragraphs of running text.
- divider-spacer – a gap or rule that separates blocks.
Notice that none of these names describe a color or a shape.
Where Teams Slip Up
The convention fails for predictable reasons. Someone renames a layer mid-project and forgets the matching field. The file gets duplicated for a new season and the old logic drifts.
Two habits prevent most of this. Name layers as you create them instead of cleaning up at the end. Then run a quick pass before handoff that checks every interactive element and every merge tag.
A Ten-Minute Review That Saves Hours
Add a naming review to your handoff checklist: open the layers panel and rename anything that still reads like a default. Then confirm each merge field in the sending platform matches the design.
This pass takes about ten minutes on a normal template. Spread that across a year of campaigns and the time adds up fast.
Document the convention once and put it where designers and builders both look. A shared doc beats a rule that lives only in one person’s head.
What to Do Next
Pick five names you use often and rewrite them as role-plus-variant today. Then add one line to your handoff checklist: no unnamed default layers and no mismatched fields.
That single habit turns a confusing file into a self-explaining one and the campaign ships clean on the first send.
Read the full guide: Designing Emails: Lessons From Shipping Campaigns Without the Figma Drag