8 แท็ก HTML ที่สำคัญที่สุดสำหรับ SEO

คุณใช้แท็ก HTML ในกระบวนการ SEO ของคุณหรือไม่?

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

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

ในโพสต์นี้เราจะพูดถึงแท็ก SEO HTML ที่สำคัญบางส่วนที่ยังคงมีเหตุผลในปี 2020

1. ป้ายชื่อ

แท็กชื่อใช้เพื่อตั้งค่าหัวข้อข่าวที่คลิกได้ที่คุณเห็นใน SERP:

โดยทั่วไป Google จะต้องสร้างบรรทัดแรก SERP สำหรับเพจของคุณและอาจใช้ส่วนหัวส่วนใดก็ได้จากในหน้าหรืออาจสร้างพาดหัวใหม่ทั้งหมดก็ได้

แต่อันดับแรกที่ Google จะตรวจสอบแนวคิดพาดหัวคือแท็กชื่อและในกรณีที่มีแท็กชื่อ Google มักจะกำหนดให้เป็นหัวข้อหลักในรายชื่อที่เกี่ยวข้อง ด้วยเหตุนี้การเพิ่มประสิทธิภาพแท็กหัวเรื่องจะช่วยให้คุณสามารถควบคุมวิธีแสดงเพจของคุณใน SERP ได้

ปฏิบัติที่ดีที่สุด

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

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

รหัส HTML

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

2. แท็กคำอธิบายเมตา

แท็กคำอธิบายเมตาใช้เพื่อตั้งค่าคำอธิบายภายในตัวอย่างผลการค้นหา:

Google ไม่ได้ใช้แท็กคำอธิบายเมตาในการสร้างตัวอย่างข้อมูลเหล่านี้เสมอไป แต่หากมีเมตาแท็กอยู่แสดงว่ามีโอกาสดีที่คำอธิบายเมตาของคุณจะนำไปใส่ใน SERP

อย่างไรก็ตามโปรดทราบว่าบางครั้ง Google จะเพิกเฉยต่อแท็กคำอธิบายเมตาและอ้างสำเนาเล็กน้อยจากหน้านั้นแทน โดยปกติจะเกิดขึ้นเมื่อใบเสนอราคาตรงกับข้อความค้นหาหนึ่ง ๆ มากกว่าคำอธิบายเมตาที่ควรจะเป็น

โดยพื้นฐานแล้ว Google จะเลือกตัวเลือกที่ดีที่สุดเพื่อเพิ่มโอกาสในการคลิกผ่าน

ปฏิบัติที่ดีที่สุด

กฎสำหรับคำอธิบายเมตาไม่เข้มงวดมากเกินไป - ท้ายที่สุดแล้วหากคุณเขียนข้อผิดพลาดแม้ว่าคุณจะเขียนไม่สำเร็จทั้งหมด Google จะเขียนให้คุณ

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

รหัส HTML

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

3. แท็กหัวเรื่อง (H1-H6)

แท็กหัวเรื่องใช้เพื่อจัดโครงสร้างหน้าของคุณสำหรับทั้งโปรแกรมอ่านและเครื่องมือค้นหา:

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

อย่างไรก็ตามจากมุมมองของเครื่องมือค้นหาแท็กส่วนหัวเป็นแกนหลักของเนื้อหาและช่วยให้บอทโปรแกรมรวบรวมข้อมูลการค้นหาเข้าใจว่าหน้านั้นเกี่ยวกับอะไร

ปฏิบัติที่ดีที่สุด

กฎสำหรับหัวเรื่องมาจากแนวปฏิบัติทั่วไปในการเขียนคำโฆษณา - แบ่งสำเนาของคุณเป็นชิ้นขนาดพอดีคำและรักษาการจัดรูปแบบที่สอดคล้องกัน:

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

รหัส HTML

ด้านล่างนี้เป็นตัวอย่างโค้ดที่ดึงมาจากบทความ BBC เดียวกันเกี่ยวกับสถิติ coronavirus และคุณจะเห็นว่ามีการตั้งค่าส่วนหัว H2 อย่างถูกต้องตามด้วยสองย่อหน้า:

4. ข้อความแสดงแทนรูปภาพ

แม้ว่าเป้าหมายหลักของข้อความแสดงแทนคือการเข้าถึงเว็บ แต่เป้าหมาย SEO ของแอตทริบิวต์ alt คือการจัดทำดัชนีรูปภาพ

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

