วิธีเพิ่มองค์ประกอบเชิงโต้ตอบให้กับอีเมลของคุณ

องค์ประกอบอีเมลแบบโต้ตอบคืออะไร

อีเมลจำนวนมากที่เข้ามาในกล่องจดหมายของเราเป็นแบบ 2 มิติ อีเมลมีข้อความ รูปภาพ หรืออาจเป็น gif แต่ไม่สามารถโต้ตอบได้ เมื่อคุณเลื่อนผ่านปุ่ม จะไม่เปลี่ยนสีหรือป๊อปอัป เมื่อคุณวางเมาส์เหนือรูปภาพ จะไม่พลิกไปที่รูปภาพ อื่น อย่างน้อย เว้นแต่ผู้ส่งจะรวมองค์ประกอบอีเมลเชิงโต้ตอบไว้ในแคมเปญของตน

องค์ประกอบแบบโต้ตอบในอีเมลเป็นสิ่งที่ผู้รับต้องดำเนินการจึงจะแสดง การดำเนินการนี้อาจวางเมาส์เหนือปุ่ม CTA ที่มีเคอร์เซอร์หรือคลิกคำตอบในแบบสำรวจ

เช่นเดียวกับการโรยบนเค้ก เนื้อหาแบบโต้ตอบไม่จำเป็น แต่เนื้อหาจะดึงดูดสายตาผู้รับของคุณและดึงดูดพวกเขาเข้ามา ปรับปรุงประสบการณ์ของพวกเขากับแคมเปญอีเมลของคุณ หากคุณกำลังมองหาวิธีอื่นๆ ในการมีส่วนร่วมกับผู้รับ ให้ลองทดสอบหนึ่งในองค์ประกอบเชิงโต้ตอบต่อไปนี้ในแคมเปญของคุณ

ความเข้ากันได้กับผู้ให้บริการอีเมล (ESP)

ก่อนที่คุณจะตั้งใจที่จะเพิ่มองค์ประกอบแบบอินเทอร์แอกทีฟให้กับแคมเปญทั้งหมดของคุณ คุณควรสังเกตว่าการออกแบบอีเมลเชิงโต้ตอบนั้นใช้ไม่ได้กับกล่องจดหมายทั้งหมด แม้ว่าฟังก์ชันส่วนใหญ่ใน Apple Mail และบางส่วนทำงานในกล่องจดหมายของ Gmail มีฟังก์ชันน้อยมากใน Outlook หรือบนมือถือ

โปรดคำนึงถึงสิ่งนี้เมื่อออกแบบองค์ประกอบเชิงโต้ตอบในอีเมลของคุณ ถ้าคุณรู้ว่าผู้รับส่วนใหญ่ของคุณใช้ Outlook หรือดูอีเมลของคุณบนอุปกรณ์เคลื่อนที่ คุณอาจต้องการเน้นที่การทดสอบด้านอื่นๆ ของอีเมลของคุณ หรืออย่างน้อยที่สุด ให้รูปภาพหรือการออกแบบทางเลือกสำหรับไคลเอนต์อีเมลที่จะแสดงเมื่อไม่รองรับเนื้อหาแบบโต้ตอบ

ไม่ว่าคุณจะใส่อะไรในอีเมล อย่าลืมทดสอบอีเมลของคุณในโปรแกรมรับส่งเมลหลายตัวก่อนที่จะส่ง ด้วยวิธีนี้ คุณจะแก้ไขปัญหาหรือข้อบกพร่องในการออกแบบได้ก่อนที่จะส่งอีเมลไปยังฐานข้อมูลผู้ติดต่อของคุณ

ตรวจสอบ เครื่องมือทดสอบอีเมล ของเรา เพื่อดูว่าอีเมลของคุณจะมีลักษณะอย่างไรในผู้ให้บริการอีเมลและหน้าจอต่างๆ เครื่องมือนี้ยังมีการให้คะแนนสแปมและการตรวจสอบความถูกต้องของลิงก์ ดังนั้นคุณจึงสามารถตรวจจับเนื้อหาที่เป็นสแปมและลิงก์เสียก่อนส่งได้

วิธีเพิ่มองค์ประกอบแบบโต้ตอบให้กับอีเมลของคุณ

มีองค์ประกอบเชิงโต้ตอบมากมายที่คุณสามารถเพิ่มลงในอีเมลของคุณได้ นี่คือรายการโปรดของเราจำนวนหนึ่ง เรามีตัวอย่างและส่วนย่อยของโค้ดเพื่อให้คุณสามารถลองใช้องค์ประกอบเหล่านี้ในเทมเพลตอีเมลของคุณได้

1. เปลี่ยนสีพื้นหลังเมื่อโฮเวอร์

