ป้ายกำกับ: เนื้อหา

HTML: mailto ส่งอีเมลโดยอัตโนมัติHTML: mailto ส่งอีเมลโดยอัตโนมัติ

การใช้ mailto: ใน HTML เป็นวิธีที่ง่ายและคลาสสิกที่สุดในการอนุญาตให้ผู้เข้าชมเว็บไซต์ติดต่อคุณผ่านอีเมลโดยตรง โดยระบบจะเปิดโปรแกรมรับส่งอีเมล ( เช่น Outlook, Apple Mail หรือ Gmail ) ขึ้นมาโดยอัตโนมัติ


โครงสร้างพื้นฐาน ( Basic Syntax )

ใช้แท็ก <a> ร่วมกับ href="mailto:..."

<a href="mailto:[email protected]">ส่งอีเมลหาเรา</a>

การใส่ชื่อเรื่องและเนื้อหา ( Subject & Body )

คุณสามารถกำหนดค่าเริ่มต้นให้กับอีเมลได้ เพื่อให้ผู้ใช้งานไม่ต้องพิมพ์เองทั้งหมด โดยใช้ Query Parameters ( ? และ & )

  • Subject: กำหนดหัวข้ออีเมล
  • Body: กำหนดเนื้อหาในอีเมล
<a href="mailto:[email protected]?subject=สอบถามบริการ&body=สวัสดีครับ ผมสนใจบริการของคุณ">
  คลิกเพื่อสอบถามข้อมูล
</a>

การส่งหาหลายคน ( CC & BCC )

หากต้องการส่งหาผู้รับหลายคน หรือสำเนาถึงใครบางคน สามารถทำได้ดังนี้

Parameterคำอธิบาย
ccสำเนาอีเมล ( Carbon Copy )
bccสำเนาลับ ( Blind Carbon Copy )
Parameter,คำอธิบาย
cc,สำเนาอีเมล ( Carbon Copy )
bcc,สำเนาลับ ( Blind Carbon Copy )

ข้อควรระวังและการจัดการตัวอักษรพิเศษ

หากเนื้อหาหรือหัวข้อมี ช่องว่าง ( Space ) หรือ ตัวอักษรพิเศษ แนะนำให้ใช้ URL Encoding เพื่อป้องกันบั๊กในการแสดงผล

  • ช่องว่าง () เปลี่ยนเป็น %20
  • การขึ้นบรรทัดใหม่ ใน Body ให้ใช้ %0D%0A
<a href="mailto:[email protected]?subject=Hello&body=บรรทัดที่1%0D%0Aบรรทัดที่2">
  ส่งอีเมลแบบหลายบรรทัด
</a>

ข้อดีและข้อเสียที่ควรทราบ

ข้อดีข้อเสีย
ง่าย: ไม่ต้องเขียนโปรแกรมฝั่ง Server ( PHP / Node.js)Spam: Bot สามารถมาดูดอีเมลใน Code ไปส่งสแปมได้
รวดเร็ว: ผู้ใช้ใช้ Account ตัวเองส่งได้ทันทีUX: ถ้าผู้ใช้ไม่ได้ตั้งค่าโปรแกรมเมลในเครื่อง ลิงก์อาจจะไม่ทำงาน

อ่านเพิ่มเติม