แนวโน้มการออกแบบอีเมลที่ดีจริงๆ: การบันทึกการสัมมนาผ่านเว็บ + ถาม & ตอบ
เผยแพร่แล้ว: 2019-12-09ผู้ติดตามของคุณเต็มไปด้วยข้อความนับพันจากช่องทางต่างๆ และทำให้แบรนด์ของคุณโดดเด่นได้ยากกว่าที่เคย วิธีหนึ่งที่จะตัดเสียงรบกวน? สร้างความประทับใจให้พวกเขาด้วย การออกแบบอีเมล ที่ดีจริงๆ
ในการสัมมนาผ่านเว็บนี้ เราได้พิจารณาแนวโน้มการออกแบบอีเมลตลอดหลายปีที่ผ่านมา อีเมลมีลักษณะอย่างไรในต้นปี 2000 เทรนด์ใดบ้างที่เข้าร่วมในแวดวงผู้ชนะในปี 2019 และอะไรจะเกิดขึ้นในปี 2020 หรือปี 2030? ทีม Really Good Emails เข้าร่วมกับเราเพื่อสำรวจช่องทางหน่วยความจำการออกแบบอีเมล และช่วยเราคาดการณ์สิ่งที่จะเกิดขึ้นต่อไป
ไม่มีโอกาสได้ชมการสัมมนาผ่านเว็บแบบสดใช่หรือไม่ ไม่ต้องกังวล คุณสามารถ เข้าถึงการบันทึกแบบเต็ม ได้ตลอดเวลาและอ่านคำถาม & คำตอบด้านล่าง
ถาม-ตอบ
ขอบคุณมากสำหรับทุกคนที่ถามคำถามระหว่างการสัมมนาผ่านเว็บ! ต่อไปนี้คือบทสรุปของคำตอบสำหรับคำถามยอดนิยม พร้อมด้วยคำถามบางข้อที่เราไม่ได้รับระหว่างการสัมมนาผ่านเว็บแบบสด มีคำถามเพิ่มเติมหรือไม่? กรุณาทิ้งไว้ในความคิดเห็น
แนวโน้มการออกแบบอีเมลเหล่านี้แตกต่างกันอย่างไรระหว่าง B2C และ B2B
ไมค์ เนลสัน : แนวโน้มเหล่านี้มีความสอดคล้องกันใน B2B, B2C และองค์กรไม่แสวงหากำไร เพียงเพราะคุณอยู่ในแนวดิ่งไม่ได้หมายความว่าคุณไม่สามารถใช้แนวคิดการออกแบบของแนวอื่นได้ ประเภทธุรกิจเดียวที่ดูเหมือนว่าจะมีความรู้สึกในแบบของตัวเองคืออีเมลของรัฐบาล ซึ่งโดยทั่วไปแล้วจะมีข้อความหนักมาก
อะไรคือวิธีที่ดีที่สุดในการใช้พื้นที่สีขาว ตอนนี้ Dark Mode มีแนวโน้มที่จะทำให้มันยากขึ้น?
ไมค์ : ดูเหมือนจะสับสนเล็กน้อยที่จะเรียกมันว่า "ช่องว่าง" เมื่อมันหมายถึงช่องว่างจริงๆ ในบริบทนั้น ไม่สำคัญว่าจะเป็นสีขาวหรือสีเข้ม คุณเพียงแค่ต้องการพื้นที่บางส่วนสำหรับแต่ละองค์ประกอบ
Lily Worth : ฉันคิดว่าคำว่า white space มักจะถูกมองว่าเป็นเนกาทีฟ space ซึ่งก็สะดวกดีเพราะไม่ได้เจาะจงสี
เคล็ดลับเกี่ยวกับวิธีการรวมองค์ประกอบการออกแบบภาพที่รอบคอบมากขึ้นในอีเมลที่มีรูปแบบข้อความธรรมดา?
Jason Rodriguez : สำหรับอีเมลที่มีรูปแบบข้อความธรรมดา จะต้องพิจารณาถึงลำดับชั้นจริงๆ ดังนั้นจึงไม่ใช่เพียงข้อความยาวๆ ที่ผู้ติดตามของคุณอาจมองไม่เห็น หากคุณสามารถสร้างความสามารถในการสแกนโดยการสร้างส่วนที่มีหัวเรื่องต่างกัน และใช้น้ำหนักหรือข้อความที่มีสไตล์ต่างกันเพื่อทำให้หัวเรื่องเหล่านั้นโดดเด่น ก็ช่วยได้เช่นกัน
ไมค์ : ถ้าคุณไม่เขียนบทความขนาดยาวและใช้อีเมลเป็นสื่อ ให้พยายามจำกัดย่อหน้าของคุณให้เหลือเพียงไม่กี่ประโยคหรือสองสามประโยค ใช้หัวข้อย่อยที่คุณสามารถสรุปแนวคิดได้ ใช้อักขระพิเศษ เช่น “###################” เพื่อสร้างการแบ่งภาพระหว่างแนวคิด เรามีตัวอย่างที่ดีบางส่วนของข้อความและรูปแบบตัวอักษรอีเมลในคอลเลกชันนี้ RGE
ลิลลี่ : ฉันเห็นด้วยกับเจสัน การใช้ขนาดและน้ำหนักของแบบอักษรที่แตกต่างกัน—และบางทีอาจใช้รูปแบบแบบอักษรที่แตกต่างกันสองสามแบบเพื่อสร้างลำดับชั้น—จะช่วยทำให้อีเมลสามารถสแกนและย่อยได้ คุณสามารถสร้างสรรค์ด้วยตัวอักษรได้อย่างแน่นอน มีบางตัวอย่างที่ดีของอีเมลข้อความเท่านั้นที่ด้านล่างของโพสต์บล็อกของเราเกี่ยวกับตัวอักษรตัวหนา
มีวิธีทำให้สามารถเข้าถึงแอนิเมชั่นและ GIF แบบเคลื่อนไหวได้หรือไม่
ลิลลี่: ภาพเคลื่อนไหวควรมีบทบาทสนับสนุนดังนั้นการส่งข้อความที่สำคัญและเรียกร้องให้ดำเนินการควรมีอยู่ในเนื้อหาที่เขียน หากแอนิเมชั่นมีข้อมูลที่แยกจากกันและสำคัญ ก็ควรแสดงในแท็ก ALT
สำหรับตัวอนิเมชั่นเอง อัตราการกะพริบของเนื้อหาระหว่าง 2 Hz ถึง 55 Hz อาจเป็นอันตรายต่อผู้ใช้ด้วยโรคลมบ้าหมูที่ไวต่อแสง นอกจากนี้ ผู้ใช้ที่มีความบกพร่องทางสายตาอาจมีปัญหาในการอ่านหรือตรวจสอบเนื้อหาใน GIF ก่อนที่ภาพเคลื่อนไหวจะเปลี่ยนแปลง ตรวจสอบให้แน่ใจว่า GIF แบบเคลื่อนไหวของคุณมีการเปลี่ยนภาพที่ราบรื่น หรือไม่ทำให้เคลื่อนไหวจากเฟรมหนึ่งไปอีกเฟรมหนึ่งในอัตราที่สูง
Jason : GIF เป็นสิ่งที่ตกแต่งอย่างสวยงามสำหรับแคมเปญส่วนใหญ่ แต่ถ้าไม่โหลด GIF นั้น ถ้าไม่มีเมื่อสมาชิกของคุณเปิดอีเมล ข้อความของคุณก็ยังสมเหตุสมผลอยู่ไหม หากมีคนใช้โปรแกรมอ่านหน้าจอเพื่ออ่านอีเมลของคุณ พวกเขาจะเข้าใจข้อความของคุณหรือไม่ อย่างที่ลิลลี่พูด ถ้า GIF ให้ค่าที่ไม่ซ้ำ อย่าลืมใส่ข้อความนั้นในแท็ก ALT เพื่อให้สมาชิกทุกคนสามารถเข้าถึงข้อมูลนั้นได้
มีเครื่องมือใดบ้างที่คุณอยากแนะนำให้สร้างภาพเคลื่อนไหวและ GIF
Matt Helbig : เรายังคงเห็นแบรนด์ต่างๆ ใช้เครื่องมืออย่าง Adobe Photoshop หรือ After Effects การเพิ่ม ภาพเคลื่อนไหว CSS หรือเอ ฟเฟกต์โฮเวอร์ อาจเป็นวิธีที่ดีในการเพิ่มการเคลื่อนไหวในอีเมลของคุณด้วยโค้ดสองสามบรรทัด
Lily : ในการสร้างแอนิเมชั่นที่เรานำเสนอในอีเมล Litmus เราใช้ Adobe Animate ซอฟต์แวร์นี้ช่วยให้เราสร้างภาพเคลื่อนไหว GIF, PNG และ HTML5 ผู้ที่เคยใช้งาน Flash มาก่อนจะพบว่าซอฟต์แวร์นี้คุ้นเคย