จากมุมมองของ SEO ข้อความแสดงแทนเป็นส่วนสำคัญในการจัดทำดัชนีรูปภาพในการค้นหาของ Google ดังนั้นหากมีองค์ประกอบภาพในสิ่งที่คุณทำไม่ว่าจะเป็นภาพผลิตภัณฑ์งานภาพสต็อกงานศิลปะของคุณคุณควรพิจารณาใช้ข้อความแสดงภาพแทนอย่างแน่นอน

ปฏิบัติที่ดีที่สุด

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

คุณสามารถใช้เครื่องมือเช่น WebSite Auditor เพื่อรวบรวมข้อมูลเว็บไซต์ของคุณและรวบรวมรายการรูปภาพที่ไม่มีข้อความแสดงแทน

เมื่อคุณสร้างรายการของคุณแล้วให้ใช้แนวทางเหล่านี้:

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

รหัส HTML

นี่คือตัวอย่างตัวอย่างข้อความแสดงแทนจากภาพเซลล์ของโรค:

5. สคีมามาร์กอัป

มาร์กอัปสคีมาใช้เพื่อปรับปรุงข้อมูลโค้ด SERP ปกติด้วยคุณสมบัติตัวอย่างข้อมูลที่สมบูรณ์:

Schema.org โฮสต์ชุดของแท็กที่พัฒนาร่วมกันโดย Google, Bing, Yahoo! และ Yandex และผู้ดูแลเว็บใช้แท็กเพื่อให้ข้อมูลเพิ่มเติมเกี่ยวกับหน้าประเภทต่างๆแก่เครื่องมือค้นหา ในทางกลับกันเครื่องมือค้นหาจะใช้ข้อมูลนี้เพื่อปรับปรุงข้อมูลโค้ด SERP ด้วยคุณสมบัติที่หลากหลาย

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

ปฏิบัติที่ดีที่สุด

แนวทางปฏิบัติที่ดีที่สุดเพียงอย่างเดียวคือไปที่ schema.org และดูว่าพวกเขามีแท็กใดบ้างที่สามารถนำไปใช้กับประเภทหน้าเว็บของคุณได้ มีแท็กหลายร้อยหากไม่ใช่หลายพันแท็กดังนั้นจึงมีตัวเลือกที่สามารถใช้ได้และอาจช่วยปรับปรุงรายชื่อเว็บไซต์ของคุณได้

รหัส HTML

นี่คือตัวอย่างโค้ดที่ระบุข้อมูลโภชนาการสำหรับสูตรอาหาร คุณสามารถไปที่ schema.org เพื่อดูรายการทั้งหมดสำหรับมาร์กอัป:

6. แท็กความหมาย HTML5

องค์ประกอบ HTML5 ใช้สำหรับคำอธิบายที่ดีขึ้นของส่วนประกอบต่างๆของหน้า:

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

ด้วยการแนะนำองค์ประกอบ HTML5 เชิงความหมายเราจึงมีชุดแท็กที่ใช้งานง่ายซึ่งแต่ละแท็กอธิบายส่วนประกอบของหน้าแยกกัน ดังนั้นแทนที่จะติดแท็กเนื้อหาของเราด้วย div ที่ สับสนมากมายตอนนี้เรามีวิธีอธิบายส่วนประกอบด้วยวิธีที่เข้าใจง่ายและเป็นมาตรฐาน

อย่างที่คุณสามารถจินตนาการได้ว่าเครื่องมือค้นหามีความกระตือรือร้นอย่างมากเกี่ยวกับ HTML5 เชิงความหมาย

รหัส HTML

นี่คือองค์ประกอบ HTML5 เชิงความหมายที่มีประโยชน์ที่สุดบางส่วนใช้เพื่อปรับปรุงการสื่อสารของคุณกับเครื่องมือค้นหา:

• บทความ - แยกโพสต์จากส่วนที่เหลือของโค้ดทำให้พกพาได้
• ส่วน - แยกกลุ่มของโพสต์ภายในบล็อกหรือกลุ่มหัวเรื่องภายในโพสต์
• กัน - แยกเนื้อหาเสริมที่ไม่ได้เป็นส่วนหนึ่งของเนื้อหาหลัก
• ส่วนหัว - แยกส่วนบนสุดของเอกสารบทความส่วนอาจมีการนำทาง
• ส่วนท้าย - แยกส่วนล่างของเอกสารบทความส่วนที่มีข้อมูลเมตา
• nav - แยกเมนูการนำทางกลุ่มขององค์ประกอบการนำทาง

