วิธีส่ง HTML ที่กำหนดเองด้วย Gmail

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

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

การเปลี่ยนแปลงนี้ทำให้ผู้ใช้สำรวจวิธีการอื่นในการส่งอีเมล HTML ที่กำหนดเองผ่าน Gmail ซึ่งเราจะเจาะลึกในบทความนี้

ข้ามไปที่ส่วนต่างๆ ที่นี่ หรืออ่านคู่มือฉบับเต็ม:

• การส่งอีเมล HTML ที่กำหนดเองผ่าน Gmail
• การคัดลอก HTML ที่แสดงผลโดยตรงไปยัง Gmail
• ข้อจำกัดในการใช้เทมเพลต HTML แบบกำหนดเอง
• อีเมลข้อความธรรมดากับอีเมล HTML
• ส่งอีเมล HTML ส่วนบุคคลโดยใช้ Mailmeteor!

การส่งอีเมล HTML ที่กำหนดเองผ่าน Gmail

Gmail ใช้เครื่องมือแก้ไข What You See Is What You Get (WYSIWYG) ซึ่งหมายความว่าการส่งโค้ด HTML แบบ Raw โดยตรงไม่ใช่ตัวเลือกที่ใช้ได้ เพราะผู้รับจะเห็นโค้ด HTML แบบดิบจริงๆ แทนที่จะเป็นเอกสารที่แสดงผล

ตัวอย่างเช่น ลองดูเทมเพลตอีเมลจำลองนี้

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

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

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

การคัดลอก HTML ที่แสดงผลโดยตรงไปยัง Gmail

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

1. เตรียมโค้ด HTML ของคุณ
   • เปิดตัวแก้ไขข้อความ เช่น Notepad (Windows) หรือ TextEdit (Mac)
   • เขียนหรือวางโค้ด HTML ของคุณลงในโปรแกรมแก้ไขข้อความ โค้ดนี้อาจประกอบด้วยข้อความ รูปภาพ ลิงก์ และการจัดรูปแบบ เช่นเดียวกับหน้าเว็บมาตรฐาน แต่มีข้อจำกัดบางประการซึ่งเราจะกล่าวถึงในภายหลัง
   • บันทึกไฟล์ด้วยนามสกุล “.html” เช่น “template.html”
2. ดูตัวอย่างในเว็บเบราว์เซอร์
   • ดับเบิลคลิกไฟล์ HTML ที่คุณเพิ่งสร้างขึ้นเพื่อเปิดในเว็บเบราว์เซอร์เริ่มต้นของคุณ ซึ่งจะทำให้อีเมลของคุณปรากฏต่อผู้รับทุกประการ
   • คุณสามารถกลับไปที่โปรแกรมแก้ไขข้อความและเปลี่ยนแปลงเนื้อหาได้หากต้องการ เพียงอย่าลืมบันทึกไฟล์หลังจากที่คุณทำการเปลี่ยนแปลงเสร็จแล้ว และรีเฟรชหน้าเบราว์เซอร์เพื่ออัปเดตการเปลี่ยนแปลงของคุณ
3. เลือกทั้งหมดและคัดลอก
   • ในเบราว์เซอร์ ให้กด Ctrl+A (Windows) หรือ Cmd+A (Mac) เพื่อเลือกเนื้อหาทั้งหมดในอีเมล HTML
   • จากนั้นกด Ctrl+C (Windows) หรือ Cmd+C (Mac) เพื่อคัดลอกเนื้อหาที่เลือก คุณยังสามารถคลิกขวาและเลือกคัดลอกจากเมนูได้อีกด้วย
4. วางลงใน Gmail
   • เปิด Gmail และเริ่มเขียนอีเมลใหม่
   • คลิกที่เนื้อหาอีเมลที่คุณต้องการแทรกเนื้อหาอีเมล HTML ของคุณ คุณไม่สามารถแทรก HTML ในบรรทัดหัวเรื่องได้ ดังนั้นตัวเลือกเดียวของคุณคือเนื้อหาของอีเมล
   • ตอนนี้ ให้กด Ctrl+V (Windows) หรือ Cmd+V (Mac) เพื่อวางเนื้อหาที่คุณคัดลอกจากเบราว์เซอร์ หรือคุณสามารถคลิกขวาและเลือกวางจากเมนู
   • ควรวางอีเมล HTML ลงในโปรแกรมแก้ไข Gmail โดยตรง และคุณจะเห็นว่ามันแสดงผลเหมือนในภาพด้านล่าง
5. ส่งอีเมล์
   • กรอกอีเมลของคุณด้วยหัวเรื่อง ผู้รับ และข้อความหรือองค์ประกอบเพิ่มเติม
   • คลิกปุ่ม "ส่ง" จากนั้นอีเมล HTML ที่คุณกำหนดเองจะถูกส่งไปยังผู้รับ

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

การใช้ส่วนขยายเบราว์เซอร์ตัวแก้ไข HTML

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

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

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

ข้อจำกัดในการใช้เทมเพลต HTML แบบกำหนดเอง

น่าเสียดายที่แม้จะมีพลังในการเขียนโค้ด HTML ของคุณเอง แต่ก็มีข้อจำกัดที่คุณต้องทราบก่อนที่จะเริ่มการเดินทางครั้งนี้ นี่คือสิ่งที่คุณต้องรู้:

บอกลาแบบอักษร!

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

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

รูปภาพจะต้องถูกโฮสต์แบบสาธารณะ

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

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

ไม่รองรับสไตล์ชีตภายนอก

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

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

ยึดติดกับเค้าโครงตามตาราง

แม้ว่า HTML สมัยใหม่จำนวนมากจะใช้องค์ประกอบ <div> สำหรับเลย์เอาต์และการจัดรูปแบบ แต่อีเมลยังคงใช้เลย์เอาต์แบบตารางแบบเก่าที่ดี ดังนั้น หากคุณต้องการสร้างองค์ประกอบตารางหรือกล่อง คุณจะต้องสร้างโดยใช้แท็กตารางต่างๆ เช่น <table> , <tr> และ `<td>

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

อีเมลข้อความธรรมดากับอีเมล HTML

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

ให้เราเน้นความแตกต่างที่สำคัญระหว่างรูปแบบอีเมลทั้งสองนี้:

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

ส่งอีเมล HTML ส่วนบุคคลโดยใช้ Mailmeteor!

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

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