เรียนรู้วิธีใช้เอลิเมนต์ HTML <meta>
เอลิเมนต์ <meta> ใช้กำหนดเมตาดาต้าหลายประเภทเกี่ยวกับเอกสาร HTML เมตาดาต้าหมายถึงข้อมูล หรือเฉพาะเจาะจงกว่านั้น เมตาดาต้าคือข้อมูลที่อธิบายและให้ข้อมูลเกี่ยวกับข้อมูลอื่น
เอลิเมนต์ <meta> มีแอตทริบิวต์และค่าหลายอย่าง
แอตทริบิวต์ name เป็นหนึ่งในสำคัญที่สุด
name รับค่าหลายค่า ตัวอย่างเช่น description ซึ่งใช้ร่วมกับแอตทริบิวต์ content เพื่ออธิบายเพจ:
<head> <meta name="description" content="Learn about the HTML meta element" /> </head>เอลิเมนต์ <meta> อยู่เฉพาะภายในเอลิเมนต์ <head> เท่านั้น
เมตาดาต้าไม่มองเห็นบนเว็บเพจของคุณ แต่ถูกแยกวิเคราะห์ (อ่าน) และประมวลผลโดยเครื่องจักร เช่น เซิร์ฟเวอร์ เบราว์เซอร์ และเครื่องมือค้นหา
สิ่งนี้ทำให้เอลิเมนต์ <meta> เป็นหนึ่งในเอลิเมนต์ HTML สำคัญที่สุดสำหรับ SEO เพราะมันให้เครื่องมือค้นหาเช่น Google ข้อมูลเพิ่มเติม (นอกเหนือจากเนื้อหาเว็บไซต์ของคุณ) ที่บอกว่เว็บไซต์ของคุณเกี่ยวกับอะไร และเกี่ยวข้องอย่างไรเมื่อเทียบกับสิ่งที่ผู้คนค้นหา
เมตา description บางครั้ง ถูกใช้โดยเครื่องมือค้นหาเพื่อสร้างคำอธิบายเพจสำหรับเว็บไซต์ของคุณใน SERPs (Search Engine Results Pages) หากมันพบว่ามันดีกว่าเนื้อหาบนเพจ
Viewport Tag
เมตาแท็ก viewport ช่วยทำให้เว็บไซต์ที่ไม่เป็นมิตรกับมือถือดูดีขึ้นบนหน้าจอเล็ก การกำหนดค่า viewport tag ต่อไปนี้เพิ่มประสิทธิภาพสำหรับมือถือ และควรใช้เป็นค่าเริ่มต้น ยกเว้นคุณจะมีเหตุผลที่ดีที่จะไม่ทำ:
<meta name="viewport" content="width=device-width, initial-scale=1" />width=device-widthบอกเบราว์เซอร์ให้ตั้งค่าความกว้างของเพจตามความกว้างของอุปกรณ์ผู้ใช้initial-scaleควบคุมระดับซูมเมื่อโหลดเพจครั้งแรกinitial-scale-1หมายความว่าระดับซูมคือ 100% หากตั้งเป็นinitial-scale-2เพจจะซูม 200% ในการโหลดครั้งแรก
viewport เป็นหนึ่งในแท็ก <meta> ที่ก้าวหน้ากว่า ที่คุณควรศึกษาอย่างละเอียดก่อนเริ่มปรับแต่งค่าเริ่มต้น
Mozilla มีเอกสารประกอบที่มั่นคงเกี่ยวกับ viewport tag
Robots Meta Tag
เมตาแท็ก robots (เรียกอีกอย่างว่า "robot meta directives") บอกเครื่องมือค้นหาว่าควรจัดทำดัชนีเพจของคุณหรือไม่ โดยใช้ค่าแอตทริบิวต์ index หรือ noindex
โดยค่าเริ่มต้น ตั้งเป็น index ดังนั้นหากคุณไม่ต้องการให้เว็บไซต์ถูกจัดทำดัชนี คุณระบุเป็นค่า content noindex
<meta name="robots" content="noindex" />robots ยังสามารถใช้บอกเครื่องมือค้นหาว่าควรติดตามลิงก์บนเว็บไซต์ของคุณหรือไม่ โดยใช้ค่า follow หรือ nofollow
<meta name="robots" content="nofollow" />คุณยังสามารถรวม noindex และ nofollow ในเอลิเมนต์เดียวได้:
<meta name="robots" content="noindex, nofollow" />ใช้ อย่างระมัดระวัง กับการกำหนดค่า <meta> robots ของคุณ
หากคุณตั้งค่าเป็น noindex, nofollow ตามโค้ดด้านบน คุณจะชะลอเครื่องมือค้นหาไม่ให้จัดทำดัชนีทั้งเนื้อหาและลิงก์ของคุณ ทั่วโลก (ทั้งเว็บไซต์ทั้งหมด) คุณนادرาจะต้องการทำเช่นนี้ เพราะมันจะทำลาย SEO
กรณีการใช้งานทั่วไปของ noindex คือ หากเว็บไซต์ของคุณยังอยู่ระหว่างพัฒนา และยังไม่พร้อมสำหรับสาธารณะ WordPress มีตัวเลือกปิดการจัดทำดัชนีหน้าชั่วคราว (nofollow) เพื่อวัตถุประสงค์นี้
และสำหรับลิงก์ แทนที่จะใช้ nofollow ทั่วโลก (สำหรับลิงก์ทุกอย่าง) กรณีการใช้งานที่เป็นประโยชน์กว่าคือใช้ nofollow บนลิงก์ออก (ภายนอก) บางอย่าง เช่น ลิงก์ที่จ่ายเงิน ที่ไม่มีเหตุผลให้เครื่องมือค้นหาติดตาม คุณจะทำได้โดยตรงบนแองคอร์เอลิเมนต์:
<a href="#" rel="nofollow">Click to see our sponsor</a>โดยค่าเริ่มต้น ไฮเปอร์ลิงก์ตั้งเป็น follow