Whitney Rudeseal Peet : หากคุณต้องการใช้งาน PNG แบบเคลื่อนไหว (APNGs) ปัจจุบันยังไม่สามารถบันทึกภาพเคลื่อนไหวออกเป็น APNG ด้วย Adobe Photoshop หรือ Adobe Animate เมื่อเรารวม APNG ไว้ในอีเมล เราใช้ Adobe Animate เพื่อสร้างแอนิเมชั่น แต่เราส่งออกแต่ละเฟรมเป็น PNG เดียว เพื่อที่จะแปลงทั้งหมดของ PNGs บุคคลเหล่านั้นเป็น APNG คุณสามารถใช้เครื่องมือเช่น PNG Animator หรือทางเลือกฟรีนี้จาก ezgif.com
ภาพประกอบที่กำหนดเองใช้กับผู้ชม B2B และ B2C หรือส่วนใหญ่เป็น B2C
ไมค์ : พวกเขาเกือบจะเท่ากัน ตัวอย่างที่เราใช้ในการสัมมนาผ่านเว็บอาจดูคล้ายกับรูปแบบผู้บริโภคมากกว่า แต่ทั้งหมดนี้เป็นของบริษัท B2B: Mailchimp (การขายบริการอีเมลให้กับบริษัทอื่น), HelpScout (การขายเทคโนโลยีการบริการลูกค้าให้กับธุรกิจ) และ Bulb (การขายพลังงานให้กับธุรกิจ) .
Jason : เช่นเดียวกับทุกอย่างในอีเมล มันขึ้นอยู่กับแบรนด์และผู้ชมของคุณ และเป้าหมายของคุณสำหรับแต่ละแคมเปญคืออะไร ดังนั้น หากคุณอยู่ในอุตสาหกรรมที่สิ่งต่างๆ เช่น ภาพประกอบที่กำหนดเอง อาจถูกมองว่าไม่จริงจังนัก ก็อย่าใช้มัน แต่อย่าลืมว่ายังมีโอกาสในการทำลายอุตสาหกรรมอีกด้วย แบรนด์อย่าง Simple หรือ Stripe ในอุตสาหกรรมการเงินเปิดรับเทรนด์การออกแบบที่ใหม่กว่า เนื่องจากสามารถนำเสนอแนวคิดที่เป็นนามธรรมได้ชัดเจนยิ่งขึ้น และให้บุคลิกภาพแก่แบรนด์ของตนเล็กน้อย ดังนั้นอย่าพูดว่าไม่เคย
ยังมีความท้าทายในการแสดงคุณลักษณะเชิงโต้ตอบในไคลเอนต์อีเมลหรือไม่
วิทนีย์ : สำหรับหลายๆ บริษัท การสนับสนุนผู้ให้บริการกล่องขาเข้าที่ไม่สอดคล้องกันและจำกัดเป็นสาเหตุหลักที่พวกเขาไม่ส่งอีเมลแบบโต้ตอบเพิ่มเติม น่าเสียดายที่ฟีเจอร์เช่นเอฟเฟกต์โฮเวอร์และภาพหมุนแบบโต้ตอบยังคงเป็นเช่นนั้น ด้วยเหตุนี้ หากคุณยังคงต้องการใช้การโต้ตอบ คุณไม่ต้องกลัวว่าจะมีการสนับสนุนที่จำกัด หากคุณมีทางเลือกสำรอง ดูบล็อกโพสต์ของเราเกี่ยวกับทาง เลือกอื่นสำหรับอีเมลเชิงโต้ตอบ เพื่อเริ่มต้น
แล้ว Dark Mode จะมอบประสบการณ์การช่วยสำหรับการเข้าถึงที่ดีขึ้นได้อย่างไร
ไมค์ : ยังมีงานวิจัยมากมายในพื้นที่นี้ การพูดว่า "โหมดมืด" นั้นดูสบายตาขึ้นเนื่องจากข้อความทั่วไปไม่ถูกต้อง แต่ก็ช่วยได้บ้าง—หรืออาจแย่กว่านั้นสำหรับคนอื่นๆ เช่น ผู้ที่มีสายตาเอียงอย่างรุนแรง สำหรับผู้ที่มีปัญหาในการนอนหลับ การใช้โหมดมืดในตอนเย็น พบว่ามีประโยชน์ มากกว่าหน้าจอที่สว่างกว่า ซึ่งอาจส่งผลต่อจังหวะชีวิตของคุณ โหมดมืดยังมีให้เห็นกันทั่วไปว่าเป็นเสียสมาธิน้อยลงและใช้ในการช่วยให้ผู้คนมุ่งเน้น แต่ถ้าคอนทราสต์แรงเกินไป เช่น พื้นหลังสีดำจริงและข้อความสีขาวจริง จะอ่านได้ยากขึ้น สำหรับผู้ที่มีความบกพร่องในการอ่าน สิ่งนี้สามารถบรรเทาได้โดยใช้พื้นหลังสีเข้ม แต่ใช้บางอย่างเช่นสีเทาเข้มกับสีครีมสำหรับแบบอักษร
คุณคิดว่าเทรนด์การออกแบบเหล่านี้จะใช้ได้กับผู้ชมที่มีอายุมากกว่า 65 ปีขึ้นไปอย่างไร
ไมค์ : เราไม่ได้กล่าวถึงเรื่องนี้โดยเฉพาะ แต่อีเมลที่เราแสดงให้เห็นในการสัมมนาผ่านเว็บและเห็นใน อีเมลที่ดีจริงๆ ได้เพิ่มขนาดตัวอักษรขึ้นอย่างมากเมื่อเทียบกับเมื่อไม่กี่ปีที่ผ่านมา นี่คือสิ่งที่กลุ่มประชากรที่มีอายุมากกว่ายอมรับ นอกจากนี้ยังมีความคุ้นเคยว่าแนวโน้มใดที่นำไปสู่การออกแบบของ Bauhaus และ Swiss
ลิลลี่ : อย่างที่ไมค์แนะนำ สไตล์ย้อนยุคที่มีแนวโน้มว่าจะเป็นที่นิยมในปี 2020 นั้นน่าจะเป็นเรื่องที่ชวนให้คิดถึงสำหรับกลุ่มประชากรที่มีอายุมากกว่า การทำให้เข้าใจง่ายยังมีแนวโน้มที่จะเป็นประโยชน์ต่อผู้ชมของคุณ เนื่องจากอีเมลมีความยุ่งเหยิงน้อยลง ทำให้ข้อความและคำกระตุ้นการตัดสินใจอ่านและทำความเข้าใจได้ง่ายขึ้น
แม้ว่าการพิมพ์จะเป็นวิธีที่ดีในการสร้างความโดดเด่น แต่ก็ยากที่จะปรับให้เหมาะสมเมื่อไคลเอนต์อีเมลไม่รองรับแบบอักษรจำนวนมาก คุณคิดว่าการเปลี่ยนแปลงนี้เร็ว ๆ นี้?
Lily : ขออภัย เราไม่สามารถทราบได้ว่าจะมีการสนับสนุนเพิ่มเติมสำหรับแบบอักษรเว็บหรือไม่ แต่เราต้องการให้เป็นเช่นนั้นอย่างแน่นอน เครื่องมือที่มีประโยชน์นี้ อาจช่วยให้คุณค้นหาทางเลือกที่เหมาะสมเพื่อใช้กับแบบอักษรของเว็บได้ในระหว่างนี้
คุณคิดว่าการปรับเปลี่ยนในแบบของคุณจะเป็นอย่างไรเมื่อพูดถึงเทรนด์ใหม่เหล่านี้
Matt : เราคาดหวังว่าจะได้เห็นแบรนด์ต่างๆ ปรับแต่งอีเมลแต่ละส่วนให้เป็นส่วนตัวมากขึ้น ลูกค้าจะแลกเปลี่ยนข้อมูลเพื่อประสบการณ์ที่ดีขึ้น รายงานที่เข้าใจง่าย ข้อเสนอที่ไม่เหมือนใคร และการตอบรับทำให้ลูกค้ารู้สึกวีไอพี นักการตลาดผ่านอีเมลควรเปลี่ยนข้อมูลลูกค้าให้เป็นประโยชน์และเกี่ยวข้องกับสมาชิกมากที่สุด
นอกจากนี้ ต่อไปนี้คือคอลเล็กชันอีเมลที่ดีจริงๆ สำหรับแนวโน้มที่เรากล่าวถึงในการสัมมนาผ่านเว็บ:
- ภาพประกอบที่กำหนดเอง
- การออกแบบภาพที่รอบคอบมากขึ้น
- การออกแบบที่เข้มขึ้น
- สีที่โดดเด่นกว่า
- อีเมลเคลื่อนไหว
