การใช้ AMP สําหรับหน้า Landing Page ของ Google Ads

หน้า Landing Page ที่เร็วขึ้นมักจะทำให้เกิด Conversion มากขึ้น และ AMP เป็นวิธีที่ยอดเยี่ยมในการสร้างหน้า Landing Page ของ Google Ads ที่น่าสนใจซึ่งโหลดได้เร็วขึ้น amp.dev มีแหล่งข้อมูลที่นักพัฒนาเว็บต้องการเพื่อสร้างหน้าเว็บที่น่าสนใจและมีประสิทธิภาพสูง คำแนะนำทีละขั้นตอนนี้อธิบายวิธีใช้ Google Ads และเทคโนโลยีการโฆษณาอื่นๆ ในหน้า AMP

ขั้นตอนที่ 1: สร้างและตรวจสอบหน้า AMP

สร้างหน้า AMP

หากต้องการดูวิธีสร้างหน้า AMP พื้นฐาน ให้เริ่มด้วยบทแนะนำสร้างหน้า AMP ครั้งแรกของโปรเจ็กต์ AMP หากต้องการคำแนะนำแบบทีละขั้นตอนที่ลงมือทำได้จริง โปรดดูบทแนะนำแปลง HTML เป็น AMP และเพิ่มฟีเจอร์ AMP ขั้นสูง คุณดูโค้ดตัวอย่างและเทมเพลตของคอมโพเนนต์ AMP ได้ที่ตัวอย่างเว็บไซต์ AMP และเทมเพลต AMP

รายการด้านล่างอธิบายคอมโพเนนต์บางอย่างที่ใช้ในหน้า AMP โปรดดูรายการคอมโพเนนต์ทั้งหมดเพื่อใช้อ้างอิง

  • amp-bind: เพิ่มการโต้ตอบแบบเก็บสถานะที่กำหนดเองตามเหตุการณ์ที่คล้ายกับ JavaScript
  • amp-form: สร้างหน้า Landing Page ที่ต้องมีการป้อนข้อมูลจากผู้ใช้
  • amp-list: ดึงเนื้อหาแบบไดนามิกจากปลายทาง CORS JSON
  • amp-carousel: ภาพสไลด์สำหรับเลื่อนดูแกลเลอรีรูปภาพ
  • amp-lightbox: แสดงมุมมองแบบเต็มหน้าจอของคอมโพเนนต์เมื่อมีการโต้ตอบกับคอมโพเนนต์
  • amp-call-tracking: แทนที่หมายเลขโทรศัพท์ในไฮเปอร์ลิงก์แบบไดนามิกเพื่อติดตามการโทร
  • amp-mustache: อนุญาตให้แสดงผลด้วย Mustache.js
  • amp-date-picker: แสดงวิดเจ็ตเพื่อเลือกวันที่ เครื่องมือเลือกวันที่สามารถแสดงผลเป็นภาพซ้อนทับที่สัมพันธ์กับช่องป้อนข้อมูล หรือเป็นวิดเจ็ตปฏิทินแบบคงที่

ตรวจสอบหน้า AMP

ในระหว่างการพัฒนา ให้ตรวจสอบว่าหน้า AMP เป็นไปตามข้อกำหนดของ AMP AMP มีวิธีการตรวจสอบหลายวิธี วิธีที่ใช้กันมากที่สุดในการตรวจสอบความถูกต้องของหน้า AMP คือการใช้เครื่องมือตรวจสอบ AMP บนเว็บหรือการทดสอบ AMP ของ Search Console นอกจากนี้ คุณยังใช้ส่วนขยาย Chrome สำหรับโปรแกรมตรวจสอบ AMP และคอนโซลสำหรับนักพัฒนาซอฟต์แวร์ หรือผสานรวมโมดูล npm ของ amphtml-validator ในบิลด์ได้ด้วย

หากต้องการความช่วยเหลือเกี่ยวกับการทดสอบ AMP โปรดไปที่หน้าการสนับสนุน AMP

