ศิลปะพิกเซลของอีเมล: กลยุทธ์การออกแบบการป้องกันที่หายากและยอดเยี่ยมที่สุด
เผยแพร่แล้ว: 2018-09-19การบล็อกรูปภาพเป็นเรื่องปกติ โดยไคลเอนต์อีเมลบางตัวปิดใช้งานรูปภาพโดยค่าเริ่มต้น และสมาชิกบางรายปิดรูปภาพเพื่อบันทึกข้อมูลมือถือหรือด้วยเหตุผลอื่น ด้วยเหตุนี้ นักการตลาดทางอีเมลจึงจำเป็นต้องใช้เทคนิคการออกแบบเชิงป้องกันเพื่อให้แน่ใจว่าข้อความของพวกเขาจะถูกส่งต่อเมื่อปิดใช้งานรูปภาพ
การออกแบบการป้องกันซึ่งช่วยในการเข้าถึงอีเมลด้วยประกอบด้วยสามกลวิธีหลัก:
- ใช้ HTML หรือข้อความสดให้มากที่สุด แทนที่จะฝังข้อความทั้งหมดลงในรูปภาพของคุณ
- การเพิ่มข้อความ ALT ให้กับรูปภาพของคุณ—หรือดีกว่านั้นคือ ข้อความ ALT ที่มีสไตล์
- การใช้สีพื้นหลังบนเซลล์ตาราง
มาเน้นที่กลยุทธ์สุดท้ายกัน
สิ่งสำคัญอย่างหนึ่งที่เกิดขึ้นเมื่อรูปภาพถูกบล็อกคืออีเมลของคุณสูญเสียโครงสร้าง อีเมลแผ่ออกไปและทุกอย่างก็เริ่มพร่ามัวไปด้วยกัน การใช้ข้อความ HTML และการจัดรูปแบบขนาดและสีของข้อความ ALT ของคุณสามารถช่วยสร้างโครงสร้างและลำดับชั้นได้ แต่สีพื้นหลังจะมีประสิทธิภาพมากยิ่งขึ้น
การเพิ่มสีพื้นหลังให้กับเซลล์ตารางจะสร้างแบนเนอร์ บล็อกเนื้อหา และจำเป็นต่อการสร้างปุ่มกันกระสุน อีเมล Twitter นี้แสดงให้เห็นว่าสีพื้นหลังบนเซลล์ตารางสามารถรักษาความสมบูรณ์ของการออกแบบอีเมลได้อย่างไรเมื่อรูปภาพถูกบล็อก

เยี่ยมมาก แต่เซลล์ตารางที่มีสีพื้นหลังสามารถทำได้มากกว่านั้น—อีกมาก นอกจากจะใช้ร่วมกับข้อความ HTML เพื่อสร้างเนื้อหาอีเมลที่ไม่ได้รับผลกระทบจากการบล็อกรูปภาพแล้ว สีพื้นหลังของเซลล์ตารางยังสามารถใช้เป็นตัวเลือกสำรองสำหรับรูปภาพได้อีกด้วย
คุณทำได้โดยการสร้างภาพโมเสคจากชุดของตารางที่ซ้อนกันด้วยสีพื้นหลังที่ใช้กับเซลล์ตาราง จากนั้นคุณแบ่งรูปภาพเพื่อให้แต่ละส่วนพอดีกับเซลล์ตารางของภาพโมเสคของคุณ ด้วยวิธีนี้ เมื่อภาพซ้อนทับถูกบล็อกและหายไป ภาพโมเสคของเซลล์ตารางสีจะปรากฏขึ้น
ตัวอย่างของ Email Pixel Art
เพื่อแสดงให้เห็นถึงพลังของโมเสคอีเมล ต่อไปนี้คือตัวอย่างบางส่วน โดยแต่ละรายการจะแสดงอีเมลโดยเปิดใช้รูปภาพทางด้านซ้ายและปิดรูปภาพทางด้านขวา:
Mothercare สร้างภาพศิลปะพิกเซลของรถเข็นเด็กในอีเมลฉบับนี้ ซึ่งยังใช้ข้อความ ALT ที่มีสไตล์อย่างเสรีตลอด

Pizza Express ใช้ภาพพิกเซลในอีเมลวันเกิดที่เรียกใช้นี้ ซึ่งรวมถึงรูปภาพส่วนตัวและข้อความ ALT ที่มีสไตล์เฉพาะบุคคลที่สอดคล้องกัน

PlayStation New Zealand ใช้ภาพโมเสคอีเมลเพื่อสร้างสัญลักษณ์ของ Autobots โดยใช้สโลแกน "robots in disguise" ของ Transformers อย่างชาญฉลาด

ชุดชั้นในของ Benton จับภาพความรู้สึกของข้อความในอีเมลวันแม่ โดยใช้ภาพพิกเซลของอีเมลเพื่อสร้างหัวใจสีชมพูขนาดใหญ่

