วิธีการสร้าง HTML อีเมล: ขั้นตอนตามคู่มือขั้นตอน

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

คุณสมบัติของการสร้าง

คนทันสมัยได้รับรายวันเฉลี่ย 5-6 และบางครั้งถึง 10 อีเมล ซึ่งหมายความว่าคุณจะต้องน้อยกว่าที่สองจะมีเวลาที่จะดึงดูดความสนใจของผู้รับก่อนที่มันจะไปอ่านจดหมายดังต่อไปนี้ มิฉะนั้นการส่งแบบ HTML อีเมลของคุณจะไม่ได้ผลสมบูรณ์และคุณก็เสียเวลา

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

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

สิ่งที่ควรเป็นแม่แบบตัวอักษร

เมื่อรูปแบบของเอกสารที่ตั้งใจจะส่งผู้สื่อข่าวควรเป็นไปตามข้อกำหนดต่อไปนี้:

• มันควรจะทำค่อนข้างแคบเช่น. อีในขนาดไม่เกินช่วง 500-600 พิกเซลที่ให้การแสดงผลที่ถูกต้องของข้อความและเนื้อหาอื่น ๆ บนอุปกรณ์ประเภทใด ๆ
• คุณจำเป็นต้องใช้ตัวอักษรขนาดใหญ่พอสำหรับทุกข้อมูลตัวอักษรเช่นเดียวกับ iOS อุปกรณ์ HTML-mail จะอึดอัดในการอ่านถ้าขนาดตัวอักษรอย่างน้อย 13 พิกเซล
• องค์ประกอบที่คุณสามารถคลิกเพื่อทำควรมีขนาดใหญ่พอและฉนวนจากการเชื่อมโยงที่ใกล้เคียงที่สุด ในกรณีนี้ผู้รับสามารถเปิดใช้งานในครั้งแรกลอง

การอบรม

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

สร้างและบันทึกเอกสาร

ก่อนที่คุณจะเขียนข้อความของตัวอักษรที่คุณจะต้องไปที่:

• เปิดเป็นที่นิยมมากโปรแกรมออกแบบ HTML-อีเมล Dreamweaver CS3 (DW);
• สร้างเอกสารโดยการเลือกชนิดของ "การเปลี่ยน HTML 4.01 »หนึ่ง
• บันทึกไฟล์ที่มีนามสกุล«.html»;
• ในเมนูด้านบนเพื่อค้นหาคำสั่งแก้ไข;
• ลบเห็บจากการตรวจสอบกล่อง "ใช้ CSS แทนแท็ก»เดอะ

ขั้นตอนตามคู่มือขั้นตอน

ตอนนี้เรามาดูวิธีการสร้าง HTML อีเมล การทำเช่นนี้:

• อย่างต่อเนื่องเปิดเมนูแท็บ "แทรก" และ "ตาราง" และเปิดเผยค่าพารามิเตอร์ที่จำเป็นของตาราง ยกตัวอย่างเช่นบรรทัด - 2 คอลัมน์ - 1, ความกว้าง - 700 ส่วนหัว - ด้านบน ขอบเขตที่สามารถตั้งค่าและคุณสามารถทำได้โดยไม่ต้องให้พวกเขาระบุ 0
• รูปแบบส่วนหัวของข้อความ ตั้งแต่ HTML ตัวอักษรที่มีไว้สำหรับเป็นจำนวนมากได้รับผลประโยชน์เพื่อใช้ประกอบ [first_name] แทนชื่อของผู้รับที่ต้องการ
• ในหน้าต่างที่ต่ำกว่า "คุณสมบัติ" ใส่ค่าพารามิเตอร์ที่จำเป็นสำหรับแบบอักษรขนาดและสีของข้อความชื่อและ สีพื้นหลัง
• "ออก" จากข้อมูลส่วนหัว ที่ด้านล่างของหน้าจอเพื่อเลื่อนเคอร์เซอร์ใส่ตัวเลือก "ศูนย์กลาง" และ "ที่อยู่ตรงกลาง."
• ใส่ข้อความที่จัดทำหรือ "เขียน" มันขวาในโปรแกรม DW โดยการเลือกชนิดและ ขนาดตัวอักษร และการจัดตำแหน่งของข้อความบนหน้าเว็บ

