แท็ก meta
แท็ก meta กำหนดคำสั่งบริการบางอย่าง
ให้กับเบราว์เซอร์หรือเครื่องมือค้นหา:
การเข้ารหัสของหน้า คำอธิบายหน้าสำหรับ
เครื่องมือค้นหา ผู้เขียนหน้าเว็บ และอื่นๆ
หลักการทำงานของแท็กเป็นดังนี้ (มีข้อยกเว้นบางประการ):
กำหนดชื่อคำสั่ง (ในแอตทริบิวต์ name
หรือในแอตทริบิวต์ http-equiv) และค่า
ของคำสั่งถูกกำหนดในแอตทริบิวต์ content
โดยพื้นฐานแล้วแท็กนี้ประกอบด้วยกลุ่มของ
แท็ก (คำสั่ง) ซึ่งมีชื่อเรียกรวมกันว่า เมตาแท็ก
แท็ก meta ไม่ต้องการแท็กปิด
ควรใช้แท็ก meta ภายใน
แท็ก head
ตัวอย่างการใช้งานที่นิยม
การเข้ารหัสเอกสาร
ในปัจจุบันมาตรฐานการเข้ารหัสคือ
utf-8 ในทางทฤษฎีแล้ว เราสามารถไม่กำหนด
การเข้ารหัสอย่างชัดเจน (ผ่านแท็ก
meta) ก็ได้
- เบราว์เซอร์ควรเข้าใจคุณได้ ในทางปฏิบัติ
ผมไม่แนะนำให้ทำเช่นนั้น - การเข้ารหัส
อาจเพี้ยนได้ และแทนที่จะเห็นข้อความภาษาไทย คุณ
อาจเห็นตัวอักษรแปลกๆ
ใน HTML5 การเข้ารหัสถูกกำหนดในรูปแบบที่เรียบง่าย:
<meta charset="utf-8">
ก่อนหน้านี้ การเข้ารหัสถูกกำหนดดังนี้ (ปัจจุบันไม่ควร ทำแบบนี้แล้ว ล้าสมัย คุณอาจพบได้ ในหนังสือเรียนที่เก่าแล้ว):
<meta http-equiv="content-type" content="text/html; charset=utf-8">
คำอธิบายเอกสาร
คำอธิบายเมตา (meta description) ของเอกสารมีไว้ สำหรับเครื่องมือค้นหา ควรมีคำอธิบายสั้นๆ ของหน้านั้นอยู่ ในบางเงื่อนไขเครื่องมือค้นหา อาจสร้าง snippet ของหน้าเว็บไซต์จากคำอธิบายนี้ได้ Snippet คือคำอธิบายสั้นๆ ของหน้าเว็บไซต์ในการ ค้นหา ดังนั้น ควรทำคำอธิบายเมตาของหน้า ให้เป็นแบบที่คุณต้องการให้เห็น เป็น snippet ของหน้าในผลการค้นหา และควรเป็นของแต่ละ หน้าเว็บไซต์เฉพาะหน้า
ควรใช้ดังนี้:
<meta name="description" content="หน้านี้พูดถึงเมตาแท็ก">
คำสำคัญของเอกสาร
เมตา keywords (คำสำคัญ) มีไว้ สำหรับเครื่องมือค้นหา เพื่อระบุคำ ที่สำคัญที่สุดที่ผู้คนจะใช้ค้นหาหน้านี้ ในปัจจุบัน เนื่องจากการใช้ในทางที่ผิดจาก ฝ่ายเว็บมาสเตอร์ เครื่องมือค้นหาไม่ให้ ความสำคัญกับเมตาแท็กนี้แล้ว
ควรใช้ดังนี้ (คำสำคัญ และวลีถูกคั่นด้วยเครื่องหมายจุลภาค):
<meta name="keywords" content="เมตาแท็ก, เมตาคำอธิบาย, การเปลี่ยนทาง HTML" >
การเปลี่ยนทาง (การส่งต่อไปยังหน้าอื่น)
สามารถทำให้เมื่อผู้ใช้เข้าสู่บาง หน้าแล้วถูกส่งต่อไปยังหน้าอื่นโดยอัตโนมัติได้ (ตัวอย่างเช่น หากหน้านั้นย้ายไปอยู่ที่อื่น) ควรใช้ดังนี้ (5 คือจำนวนวินาที ที่หลังจากนั้นจะเกิดการเปลี่ยนทาง):
<meta http-equiv="refresh" content="5; url=http://www.example.com/">
ตัวอย่างเพิ่มเติม
คุณสามารถหาตัวอย่างเพิ่มเติมได้ที่ ลิงก์นี้
แอตทริบิวต์ที่เป็นไปได้
| แอตทริบิวต์ | คำอธิบาย |
|---|---|
name |
ชื่อของเมตาแท็ก ค่าของเมตาแท็กที่มีชื่อนี้ถูกกำหนดโดยแอตทริบิวต์ content |
http-equiv |
อนุญาตให้ตั้งค่า HTTP headers เพื่อส่งไปยังเบราว์เซอร์
กำหนดชื่อของเฮดเดอร์ ค่าของเฮดเดอร์ถูกกำหนดโดยแอตทริบิวต์ content
|
content |
กำหนดค่าของแอตทริบิวต์ที่ระบุโดยใช้แอตทริบิวต์ name หรือ http-equiv |
charset |
กำหนดการเข้ารหัสของเอกสาร ในปัจจุบันมาตรฐานคือ utf-8 |