การออกแบบและการพิจารณาเชิงกลยุทธ์
ก่อนสร้างโมเสคอีเมล ให้พิจารณาปัญหาการออกแบบและกลยุทธ์ต่อไปนี้:
1. ภาพพิกเซลของอีเมลอาจมีจำนวนมาก ซึ่งอาจส่งผลให้อีเมลของคุณถูกตัดใน Gmail หากอีเมลมีขนาดเกิน 102 KB ดังนั้น จงทำสิ่งต่างๆ ให้เรียบง่าย โดยเน้นที่ภาพศิลปะพิกเซลที่ใช้งานได้น้อยที่สุด
ตัวอย่างเช่น หัวใจลายพิกเซลของ Benton Lingerie อาจมีรูปทรงที่โค้งมนมากขึ้นด้วยการเพิ่มจำนวนเซลล์ในตารางเป็นสองเท่าหรือสามเท่า แต่การประหารชีวิตนั้นชัดเจนมากและมีประสิทธิภาพมากตามที่เป็นอยู่
2. ภาพพิกเซลของอีเมลอาจเป็นงานพิเศษได้ ดังนั้นจึงควรจองไว้สำหรับอีเมลที่มีปริมาณมากหรือมีผลกระทบสูง นั่นหมายถึงบางทีอาจใช้สำหรับอีเมลออกอากาศหลักสำหรับการประกาศผลิตภัณฑ์ใหม่ แคมเปญ Cyber Monday และกิจกรรมใหญ่ที่คล้ายคลึงกัน แต่ยังหมายถึงการพิจารณาอีเมลเหล่านี้สำหรับอีเมลที่มีปริมาณมาก เช่น อีเมลวันเกิดของ Pizza Express ด้านบน
ในทำนองเดียวกัน คุณอาจพิจารณาองค์ประกอบเหล่านี้สำหรับองค์ประกอบอีเมลที่มีปริมาณมาก เช่น โลโก้ของคุณหรือองค์ประกอบส่วนท้าย หากคุณทำเช่นนี้ ให้ใช้งานบางส่วนเพื่อให้คุณสามารถเปลี่ยนหรืออัปเดตภาพหน้าปกในทุกอินสแตนซ์ของโลโก้หรือส่วนท้ายของคุณ
ไม่ว่าคุณจะเลือกแนวทางใด คุณต้องแน่ใจว่าจะได้รับประโยชน์จากความพยายามในการออกแบบพิเศษของคุณ
3. ภาพพิกเซลของอีเมลไม่สามารถใช้งานร่วมกับการออกแบบที่ตอบสนองได้เสมอไป โมเสคของอีเมลอาจไม่สามารถแปลจากเวอร์ชันเดสก์ท็อปเป็นเวอร์ชันมือถือได้ ทั้งนี้ขึ้นอยู่กับว่าคุณเขียนโค้ดอีเมลที่ตอบสนองอย่างไร การซ่อนและซ้อนเนื้อหาอีเมลในเวอร์ชันมือถือของคุณอาจทำให้ภาพพิกเซลอีเมลของคุณเสียหาย อย่าลืมพิจารณาสิ่งนี้เมื่อออกแบบโมเสคอีเมลของคุณ

