วิธีที่ดีที่สุดในการประเมินปัญหาเกี่ยวกับหน้า Accelerated Mobile Pages

วันจันทร์ที่ 19 กันยายน 2016

เมื่อคุณ #AMPlify เว็บไซต์ด้วย Accelerated Mobile Pages คุณจะต้องตรวจสอบสถานะความถูกต้องของหน้าเว็บเป็นระยะๆ เนื่องจากต้องเป็นหน้า AMP ที่ถูกต้องเท่านั้นจึงจะมีสิทธิ์แสดงบน Google Search

เมื่อใช้ AMP, บางครั้งหน้าอาจมีข้อผิดพลาดที่ทําให้ Google Search จัดทําดัชนีหน้าไม่ได้ นอกจากนี้ หน้าเว็บอาจมีคำเตือนซึ่งเป็นองค์ประกอบที่ไม่ใช่แนวทางปฏิบัติแนะนำ หรือจะกลายเป็นข้อผิดพลาดในอนาคต

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

เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ในเบราว์เซอร์

วิธีใช้เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์เพื่อตรวจสอบความถูกต้องมีดังนี้

  1. เปิดหน้า AMP ในเบราว์เซอร์
  2. เพิ่ม #development=1 ต่อท้าย URL เช่น https://localhost:8000/released.amp.html#development=1
  3. เปิดคอนโซลเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome และตรวจหาข้อผิดพลาดในการตรวจสอบ

ข้อผิดพลาดใน Developer Console จะมีลักษณะตามด้านล่างนี้

ส่วนขยายเบราว์เซอร์สำหรับ AMP

ส่วนขยายเบราว์เซอร์สำหรับ AMP (ใช้งานได้ใน Chrome และ Opera) ช่วยให้คุณระบุและแก้ไขข้อบกพร่องของหน้า AMP ที่ไม่ถูกต้องได้อย่างรวดเร็ว เมื่อคุณเรียกดูเว็บไซต์ของคุณ ส่วนขยายจะประเมินหน้า AMP แต่ละหน้าที่เข้าชม และระบุสัญญาณบอกสถานะความถูกต้องของหน้า ตารางต่อไปนี้แสดงไอคอนต่างๆ ที่ส่วนขยายอาจปรากฏขึ้นมาตามความถูกต้องของมาร์กอัป AMP

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

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

เว็บตรวจสอบความถูกต้องสำหรับ AMP

โปรแกรมตรวจสอบเว็บ AMP ซึ่งพร้อมให้ใช้งานที่ validator.ampproject.org มี UI เว็บแบบง่ายสำหรับทดสอบความถูกต้องของหน้า AMP

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

คุณชอบใช้วิธีใดในการตรวจสอบสถานะของหน้า AMP แชร์ความคิดเห็นของคุณในคอมเมนต์ด้านล่างหรือใน หน้า Google+ สําหรับ Google ผู้ดูแลเว็บ หรือหากมีข้อสงสัยหรือต้องการความช่วยเหลือ คุณโพสต์ถามได้ในฟอรัมความช่วยเหลือสําหรับผู้ดูแลเว็บ