การเปลี่ยนสีเมื่อวางเมาส์เหนือปุ่ม CTA เป็นหนึ่งในองค์ประกอบแบบโต้ตอบที่พบบ่อยที่สุดที่คุณจะเห็นในอีเมล คุณลักษณะที่ละเอียดอ่อนนี้ดึงดูดความสนใจไปที่ปุ่ม CTA ใช้สีโฮเวอร์แบบเดียวกับที่คุณใช้สำหรับเว็บไซต์ของคุณเพื่อมอบประสบการณ์ที่สอดคล้องกันระหว่างอีเมลและเว็บไซต์

ในตัวอย่างด้านล่าง อีเมลที่ดีจริงๆ ใช้การเปลี่ยนสีบนปุ่ม CTA

ทำแบบนี้ก็ได้

สำหรับองค์ประกอบเชิงโต้ตอบส่วนใหญ่ในบทความนี้ คุณจะต้องเพิ่มคลาสในส่วน CSS ของเทมเพลต จากนั้น คุณจะรวมชั้นเรียนไว้ในแท็ก <a> ของส่วนที่คุณต้องการโต้ตอบ นี่คือตัวอย่างจากเทมเพลตอีเมลในตัวแก้ไขโค้ดของ Twilio SendGrid

คุณจะสังเกตเห็นว่าด้านล่างมีโค้ดจำนวนพอสมควร แต่ส่วนใหญ่คือการจัดรูปแบบปุ่ม CTA ก่อนที่คุณจะวางเมาส์เหนือและลักษณะที่ปรากฏเมื่อคุณวางเมาส์เหนือ ในการเปิดใช้งานฟังก์ชันโฮเวอร์ คุณต้องเปลี่ยนคลาสเป็นหลัก (บรรทัดที่ 12) เพื่อให้ตรงกับคุณสมบัติ CSS ที่ถูกต้อง

ซีเอสเอส:

HTML:

2. เปลี่ยนข้อความเมื่อโฮเวอร์

องค์ประกอบแบบโต้ตอบที่คล้ายกันกำลังเปลี่ยนข้อความเมื่อวางเมาส์เหนือ ด้วยองค์ประกอบนี้ คุณสามารถเปลี่ยนสีของข้อความ ทำให้เป็นตัวหนา ขีดเส้นใต้ หรือเปลี่ยนแปลงการออกแบบอื่นๆ ที่เกี่ยวข้องกับข้อความเมื่อเคอร์เซอร์วางเมาส์เหนือข้อความ

ในตัวอย่างนี้ สีฟอนต์เปลี่ยนจากสีขาวเป็นสีดำ

ทำแบบนี้ก็ได้

ความแตกต่างหลักระหว่างตัวอย่างนี้กับการเปลี่ยนสีพื้นหลังบนโฮเวอร์คือ CSS และคุณสมบัติ CSS ที่อ้างอิงใน HTML

ซีเอสเอส:

HTML:

ในตัวอย่างที่สองนี้ ฟอนต์จะเปลี่ยนเมื่อคุณวางเคอร์เซอร์ให้เป็นตัวหนาและขีดเส้นใต้

ทำแบบนี้แหละ

อีกครั้ง ความแตกต่างหลักคือคุณสมบัติ CSS และ CSS ที่อ้างอิงใน HTML

ซีเอสเอส:

HTML:

3. สลับรูปภาพเมื่อโฮเวอร์

เราพบในอีเมลที่เนื้อหามีส่วนร่วมมากที่สุดอยู่ ครึ่งหน้าบน (หรือที่เรียกว่าเนื้อหาที่แสดงในอีเมลก่อนที่ผู้รับจะเลื่อนดู)

การสลับรูปภาพเมื่อวางเมาส์เหนือเป็นกลยุทธ์ที่ดีในการโปรโมตผลิตภัณฑ์เพิ่มเติมหรือให้ข้อมูลเพิ่มเติมเมื่อคุณมีพื้นที่และเวลาจำกัดในการมีส่วนร่วมกับผู้รับ

เมื่อผู้รับวางเมาส์เหนือรูปภาพ รูปภาพอื่นจะปรากฏขึ้น ดังนั้นหากคุณกำลังส่งเสริมการขาย คุณสามารถนำเสนอผลิตภัณฑ์ของคุณได้มากขึ้นโดยรวมรูปภาพหลายรูป หรือคุณสามารถให้คำอธิบายผลิตภัณฑ์หลังภาพเพื่อให้ข้อมูลเพิ่มเติมโดยไม่ต้องคลิกผ่านไปยังเว็บไซต์

ดูตัวอย่างด้านล่าง!

นี่คือวิธีที่คุณทำ:

