---

name: building-email-newsletters description: Scaffolds email campaigns with content blocks and copy. Use when the user asks about email templates, newsletter content, subject lines, email marketing, or campaign copy.

Email Newsletter Template Builder

When to use this skill

• User asks to create a newsletter
• User needs email subject lines
• User wants email campaign templates
• User mentions email marketing copy
• User needs A/B testing variants

Workflow

• Identify email type and goal
• Generate subject line variants
• Create preheader text
• Build email structure
• Write content blocks
• Add CTAs and footer

Instructions

Step 1: Identify Email Type

Step 2: Subject Line Generation

Subject line formulas:

Subject line best practices:

• 30-50 characters (mobile preview)
• Front-load key information
• Avoid spam triggers (FREE!!!, 💰💰💰)
• Test with/without emoji
• Match preheader text

A/B test variants:

Copy## Subject Line Variants

**Version A (Benefit-focused):**
Subject: 5 tools that cut my development time in half
Preheader: Plus the one tool I stopped using

**Version B (Curiosity):**
Subject: I stopped using this popular tool
Preheader: And my productivity doubled

**Version C (Question):**
Subject: Are you still using [Tool]?
Preheader: There's a faster alternative

Step 3: Preheader Text

Preheader guidelines:

• 40-100 characters
• Complement (don't repeat) subject
• Add context or secondary hook
• Include CTA preview if relevant

Step 4: Email Structure Templates

Newsletter template:

Copy<!-- Preheader (hidden) -->
<span style="display:none;">[Preheader text here]</span>

<!-- Header -->
[Logo] [Navigation: Blog | Products | Contact]

<!-- Hero Section -->
[Featured image or heading] [Brief intro: 2-3 sentences] [Primary CTA button]

<!-- Content Block 1 -->
[H2: Section title] [Thumbnail image] [Summary: 2-3 sentences] [Read more link]

<!-- Content Block 2 -->
[H2: Section title] [Thumbnail image] [Summary: 2-3 sentences] [Read more link]

<!-- Content Block 3 -->
[H2: Section title] [Thumbnail image] [Summary: 2-3 sentences] [Read more link]

<!-- Secondary CTA -->
[H2: Call to action heading] [Brief value prop] [CTA button]

<!-- Footer -->
[Social icons] [Unsubscribe | Preferences | View in browser] [Company address]
[Copyright]

Promotional template:

Copy<!-- Preheader -->
<span style="display:none;">[Urgency or key offer]</span>

<!-- Header -->
[Logo]

<!-- Hero -->
[Bold headline with offer] [Hero image of product/service] [Key benefit: 1
sentence] [Primary CTA: "Shop Now" / "Get Started"]

<!-- Social Proof -->
[Testimonial or rating] [Customer logo bar]

<!-- Benefits -->
[Benefit 1 with icon] [Benefit 2 with icon] [Benefit 3 with icon]

<!-- Urgency -->
[Countdown or deadline] [Secondary CTA]

<!-- Footer -->
[Unsubscribe | View in browser] [Address]

Welcome email template:

Copy<!-- Preheader -->
<span style="display:none;">Here's what to do first...</span>

<!-- Header -->
[Logo]

<!-- Hero -->
[Personalized greeting: "Welcome, {first_name}!"] [What they signed up for /
what to expect] [Founder photo or brand image]

<!-- Quick Wins -->
[H2: Get started in 3 steps] [Step 1] [Icon + title + 1-sentence description]
[Step 2] [Icon + title + 1-sentence description] [Step 3] [Icon + title +
1-sentence description] [Primary CTA: "Complete your profile" / "Start
tutorial"]

<!-- Value Reminder -->
[H2: What you'll get] [Bullet list of benefits]

<!-- Personal Touch -->
[Sign-off from founder/team] [Photo + signature] [P.S. line with secondary offer
or tip]

<!-- Footer -->
[Support link] [Social icons] [Unsubscribe | Preferences]

Step 5: Content Block Writing

Block structure:

Copy## [Compelling headline]

[1-2 sentences summarizing the value or key point]

[Optional: key stat or quote]

[CTA: "Read more →" or "Watch now →"]

Block examples:

Copy## Why Your Images Are Slowing Down Your Site

Large, unoptimized images are the #1 cause of slow page loads.
Here's how to fix it in under 10 minutes.

→ Read the full guide

---

## New Feature: Dark Mode Support

You asked, we delivered. Enable dark mode in your dashboard
settings for easier late-night work sessions.

→ Try it now

---

## Case Study: How Acme Corp Increased Conversions 47%

See exactly how they optimized their checkout flow and
the surprising change that made the biggest difference.

→ Read the case study

Step 6: CTA Best Practices

Button copy:

CTA guidelines:

• Action verb + benefit
• 2-5 words
• First person ("Get my..." vs "Get your...")
• Contrast color from email background
• Minimum 44x44px tap target

Step 7: Footer Requirements

Required elements:

Copy<!-- Social Links -->
<a href="#">Twitter</a> | <a href="#">LinkedIn</a> | <a href="#">Instagram</a>

<!-- Legal -->
<p>You're receiving this because you signed up at [website].</p>

<a href="{unsubscribe_link}">Unsubscribe</a> |
<a href="{preferences_link}">Email preferences</a> |
<a href="{browser_link}">View in browser</a>

<!-- Address (CAN-SPAM required) -->
<p>
  [Company Name]<br />
  [Street Address]<br />
  [City, State ZIP]
</p>

<!-- Copyright -->
<p>© 2026 [Company Name]. All rights reserved.</p>

Step 8: Mobile Optimization

Mobile-first guidelines:

Responsive image:

Copy<img
  src="image.jpg"
  alt="Description"
  width="600"
  style="max-width: 100%; height: auto; display: block;"
/>

Step 9: Testing Checklist

Before sending:

• Subject line under 50 characters
• Preheader complements subject
• All links working
• Images have alt text
• Unsubscribe link present
• Physical address included
• Renders on mobile (test with Litmus/Email on Acid)
• Plain text version included
• Personalization tokens work ({first_name})
• Sent from recognizable sender name

Output Format

Copy## Email Campaign: [Name]

**Type:** [Newsletter/Promotional/Welcome/etc.]
**Goal:** [Engagement/Sales/Onboarding/etc.]

---

### Subject Line Variants

**A:** [Subject line]
**B:** [Subject line variant]

**Preheader:** [Preheader text]

---

### Email Content

[Full email content with sections marked]

---

### Notes

- Send time: [Recommended day/time]
- Segment: [Target audience]
- A/B test: [What to test]

Validation

Before completing:

• Subject line A/B variants provided
• Preheader text included
• Clear value in first paragraph
• CTAs are action-oriented
• Mobile-friendly structure
• Footer has required elements
• Consistent with brand voice

Error Handling

• No clear goal: Ask for campaign objective (traffic, sales, engagement).
• Too much content: Limit to 3-5 content blocks; link to full articles.
• Missing personalization: Add {first_name} or segment-specific content.
• Spam trigger words: Avoid "FREE", "Act now", excessive caps/punctuation.
• No mobile consideration: Use single column, large fonts, stacked CTAs.

Resources

• Really Good Emails - Inspiration
• Litmus - Email testing
• Mail-Tester - Spam score check
• Email on Acid - Cross-client testing