เรียนรู้วิธีใช้งาน Element <title> ใน HTML
Element <title> ใน HTML แสดงถึงชื่อหน้าเว็บไซต์ของคุณ
เพื่อดูชื่อหน้าของเว็บไซต์ที่คุณกำลังเข้าชม ให้เลื่อนเมาส์ไปที่แท็บเบราว์เซอร์ และค้างไว้สักครู่ คุณจะเห็นชื่อหน้าเต็มรูปแบบปรากฏขึ้น
นี่คือตัวอย่างจาก YouTube:
ในการสร้าง Element title เราใช้แท็กเปิดและปิด <title> วางข้อความไว้ภายใน:
<title>Document page title</title>
Element <title> ต้องมีเฉพาะข้อความเท่านั้น!
Element <title> ต้องอยู่ภายใน Element <head> ของเอกสาร:
<!DOCTYPE html> <html> <head> <title>Document page title</title> </head> <body> ... </body> </html>
<title> ส่งผลต่อ SEO
<title> เป็นหนึ่งใน Element สำคัญที่สุดสำหรับ SEO (Search Engine Optimization) เพราะอัลกอริทึมของเครื่องมือค้นหาใช้ชื่อหน้าเว็บ (รวมถึงปัจจัยอื่นๆ) ในการกำหนดอันดับในผลการค้นหา
เพื่อ SEO และ UX ข้อความที่ใส่ใน Element <title> ควรบรรยายหน้าเว็บให้ชัดเจนที่สุด อย่างไรก็ตาม ไม่ควรเกิน 60 ตัวอักษร (รวมช่องว่าง) มิฉะนั้นเครื่องมือค้นหาจะไม่แสดงชื่อเต็ม
อย่าแค่詰め込み คีย์เวิร์ดไปหมด โดยคิดว่าจะช่วย SEO แต่ควรเขียนชื่อที่บรรยายได้ชัดเจน และรวมคีย์เวิร์ดหลักของหน้านั้นๆ
ตัวอย่างชื่อหน้าที่บรรยายได้ดี:
<title>How to build a simple website with HTML, CSS, and JavaScript</title>
ชื่อข้างต้นเขียนได้เป็นธรรมชาติ บรรยายชัดเจน และมีคีย์เวิร์ดหลัก 4 ตัวสำหรับเว็บไซต์สอนเทคโนโลยีอย่าง TechStacker:
- website
- HTML
- CSS
- JavaScript
รูปแบบทั่วไปที่เห็นบนเว็บคือ ใช้ข้อความของ หัวข้อหลัก (Main Heading) Element <h1>Main heading</h1> เป็นชื่อหน้าเว็บด้วย บาง CMS เช่น WordPress ทำให้อัตโนมัติ วิธีนี้ใช้ได้ดี เว้นแต่คุณต้องแยกความแตกต่างระหว่างหัวข้อหลักและคำบรรยายชื่อหน้า