ข้อปฏิบัติในการปรับแต่งเว็บไซท์ สำหรับการแชร์บน Social Network

Social Network อย่างเช่น Facebook , Google+ , Twitter ฯลฯ ต่างก็สามารถนำลิงก์เว็บไซท์ไปแชร์ได้ เพราะฉะนั้นในที่นี้ผมจึงจะมาแนะนำในบทความนี้ว่าด้วยการปรับแต่ง Meta tage เพื่อให้ดีที่สุดสำหรับการแชร์ลิงก์ไปยัง Social ต่างๆ เพื่อนๆคงจะเคยเห็นการแชร์ลิงก์ต่างๆบน Facebook มาแล้ว ผมจะยกตัวอย่างเช่น Pantip.comPantip share on facebook
ถ้าลองเอามาเปรียบเทียบกับเว็บอื่นๆ ไม่รู้จะเปรียบเทียบกับเว็บไหน เอาบล็อกผมนี่เลยละกัน เพราะยังไม่ได้ปรับแต่งเหมือนกัน จากรูปด้านล่างจะเห็นว่าองค์ประกอบของแชร์นั้นต่างกันมาก ทั้งนี้ทั้งนั้นก็เพราะว่าเราไม่ได้ใส่แท็กเพื่อบอกกับบอทที่มาเก็บข้อมูลขณะที่เราแชร์ว่า ตรงไหนคือส่วนไหน เวลาที่มันรวบรวมเองก็เลยดูแล้วไม่สวยงามอย่างที่เห็นนั่นเอง
Pongpat share on facebook

เรามาดูวิธีการที่ Facebook เป็นคนเขียนแนะนำ ว่าขั้นตอนการปฏิบัตที่ดีที่สุดสำหรับการแชร์ลิงก์เว็บไซท์ว่ามีอะไรบ้าง สามารถอ่านเพิ่มเติมได้ที่ Sharing Best Practices for Websites สำหรับในที่นี้ผมจะพูดถึงแค่เรื่องการตั้งค่า meta tage
ใช้ proper Open Graph tags :

Good Examples
Title
A clear title without branding or mentioning the domain itself.


Site name
Provide a site name, e.g. “My Favorite News”


URL
A URL with no session id or extraneous parameters. All shares on Facebook will use this as the identifying URL for this article.


Description
A clear description, at least two sentences long.


Facebook App ID
A Facebook App ID that identifies your website to Facebook.


Object Type
The type of object:


Localization
This article has some translations:

            
  
  

Author and Publisher
This article has an author and a publisher:



Bad Examples
Bad Title
The title should not have branding or extraneous information.


Bad URL
This URL has extraneous information that changes from user to user, resulting in likes/shares spread across multiple URLs, instead of being aggregated for all users sharing this article.


Generic Description
This is a generic description that will not entice users to click.


Generic Image
This is a generic image that will look the same for all stories. It is only 100px by 100px, which will not be usable on higher resolution displays.


Missing Facebook App ID
Don’t forget the fb:app_id, article:author and article:publisher tags!

Leave a Reply

อีเมลของคุณจะไม่แสดงให้คนอื่นเห็น ช่องข้อมูลจำเป็นถูกทำเครื่องหมาย *

This site uses Akismet to reduce spam. Learn how your comment data is processed.