วิธีสร้าง og image หรือ og tag เป็นแท็ก Open Graph meta ช่วยให้เว็บดูน่าสนใจ

Home Website วิธีสร้าง og image หรือ og tag เป็นแท็ก Open Graph meta ช่วยให้เว็บดูน่าสนใจ
สร้าง og image หรือ og tag เป็นแท็ก Open Graph meta ช่วยให้หน้าเว็บดูน่าสนใจ

og image หรือ og tag เป็นแท็ก Open Graph meta ที่จะเเสดงรูปภาพตัวอย่าง เมื่อหน้าเว็บแชร์บนโซเชียลมีเดีย แท็กนี้ใช้โดยแพลตฟอร์มโซเชียลมีเดีย เช่น Facebook, Twitter และ LinkedIn เพื่อแสดงตัวอย่างหน้าในฟีดของผู้ใช้ช่วยให้หน้าเว็บดูน่าสนใจและมีส่วนร่วมมากขึ้นเมื่อแชร์บนโซเชียลมีเดีย รูปภาพที่ดีสามารถดึงดูดความสนใจของผู้ใช้และกระตุ้นให้พวกเขาคลิกที่ลิงก์เพื่อเรียนรู้เพิ่มเติมเกี่ยวกับหน้า

แท็ก og:image มีไวยากรณ์ดังนี้

<head>
<meta property="og:image" content="https://example.com/car.jpg">
</head>

แอตทริบิวต์ content ระบุ URL ของรูปภาพที่จะใช้เป็นตัวอย่าง รูปภาพควรเป็นภาพที่มีคุณภาพสูงและเกี่ยวข้องกับเนื้อหาของหน้า ขนาดที่แนะนำสำหรับ og:image คือ 1200 x 630 พิกเซล

แท็ก og:image ยังสามารถกำหนดแอตทริบิวต์ได้อีกด้วย

  • width: ความกว้างของรูปภาพเป็นพิกเซล
  • height: ความสูงของรูปภาพเป็นพิกเซล
  • alt: คำอธิบายของรูปภาพ

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

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

เคล็ดลับในการสร้าง og:image

  • ใช้ภาพที่มีคุณภาพสูงที่มีขนาดอย่างน้อย 1200 x 630 พิกเซล
  • ตรวจสอบให้แน่ใจว่ารูปภาพเกี่ยวข้องกับเนื้อหาของหน้า
  • ใช้ชื่อที่ชัดเจนและกระชับสำหรับรูปภาพ
  • เพิ่มคำอธิบายของรูปภาพลงในแอตทริบิวต์ og:image:alt
  • โดยทำตามเคล็ดลับเหล่านี้ เจ้าของเว็บไซต์สามารถสร้างแท็ก og:image ที่ช่วยให้หน้าของพวกเขาโดดเด่นบนโซเชียลมีเดีย
<html>
<meta property="og:image" content="https://example.com/car.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="รถคันนี้สีเเดง">
</head>

แท็กนี้ใช้รูปภาพที่มีชื่อว่า car.jpg” จากที่อยู่ “https://example.com” เป็นตัวอย่างหน้า รูปภาพมีขนาด 1200 x 630 พิกเซล และคำอธิบายของรูปภาพคือ “รถคันนี้สีเเดง”

การปรับปรุงลักษณะที่ปรากฏและประสิทธิภาพของหน้าเว็บของคุณบนโซเชียลมีเดีย การใช้ og:image ถือเป็นวิธีที่ยอดเยี่ยมในการเริ่มต้นพัฒนาเว็บไซต์