HTML email สร้างอีเมลที่รอดจากไคลเอนต์อีเมล — markup โครงสร้างตารางที่ สไตล์ inline ซึ่งตัวเรนเดอร์ยุคโบราณต้องการ ถูกตรวจที่ความกว้างไคลเอนต์อีเมล และ export พร้อมส่ง มันคือเทมเพลตสำหรับรูปแบบที่ CSS สมัยใหม่ไปตาย
การรันอีเมลสร้างอะไร
บรีฟมันเหมือนแคมเปญ — "อีเมลเปิดตัวสำหรับแพ็กเกจใหม่: พาดหัว สามฟีเจอร์ ปุ่มเดียว footer" — แล้ว agent สร้างอีเมล: ส่วนหัว บล็อกเนื้อหา call to action footer ทั้งหมดใน markup ที่ปลอดภัยกับไคลเอนต์ ผลลัพธ์เปิดใน email viewer: ข้อความที่ความกว้างไคลเอนต์อีเมล เหมือนที่มันจะเรนเดอร์
ไคลเอนต์อีเมลไม่ใช่เบราว์เซอร์ — Outlook ยังเรนเดอร์ HTML ของ Word Gmail ตัด อีเมลยาว dark mode กลับสีที่คุณไม่ได้ตั้ง เทมเพลตสร้างเพื่อความจริงนั้น: ตาราง เหนือ flexbox สไตล์ inline เหนือ stylesheet fallback เหนือฟีเจอร์
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.”
การตรวจความกว้างไคลเอนต์
ตัวแสดงแสดงข้อความที่ความกว้างที่ไคลเอนต์จริงใช้ — บาน inbox แคบ แอปเมลมือถือ — ดีไซน์จึงอ่านที่ขนาดที่มันถูกอ่านจริง เกตตรวจกฎอีเมล: fallback รูปภาพ โครง สร้างตาราง ฟอนต์ปลอดภัย
การ steer อีเมล
การ steer เหมือนผลลัพธ์อื่น:
- ⌥-click บล็อก คอมเมนต์บนจุดตัวเป๊ะ ("ปุ่มควรรู้สึกหนักกว่านี้")
- ตามหลัง สำหรับโครงสร้าง ("เพิ่ม PS ใต้ footer")
- Tweaks สำหรับพารามิเตอร์ — สี accent ความหนาแน่น ขนาดรูป
- Versions — แบบหนึ่งมีภาพ hero อีกแบบเน้นข้อความ
มันถนัดอะไร
- อีเมลเปิดตัวและแคมเปญ — การประกาศที่ต้องดูถูก
- จดหมายข่าว — เลย์เอาต์ที่ส่งซ้ำ อ่านได้ทุกไคลเอนต์
- ดีไซน์ transactional — ใบเสร็จและข้อความต้อนรับที่แบกแบรนด์
- เทมเพลตอีเมล — ฐานสำหรับชุดแคมเปญ
การ export
อีเมล export เป็น HTML — markup ปลอดภัยกับไคลเอนต์พร้อมวางลงในตัวส่ง — และ PNG สำหรับเช็กภาพหรือเอกสารดีไซน์ ไฟล์อยู่ในโปรเจกต์สำหรับแคมเปญถัดไปหรือ แบบถัดไป
Tip: พูด "client-safe" ในบรีฟแม้เทมเพลตจะบังคับอยู่แล้ว — มันกันไม่ให้ การตามหลังลอยกลับไปหา CSS สมัยใหม่ที่ตัวเรนเดอร์ Outlook จะลบทิ้งอยู่ดี