Transform
Ideas Into Gems

let JindaTheme build platforms for your business

Schema Markup พระเอกตัวจริงสำหรับการทำ Onpage SEO

In: SEO and Tools Published: 05/02/2021

Schema Markup ที่ถูกลืม

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

ต้องบอกก่อนนะครับว่า SEO จริงๆอาจจะไม่ได้เกี่ยวกับเทคโนโลยีที่เลือกใช้ ผมมักจะได้รับคำถามจากหลายคนมากๆ ว่าใช้ภาษาอะไร หรือใช้อะไรทำเว็บแล้ว SEO จะดีขึ้นบ้าง ส่วนตัวยังมองว่าใช้ภาษาอะไรหรือเทคโนโลยีอะไรเขียนเว็บไซต์ก็สามารถทำ SEO ได้เหมือนกัน ขึ้นอยู่กับความพิถีพิถันในการเก็บรายละเอียดเล็กๆน้อยๆภายในเว็บไซต์เรา(pagespeed, markup) กับตัวแปรภายนอกมากกว่า(link builder, backlink, PR)

Schema-Markup

Schema Markup คืออะไร?

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

Schema Markup for hotel
Schema Markup สำหรับโรงแรม

รูปภาพด้านบนนี่ไม่ใช่การลงโฆษณานะครับ แต่เป็นการค้นหาบน Google ปรกติและเป็นลิงค์เว็บไซต์ทั่วไป ผมลองค้นหาคำว่า “Grand Center Point Pattaya” แล้วก็เจอรายการจาก Agoda ซึ่งบอกข้อมูลต่างๆให้เห็นและอาจจะตัดสินใจได้ทันทีโดยยังไม่ต้องคลิกเข้าไปด้วยซ้ำ ซึ่งตรงนี้จะทำให้เว็บไซต์เรามีความโดดเด่นกว่าคู่แข่ง อีกทั้งดูน่าเชื่อถือกว่าด้วย

Schema Markup for product
Schema Markup สำหรับสินค้า

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

หลักการใช้ Schema Markup กับเว็บไซต์ของเรา

การทำ Schema Markup ในเว็บไซต์เราเองนั้นไม่ใช่เรื่องยากครับ ขอแค่เราเป็นเจ้าของเว็บไซต์ หรือมีนักพัฒนาเว็บไซต์ที่เคยจ้าง ก็สามารถขอให้เขาช่วยเพิ่มได้(ค่าใช้จ่ายขึ้นอยู่กับการตกลง เปลี่ยนมากน้อยหลายหน้าก็ว่ากันไป) ซึ่ง Schema Markup นั้นก็มีหลายประเภทให้เราสามารถกำหนดได้ เช่น Articles (บทความทั่วไป), Events (กิจกรรม), Restaurant (ร้านอาหาร), Products (สินค้าต่างๆ) เป็นต้น ซึ่งการกำหนดหมวดหมู่พวกนี้เอาไว้ก่อนจะทำให้ search engine สามารถวิ่งดึงข้อมูลได้อย่างสะดวกไหลลื่น เป็นไปตามที่เราต้องการได้ง่ายขึ้น

Google Data Markup Helper
ไปที่หน้าเว็บไซต์ https://www.google.com/webmasters/markup-helper/u/0/

สำหรับคนที่ไม่มีพื้นฐานการเขียนโปรแกรมก็สามารถเข้าใจ Schema Markup เองได้ง่ายครับ เพียงเข้าไปที่เว็บไซต์ Markup Helper ของ Google แล้วเลือกหมวดหมู่ที่เว็บไซต์เราเองให้บริการอยู่ แล้วกดเริ่ม Start Tagging ได้เลย

google-markup-helper-online

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

เมื่อเสร็จเรียบร้อยเราสามารถกดปุ่ม Create HTML เพื่อโหลดไฟล์ Json-LD markup ลงมาใส่ไว้ในส่วน <head> ของเว็บไซต์เราได้เลย ในขั้นตอนนี้หากไม่ถนัดการแก้ไขโค้ดโปรแกรมก็สามารถส่งไฟล์ที่เรากำหนดนี้แล้วให้กับนักพัฒนาโปรแกรมไปใส่ได้เลยโดยที่ไม่ต้องเหนื่อยอะไรเขามากนัก

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