ขั้นตอนที่ 2: ตั้งค่า AMP สำหรับเครื่องมือวัด Conversion และ Analytics

ใช้คอมโพเนนต์ amp-analytics เพื่อติดตาม Conversion โฆษณาของ Google Ads ทำตามขั้นตอนในหัวข้อตั้งค่าการวัด Conversion ของ Google Ads สำหรับหน้า Landing Page ของ AMP เพื่อดูวิธีตั้งค่านี้

Google Analytics

Google Analytics เป็นหนึ่งในโซลูชันการวิเคราะห์ที่ amp-analytics รองรับ หากต้องการเปิดใช้การรวมเซสชันในหน้า AMP และหน้าที่ไม่ใช่ AMP ให้ทําตามขั้นตอนในหัวข้อตั้งค่าการรวมเซสชันของ Google Analytics สําหรับ AMP

Google Tag Manager

คอมโพเนนต์ amp-analytics มีการรองรับ Google Tag Manager ในตัว นอกจาก Conversion ของ Google Ads แล้ว คุณยังใช้ Google Tag Manager เพื่อเพิ่มรีมาร์เก็ตติ้ง, Floodlight และผลิตภัณฑ์การวัดผลที่คล้ายกันได้ด้วย ดูรายการแท็กที่เข้ากันได้ทั้งหมด

Adobe Analytics

Adobe Analytics มี 2 วิธีในการใช้โซลูชันการติดตามประสิทธิภาพของเว็บไซต์ด้วยคอมโพเนนต์ amp-analytics ได้แก่ iframe (adobeanalytics_nativeConfig) และไม่ใช่ iframe (adobeanalytics) อ่านข้อดี ข้อเสีย และรายละเอียดการใช้งานของแต่ละวิธีได้ในเอกสารประกอบ AMP ของ Adobe Analytics

คุณสามารถใช้คอมโพเนนต์ amp-analytics เพื่อติดตามการกระทำและเหตุการณ์ของผู้ใช้ได้ AMP Analytics มาพร้อมกับการรองรับในตัวจากผู้ให้บริการวิเคราะห์มากกว่า 40 ราย เฟรมเวิร์กนี้มีความยืดหยุ่นและช่วยให้คุณวัดและทริกเกอร์ URL โดยใช้การกำหนดค่าที่กำหนดเองเพื่อส่งข้อมูลวิเคราะห์ไปยังเซิร์ฟเวอร์ของคุณเองหรือไปยังผู้ให้บริการที่ไม่มีการรองรับ AMP แบบเนทีฟ หากคุณใช้เทคโนโลยีที่ไม่รองรับ โปรดขอให้ผู้ให้บริการเพิ่มการรองรับ

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

ขั้นตอนที่ 3: เปิดใช้การแสดง AMP ใน UI ของ Google Ads

แม้ว่าหน้า AMP ใน Google Search จะค้นพบโดยอัตโนมัติผ่านลิงก์จากหน้าเว็บของคุณ แต่ผู้ลงโฆษณาต้องป้อน URL ของหน้า AMP ใน Google Ads อย่างชัดเจน อ่านวิธีใช้ AMP กับ Google Ads เพื่อดูรายละเอียดเกี่ยวกับการตั้งค่า URL ของ AMP ใน UI ของ Google Ads

นอกจากนี้ หากต้องการเพิ่มการเข้าชมจากโฆษณา Google Ads ไปยังหน้า Landing Page ของ AMP แต่ไม่ต้องการให้หน้าดังกล่าวปรากฏในผลการค้นหาทั่วไป ให้เพิ่มคำสั่ง Disallow สำหรับหน้า AMP ที่เกี่ยวข้องลงในไฟล์ robots.txt เช่นเดียวกับที่ทำกับหน้าเว็บปกติ

หากพบฟังก์ชันการทำงานที่ขาดหายไปใน AMP คุณสามารถมีส่วนร่วมหรือส่งคำขอได้โดยเปิดปัญหาใน GitHub