HTML email membangun email yang bertahan di klien email — markup terstruktur-tabel dan berstyle-inline yang dibutuhkan renderer kuno, diperiksa pada lebar klien email dan diekspor siap kirim. Ini template untuk format di mana CSS modern pergi untuk mati.
Apa yang dibangun run email
Beri brief seperti sebuah kampanye — "email peluncuran untuk tier baru: headline, tiga fitur, satu tombol, footer" — dan agen membangun emailnya: header, blok body, call to action, footer, semuanya dalam markup aman-klien. Hasilnya terbuka di email viewer: pesan pada lebar klien email, seperti ia akan ter-render.
Klien email bukan browser — Outlook masih me-render HTML Word, Gmail memotong email panjang, dark mode membalik warna yang tidak Anda atur. Template membangun untuk realitas itu: tabel daripada flexbox, style inline daripada stylesheet, fallback daripada fitur.
HTML email · Devin · e2e · gate PASS
The Launch Email — The announcement email for this very product — one clear CTA, inlined tables, dark-mode safe.
▸ the prompt that made it▾ the prompt that made it
“Design an HTML email: a launch announcement for a desktop design tool — one clear CTA.”
Pemeriksaan lebar klien
Viewer menampilkan pesan pada lebar yang dipakai klien nyata — panel inbox sempit, aplikasi mail mobile — jadi desainnya terbaca pada ukuran ia benar-benar dibaca. Gate memeriksa aturan email: fallback gambar, struktur tabel, font aman.
Mengarahkan sebuah email
Pengarahan yang sama seperti hasil mana pun:
- ⌥-click sebuah blok, beri komentar di titik yang persis ("tombolnya harusnya terasa lebih berat")
- Tindak lanjut untuk struktur ("tambahkan PS di bawah footer")
- Tweaks untuk parameter — warna aksen, kepadatan, ukuran gambar
- Versions — satu pendekatan dengan gambar hero, satu yang maju-ke-teks
Apa yang dikuasainya
- Email peluncuran dan kampanye — pengumuman yang harus terlihat benar
- Newsletter — layout berulang, terbaca di setiap klien
- Desain transaksional — resi dan sambutan yang membawa brand
- Template email — basis untuk seri kampanye
Mengekspor
Email diekspor sebagai HTML — markup aman-klien siap tempel ke pengirim — dan PNG untuk pemeriksaan visual atau dokumen desain. File-nya tetap di proyek untuk kampanye atau pendekatan berikutnya.
Tip: Katakan "client-safe" di brief meski template menegakkannya — itu menjaga tindak lanjut tidak melayang kembali ke CSS modern yang toh akan dibuang renderer Outlook.