สร้างการเชื่อมโยงหลายมิติ

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

วิธีการแทรกภาพ

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

ที่จะออกดังกล่าวจบลงอย่างมีความสุข:

• แทรกลงด้านล่างของข้อความที่ลงในตารางฐานอีก 3 และคอลัมน์ 0 พารามิเตอร์สำหรับพิกเซลเขตแดน;
• วางเคอร์เซอร์ในตารางที่พวกเขาต้องการที่จะเห็นภาพ;
• เครื่องหมายในหน้าต่างที่ต่ำกว่า "กลาง" และ "ขอบบน" สำหรับแต่ละส่วน;
• เลือกจากด้านบนแท็บเมนู "แทรก";
• ไม่คลิกที่จารึก "ภาพ" ในเมนูป๊อปอัพ, วางที่อยู่ติดต่อคัดลอก;
• กด«ตกลง» 2 ครั้ง

ทบทวน

ตอนที่คุณรู้วิธีการทำ HTML ตัวอักษรที่คุณควรตรวจสอบให้แน่ใจว่าผู้รับจะเห็นมันในรูปแบบที่ถูกต้อง ด้วยเหตุนี้ก่อนที่จะส่งคุณต้องการที่จะเห็นการทำงานของคุณในเบราว์เซอร์ Dreamweaver CS3 การทำเช่นนี้ให้คลิกที่ไอคอนกับโลกในเมนูด้านบนตรงกลาง ถ้าแทนของตัวอักษรที่ปรากฏบนหน้าจอ Abracadabra คุณควรใส่ในการตั้งค่าเบราว์เซอร์ของคุณ avtokodirovku

การเข้ารหัส

จากส่วน "โครงการ" และไปที่ส่วนรหัส - "โค้ด" ในหน้าต่างที่แยกออกจากกันและคัดลอกสิ่งที่อยู่ในระหว่างแท็ก และ บันทึกไฟล์ ถัดไปแทรก HTML โค้ด

ส่งอีเมลแบบ HTML

เพื่อให้จดหมายเปิด "Smartresponder" (อาร์) แล้ว:

• เลือกหรือสร้างอีเมลใหม่โดยการกรอกสตริง "ชื่อ" และ "ที่อยู่ผู้ส่ง."
• เติมบรรทัด "รูปแบบของตัวอักษร";
• เครื่องหมายในเมนูด้านซ้ายบน HTML รหัส;
• โค้ดฝังคัดลอกไปยังโปรแกรม DW-รหัสในสนามใหญ่ "ที่มา";
• ตรวจสอบความถูกต้องของการแสดงผลความหมายของการเป็นเครื่องมือ "Preview" นั้น
• ลบรูปแบบข้อความของตัวอักษร;
• ทดสอบสแปมโดยใช้ปุ่มที่เหมาะสมถัดจากปุ่ม "ส่ง"

แม่แบบที่นิยมหลาย

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

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

วิธีการแทรก HTML เป็น

ให้เราพิจารณาปัญหาที่แตกต่างกันเล็กน้อย การแทรกโค้ด HTML ในอีเมลเช่น Gmail โดยใช้เช่นในตัวอย่างด้านล่างราว์เซอร์ Google Chrome คุณควร:

• คลิกที่ปุ่ม«F12»หรือเลือกลำดับที่เหมาะสมของคำสั่งในเมนู;
• ในการเปิดหน้าต่าง Gmail รหัสปัจจุบันหน้าของลูกค้าพบว่าสถานที่ที่จะแทรกลงใน HTML ตัวอักษรให้คลิกขวาและเลือก«แก้ไขเป็น HTML»
• วางโค้ด HTML;
• กดรวมกันของสองปุ่ม Ctrl «»และ«ใส่»

เพื่อจุดประสงค์เดียวกันคุณสามารถดาวน์โหลดง่ายต่อการ ispolzovnii โปรแกรม Thunderbird Mozilla ด้วยคุณสามารถสร้างตัวอักษรแล้วก่อนอื่นให้เลือก "แทรก" แล้ว "HTML ที่" และวางรหัสไปรษณีย์ของคุณ

เครื่องมือ

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

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

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