องค์ประกอบโต้ตอบการสลับรูปภาพถูกสร้างขึ้นโดยการจัดเลเยอร์รูปภาพใน HTML เพื่อให้มีรูปภาพพื้นหลังเป็นอันดับแรกในเซลล์ตารางและรูปภาพที่สองพร้อมใช้งานเมื่อคุณวางเคอร์เซอร์ของคุณ

ซีเอสเอส:

HTML:

4. สารบัญ

คุณลักษณะสารบัญมีประโยชน์อย่างยิ่งสำหรับอีเมล เช่น จดหมายข่าวที่มีเนื้อหาจำนวนมาก ลองนึกถึงบทความที่คุณอ่านทางออนไลน์ซึ่งมีลิงก์ข้ามที่นำไปสู่ส่วนต่างๆ ของหน้าเว็บ ในทำนองเดียวกัน การเพิ่มแท็ก Anchor ให้กับอีเมลของคุณ ผู้รับของคุณสามารถข้ามไปยังส่วนของอีเมลที่พวกเขาสนใจมากที่สุดได้โดยไม่ต้องเลื่อน

แม้ว่าองค์ประกอบสารบัญนี้จะได้รับการสนับสนุนในผู้ให้บริการอีเมลเดสก์ท็อปส่วนใหญ่ คำเตือนก็คือแอปบนอุปกรณ์เคลื่อนที่ส่วนใหญ่ไม่รองรับ หากคุณรู้ว่าสมาชิกส่วนใหญ่ของคุณดูอีเมลของคุณบนเดสก์ท็อป องค์ประกอบแบบโต้ตอบนี้อาจเหมาะกับคุณ!

ในตัวอย่างนี้ ฉันได้รวมสารบัญไว้ที่ตอนเริ่มต้นของไดเจสต์ของบล็อกของ SendGrid และใช้แท็ก Anchor เพื่อเชื่อมโยงไปยังบทความในอีเมล ด้วยวิธีนี้ ผู้รับสามารถคลิกบทความเฉพาะที่พวกเขาสนใจได้

นี่คือวิธีที่คุณทำ:

ไม่จำเป็นต้องใช้ CSS ในอันนี้! ตัวอย่างแรกคือรายการสารบัญที่ด้านบนของอีเมล และส่วนที่สองคือวิธีที่คุณจะเชื่อมโยงชื่อบทความลงในอีเมล

HTML:

5. แบบสำรวจฝังตัว

อีกกรณีการใช้งานที่ยอดเยี่ยมสำหรับองค์ประกอบแบบโต้ตอบคือแบบสำรวจ รวมแบบสำรวจไว้ในอีเมลของคุณเพื่อให้ผู้รับตอบกลับทันทีได้ง่ายขึ้นโดยไม่ต้องคลิกไปยังหน้าอื่น ยิ่งผู้รับของคุณมีส่วนร่วมได้ง่ายขึ้นเท่าใด คุณก็ยิ่งมีโอกาสได้รับคำตอบมากขึ้นเท่านั้น

รวบรวมคำติชมเกี่ยวกับประสบการณ์ของผู้รับเกี่ยวกับผลิตภัณฑ์หรือบริการของคุณ หรือใช้แบบสำรวจเพื่อเรียนรู้เพิ่มเติมเกี่ยวกับการชอบและไม่ชอบของผู้รับ ตำแหน่ง และข้อมูลอื่นๆ ที่สามารถช่วยให้คุณปรับแต่งประสบการณ์ของพวกเขาด้วยอีเมลของคุณได้ อีเมลต้อนรับหรืออีเมลยืนยันอาจเป็นโอกาสที่ดีในการแทรกแบบสำรวจและทำความรู้จักกับสมาชิกของคุณมากขึ้น

นี่คือตัวอย่างสองสามตัวอย่าง

ในอีเมลของ SendGrid ด้านล่าง คะแนนแบบสำรวจจะเปลี่ยนสีเมื่อคุณวางเมาส์เหนือพวกเขา ซึ่งจะช่วยให้ผู้รับทราบว่าสามารถคลิกหมายเลขเพื่อส่งแบบสำรวจได้ เมื่อผู้รับคลิกหมายเลข ระบบจะนำพวกเขาไปยังแบบสำรวจที่ทำเครื่องหมายคำตอบเป็นตัวเลขแล้ว และขอให้ผู้รับอธิบายเพิ่มเติมสำหรับการให้คะแนน

นี่คือวิธีที่คุณทำ:

วิธีการที่ SendGrid ใช้ในการฝังแบบสำรวจต้องใช้รหัสจำนวนมาก ดังนั้นนี่คือตัวอย่างที่ง่ายกว่าที่ใช้ Google ฟอร์ม