4. ภาพพิกเซลของอีเมลไม่จำเป็นต้องพยายามแทนที่รูปภาพที่ถูกบล็อก ดังที่เราเห็นในตัวอย่างชุดชั้นใน PlayStation และ Benton งานศิลปะพิกเซลของอีเมลอาจแตกต่างจากรูปภาพในอีเมลโดยสิ้นเชิง อย่ารู้สึกว่าคุณต้องสร้างภาพฮีโร่เวอร์ชัน 8 บิตอยู่เสมอ บางครั้งการถ่ายทอดจิตวิญญาณของภาพก็มีประสิทธิภาพเช่นเดียวกัน และอาจเขียนโค้ดได้ง่ายกว่าและแสดงน้อยลง
5. อีเมลบางฉบับมีแนวโน้มที่จะบล็อกรูปภาพมากกว่า ความเป็นไปได้ที่จะมีการบล็อกรูปภาพในอีเมลนั้นไม่เหมือนกัน โอกาสของการบล็อกรูปภาพนั้นสูงขึ้นทั้งในตอนเริ่มต้นของความสัมพันธ์ทางอีเมลและในตอนท้าย
สำหรับอีเมลฉบับแรกที่คุณส่งถึงสมาชิก พวกเขาอาจมีรูปภาพที่ถูกบล็อกสำหรับผู้ส่งที่ไม่คุ้นเคย นั่นหมายความว่าคุณอาจต้องการทุ่มเทความพยายามมากขึ้นในการออกแบบการป้องกันสำหรับอีเมลต้อนรับและสำหรับอีเมลธุรกรรมของคุณ
สำหรับอีเมลที่มาสายในความสัมพันธ์—นั่นคือ หลังจากไม่มีการใช้งานเป็นระยะเวลานาน—รูปภาพอาจถูกบล็อกเนื่องจากอยู่ในโฟลเดอร์สแปมของสมาชิก นั่นหมายความว่าคุณอาจต้องการใช้ความพยายามในการออกแบบการป้องกันเป็นพิเศษในอีเมลการเข้าร่วมอีกครั้งและอีเมลการอนุญาตใหม่
ในทั้งสองกรณี ความพยายามพิเศษนั้นอาจรวมถึงภาพพิกเซลของอีเมล นอกเหนือจากการใช้ข้อความ HTML และข้อความ ALT ที่มีสไตล์อย่างเสรี
![]() | ปรับให้เหมาะสมสำหรับการบล็อกรูปภาพLitmus Builder ช่วยให้คุณสามารถเขียนโค้ดอีเมลและดูตัวอย่างอีเมลในแอปและอุปกรณ์อีเมลกว่า 70 รายการได้อย่างง่ายดาย สลับเปิดและปิดรูปภาพได้ด้วยคลิกเดียวเพื่อทำให้ภาพพิกเซลอีเมลของคุณสมบูรณ์แบบ สร้างอีเมลที่ยอดเยี่ยม → |
วิธีการสร้างภาพพิกเซลอีเมล
เมื่อคำนึงถึงสิ่งเหล่านี้ วิธีที่ดีที่สุดในการสร้างภาพพิกเซลอีเมลคืออะไร
ในการเริ่มต้น เราขอแนะนำ:
- โปรแกรมแปลงรูปภาพเป็นตาราง
- สุนัขที่เพิ่มประสิทธิภาพอีเมล
- แอปรูปภาพ-HTML
อย่างไรก็ตาม คุณอาจไม่พบสิ่งเหล่านั้นที่เป็นประโยชน์ในทุกกรณี บ่อยครั้งกว่านั้น เราคาดหวังว่าคุณจะต้องการสร้างภาพพิกเซลอีเมลของคุณด้วยตนเอง
หากนั่นคือเส้นทางที่คุณไป นี่คือขั้นตอนหลักที่คุณต้องดำเนินการ:
- ร่างภาพพิกเซลอาร์ตอีเมลที่ใช้งานได้ขั้นต่ำบนกระดาษกราฟหรือในซอฟต์แวร์การออกแบบที่คุณเลือก
- ใช้เครื่องมือสไลซ์ใน Photoshop หรือซอฟต์แวร์ออกแบบอื่นๆ เพื่อแบ่งรูปภาพของคุณออกเป็นขนาดบล็อกที่จำเป็น เพื่อสร้างโมเสคอีเมลของคุณและบันทึกเป็นรูปภาพแยกต่างหาก ใช้รูปแบบการตั้งชื่อไฟล์ที่ทำให้ง่ายต่อการรวมภาพโดยรวมเข้าด้วยกัน
- ใช้ชุดตารางที่ซ้อนกันภายในตาราง สร้างบล็อกในตำแหน่งที่คุณต้องการเพื่อรองรับการออกแบบของคุณ
- เพื่อให้แน่ใจว่าภาพที่หั่นบาง ๆ ของคุณเข้ากันได้อย่างราบรื่น ให้ระบุว่า cellpadding=“0”, cellspacing=“0” และ border=“0” ถูกตั้งค่าสำหรับตารางของคุณ
- ใช้ bgcolor ที่จำเป็นกับแต่ละเซลล์ในตารางของคุณ
- ดูตัวอย่างอีเมลของคุณโดยปิดรูปภาพเพื่อให้แน่ใจว่ามีการแสดงผลตามที่ตั้งใจไว้
นี่เป็นตัวอย่างที่ดีของภาพพิกเซลอีเมลจากจดหมายข่าว EmailWeekly ของ Action Rocket เลือก "สลับรูปภาพ" ในอินเทอร์เฟซ Litmus Builder เพื่อดูอีเมลที่ปิดรูปภาพ
กลยุทธ์ที่หายากและไม่คาดคิด
นักการตลาดผ่านอีเมลเข้าใจถึงความจำเป็นในการออกแบบปิดรูปภาพ เราทราบดีว่าเนื่องจากแบรนด์ 83% ใช้ข้อความ ALT สำหรับรูปภาพอีเมลของตนเสมอหรือบ่อยครั้ง ตามการสำรวจสถานะอีเมลประจำปี 2018 ของ Litmus ที่มีนักการตลาดเกือบ 3,000 ราย
อย่างไรก็ตาม ในขณะที่การเพิ่มข้อความ ALT นั้นค่อนข้างง่าย การสร้างภาพพิกเซลอีเมลก็ไม่ใช่สิ่งอื่นๆ ด้วยเหตุนี้ แบรนด์เกือบ 77% ไม่เคยใช้ภาพโมเสคของอีเมล

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