7. แท็ก Meta robots

เมตาแท็กของ Robots เป็นข้อมูลเกี่ยวกับกฎการมีส่วนร่วมระหว่างเว็บไซต์และเครื่องมือค้นหา

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

ปฏิบัติที่ดีที่สุด

ควรวางแท็กเมตาโรบ็อตไว้ในส่วน หัว ของโค้ดหน้าและควรระบุว่าโปรแกรมรวบรวมข้อมูลใดที่อยู่และควรใช้คำแนะนำใด:

• ระบุชื่อโรบ็อตตามชื่อ - ใช้ โรบ็อต หากคำแนะนำของคุณมีไว้สำหรับโปรแกรมรวบรวมข้อมูลทั้งหมด แต่ใช้ชื่อเฉพาะเพื่อจัดการกับโปรแกรมรวบรวมข้อมูลแต่ละตัว ตัวอย่างเช่นโปรแกรมรวบรวมข้อมูลเว็บมาตรฐานของ Google เรียกว่า Googlebot โดยปกติการจัดการกับโรบ็อตแต่ละตัวจะทำเพื่อแบนโปรแกรมรวบรวมข้อมูลที่เป็นอันตรายจากหน้าเว็บในขณะที่ปล่อยให้โปรแกรมรวบรวมข้อมูลที่มีเจตนาดีดำเนินการต่อไป
• จับคู่คำแนะนำกับเป้าหมายของคุณ - โดยปกติคุณต้องการใช้เมตาแท็กโรบ็อตเพื่อป้องกันไม่ให้เครื่องมือค้นหาจัดทำดัชนีเอกสารผลการค้นหาภายในหน้าที่ซ้ำกันพื้นที่การจัดเตรียมและสิ่งอื่น ๆ ที่คุณไม่ต้องการให้ปรากฏในการค้นหา

รหัส HTML

ด้านล่างนี้คือพารามิเตอร์บางส่วนที่ใช้บ่อยที่สุดกับเมตาแท็กของโรบ็อต คุณสามารถใช้จำนวนเท่าใดก็ได้ในเมตาโรบ็อตแท็กเดียวโดยคั่นด้วยเครื่องหมายจุลภาค:

• noindex - ไม่ควรจัดทำดัชนีหน้า
• nofollow - ไม่ควร ติดตาม ลิงก์ในเพจ
• ติดตาม - ควร ติดตาม ลิงก์บนเพจแม้ว่าเพจนั้นจะไม่ได้รับการจัดทำดัชนีก็ตาม
• noimageindex - รูปภาพบนเพจไม่ควรจัดทำดัชนี
• noarchive - ผลการค้นหาไม่ควรแสดงหน้าเว็บในเวอร์ชันแคช
• unavailable_after - ไม่ควรจัดทำดัชนีเพจเกินวันที่กำหนด

8. แท็ก Canonical

แท็ก Canonical ช่วยให้คุณไม่ต้องเสี่ยงกับเนื้อหาที่ซ้ำกัน:

ความสำคัญของมันคือหน้าเว็บใด ๆ ที่ไม่ได้เป็นความผิดของคุณเองสามารถมีที่อยู่ได้หลายแห่ง บางครั้งอาจเป็นผลมาจากอาร์ติแฟกต์ต่างๆเช่น http / https และแท็กติดตามต่างๆ - และบางครั้งก็เป็นผลมาจากตัวเลือกการเรียงลำดับและการปรับแต่งต่างๆที่มีอยู่ในแคตตาล็อกผลิตภัณฑ์

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

ปฏิบัติที่ดีที่สุด

เพื่อหลีกเลี่ยงปัญหา SEO ที่อาจเกิดขึ้นให้ใช้แท็ก Canonical กับหน้าต่อไปนี้:

• หน้าที่มีอยู่ผ่าน URL ที่แตกต่างกัน
• หน้าที่มีเนื้อหาคล้ายกันมาก
• ไดนามิกเพจที่สร้างพารามิเตอร์ URL ของตนเอง

ความคิดสุดท้าย

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

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