Microdata

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

หลักการทำงานคือเราต้องกำหนด scope (เช่นเดียวกับเลือกหมวดของหน้า Google Markup Helper) ก่อนเช่น Movie จากนั้นก็กำหนด property ต่างๆให้กับโค้ดที่เขียนแต่ละจุดว่ามีความสัมพันธ์อะไรกันแล้วหมายถึงอะไรกัน ดูตัวอย่างรูปภาพด้านล่างครับ

microdata-schema-markup
ดูทั้งหมดได้ที่เว็บไซต์ https://schema.org/docs/gs.html

จะเห็นว่าเมื่อกำหนด scope เป็น “Movie” แล้ว เราก็สามารถกำหนดข้อมูลอื่นๆได้ด้วยเช่น หนังชื่ออะไร ใครเป็นผู้กำกับ แล้วลิงค์ไปดูหนังตัวอย่างคือจุดไหนในหน้าเว็บไซต์ เข้าใจไม่ยากเลยใช่ไหมล่ะครับ แค่เพิ่มคำไม่กี่คำเท่านั้นเอง เหมาะกับเว็บไซต์จองโรงแรม และขายของออนไลน์เหมือนตัวอย่างที่แนบข้างต้นมากๆ ซึ่ง property นี่มีให้เลือกระบุเยอะมาก น่าจะร่วมๆ 50 รายการ และแต่ละ scope ก็จะมี property ให้เลือกระบุต่างกันไป ลองดูตัวอย่าง property ทั้งหมดของ Movie ในลิงค์นี้ก็ได้ครับ: https://schema.org/Movie

แน่นอนว่ายิ่งเรากรอกข้อมูลมากเท่าไหร่ search engine ก็จะยิ่งเก็บข้อมูลได้ตรงตามที่เราอยากให้แสดงมากขึ้นเท่านั้น และอาจจะมีชัยได้คะแนนด้าน Onpage SEO ดีกว่าคู่แข่งด้วย

Schema Markup Tripniceday
ถ้าเปิดชุดคำสั่งดูจากหน้าเว็บไซต์ก็จะเห็นว่ากำหนด itemprop ไว้แล้ว

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

เอาเป็นว่า Schema Markup นั้นถือเป็นอีกปัจจัยนึงที่จะช่วยให้เว็บไซต์ของเราได้คะแนน Onpage SEO ดีขึ้น และช่วยให้เวลามีผู้ใช้งานค้นหาข้อมูลอะไรก็ตามบน search engine ก็จะได้รับข้อมูลที่เป็นประโยชน์หรือสามารถตัดสินใจได้ทันทีว่าเว็บไซต์นั้นน่าคลิกเข้ามามากน้อยแค่ไหน

This might interest you

image

3 เครื่องมือ ช่วยเพิ่มประสิทธิภาพการทำงานของทีม – เมื่อต้อง WFH

ช่วงโควิด-19 นี้เป็นช่วงที่หลายองค์กรต้องปรับตัวกันอย่างหนักเพื่อให้การทำงานยังสามารถทำต่อไปได้ แ... Read more >
image

3 เทคนิคเปลี่ยนจากผู้ใช้ทั่วไป ให้กลายมาเป็นสมาชิก

การทำ user onboarding นั้นถือเป็นเรื่องสำคัญของแพลตฟอร์มดิจิตอลในปัจจุบัน ยิ่งกับเว็บไซต์หรือแอปท... Read more >
image

เว็บไซต์จำเป็นไหม? มี Facebook page อย่างเดียวได้หรือเปล่า

ผมเชื่อว่าผู้ประกอบการหลายคนมักจะเกิดคำถามว่า "เราควรจะต้องมีเว็บไซต์ไหม หรือแค่ Facebook page อย... Read more >

Please fill up this form

Our team will estimate the price from your details and send a quotation to your email.

Notifications

Thank you, we have received your message.

preloader

Preparing, please wait a moment.