1. สร้างแบบสำรวจของคุณใน Google ฟอร์ม
2. คลิกส่ง
3. พิมพ์ที่อยู่อีเมลของคุณในส่วน "ถึง"
4. ทำเครื่องหมายที่ช่อง "รวมแบบฟอร์มในอีเมล"
5. คลิกส่ง
6. เปิดอีเมลในกล่องจดหมายของคุณและคลิกขวาที่แบบฟอร์ม คลิก "ตรวจสอบ"
7. ค้นหาโค้ดที่ขึ้นต้นด้วย <table=”center align” คัดลอกและวางโค้ดลงในเทมเพลตของคุณ
8. ทดสอบอีเมลของคุณเพื่อให้แน่ใจว่าแบบสำรวจทำงาน

ในอีเมลด้านล่าง คุณสามารถดูการทำงานของ Google ฟอร์มได้ ผู้รับจะเข้าสู่รายชื่ออีเมลและขอให้กรอกแบบสำรวจสั้นๆ เกี่ยวกับการตั้งค่าสไตล์ของพวกเขา เปลี่ยนสีพื้นหลังของแบบสำรวจเพื่อช่วยให้เข้ากับเทมเพลตอีเมลของคุณได้อย่างราบรื่น อีเมลนี้สร้างขึ้นโดยใช้เทมเพลตอีเมลจาก แกลเลอ รี เทมเพลตอีเมลของเรา ดูแกลเลอรีสำหรับเทมเพลตการตลาดและธุรกรรมที่หลากหลาย

ดึงดูดผู้รับของคุณต่อไป

เมื่อพูดถึงการออกแบบอีเมลทางการตลาด จำไว้ว่าคุณค่าที่คุณมอบให้ผู้รับคือส่วนที่สำคัญที่สุดของอีเมลของคุณ

เราพบว่าเนื้อหาเชิงโต้ตอบช่วยให้ผู้รับมีส่วนร่วมโดยการสร้างประสบการณ์ที่คล้ายกับเว็บไซต์หรือแอป แต่ก็ไม่เป็นเช่นนั้นเสมอไป หากองค์ประกอบแบบโต้ตอบทำให้เสียสมาธิหรือดึงความสนใจจากข้อความที่คุณพยายามจะสื่อออกไป ก็ไม่คุ้มที่จะรวมไว้

เพื่อให้แน่ใจว่าเนื้อหาเชิงโต้ตอบของคุณได้รับการแนะนำ ต่อไปนี้คือคำแนะนำบางส่วนที่แยกจากกัน:

1. รู้ว่าคุณกำลังส่งไปยังไคลเอนต์อีเมลใด (Gmail, Yahoo, AOL, Outlook) วิธีนี้จะช่วยคุณในการพิจารณาว่าควรทดสอบองค์ประกอบเชิงโต้ตอบตั้งแต่แรกหรือไม่
2. มีตัวเลือกสำรองเสมอ หากคุณส่งอีเมลถึงผู้รับที่มีเนื้อหาเชิงโต้ตอบที่ไม่ปรากฏ ผู้รับของคุณจะมีประสบการณ์ที่ไม่ดีกับแบรนด์ของคุณ สำหรับข้อมูลเกี่ยวกับวิธีการสร้างตัวเลือกทางเลือกสำหรับเนื้อหาเชิงโต้ตอบของคุณ โปรดดูบทความของ Email on Acid
3. ทดสอบอีเมลของคุณก่อนที่จะส่ง คุณสามารถใช้เครื่องมือทดสอบอีเมล สารสีน้ำเงิน หรืออีเมลบนกรดของ SendGrid
4. อย่าทดสอบองค์ประกอบเชิงโต้ตอบมากกว่าหนึ่งรายการในแต่ละครั้ง มากเกินไปอาจทำให้เสียสมาธิ

เนื้อหาเชิงโต้ตอบเป็นหนึ่งในหลาย ๆ ด้านของกลยุทธ์การตลาดผ่านอีเมลที่คุณสามารถทดสอบได้ สำหรับข้อมูลเพิ่มเติม กลยุทธ์การตลาดดิจิทัล และช่องทางในการดึงดูดผู้รับของคุณ โปรดดูแหล่งข้อมูลเหล่านี้

• รายงานเกณฑ์มาตรฐานและการมีส่วนร่วมของอีเมลปี 2019
• กลยุทธ์การมีส่วนร่วมทางการตลาดผ่านอีเมลยอดนิยม
• โปรแกรมการฝึกอบรมการวัดผลที่สมบูรณ์ของคุณเพื่อเพิ่มความผูกพันกับอีเมลของคุณ
• การเพิ่ม SMS ลงในโปรแกรมอีเมลของคุณช่วยให้ผู้ติดต่อมีส่วนร่วม