วิธีตรวจสอบความถูกต้องของหน้ามือถือเร่งด่วน (AMP)

ในบทแนะนำ AMP ล่าสุดของเราเราได้แสดงให้คุณเห็นว่าจะนำ AMP (Accelerated Mobile Pages) มาใช้เพื่อเพิ่มความเร็วอย่างมีนัยสำคัญรวมถึงแสดงผลที่ดีขึ้นในผลการค้นหาบนมือถือของ Google สำหรับเว็บไซต์ของคุณในสภาพแวดล้อมมือถือ.

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

ตอนนี้มีสิ่งสุดท้ายที่ต้องทำคือการตรวจสอบหน้าเหล่านั้น.

เครื่องมือตรวจสอบ AMP

มีหลายวิธีในการตรวจสอบหน้า AMP ของคุณ:

1. เพิ่มใน # การพัฒนา = 1 เส้นทางที่ท้าย URL หน้า AMP รายงานจะถูกฉายใน ปลอบใจ ภายใต้ DevTools.
2. หรือคุณสามารถใช้เครื่องมือตรวจสอบ AMP ออนไลน์.
3. คุณสามารถใช้ส่วนขยาย Chrome AMP.

เครื่องมือเหล่านี้จะสร้างรายการข้อผิดพลาดหรือคำเตือนภายในหน้ารายงาน จากนี้คุณสามารถเลือกสิ่งที่จะแก้ไข.

การตรวจสอบแอมป์เป็นหลักบังคับ การใช้องค์ประกอบ HTML, s, และ ประกาศสไตล์. ตรวจสอบให้แน่ใจว่าสิ่งเหล่านี้ในหน้านั้นเป็นไปตาม AMP ทั้งหมดและไม่มีสิ่งใดที่ละเมิดหลักเกณฑ์ของ AMP ที่เหลืออยู่ในนั้น มิฉะนั้นหน้า AMP ของคุณจะไม่ปรากฏที่ใดเลย.

โครงสร้างข้อมูล

AMP ยังต้องการโครงสร้างข้อมูล Schema ข้อมูลนี้จัดวางภายใน หัว แท็กของหน้าในรูปแบบ JSON มันมีข้อมูลบริบทของหน้ารวมถึงชื่อโลโก้ผู้เผยแพร่และชื่อวันที่มันถูกเผยแพร่และแก้ไข ฯลฯ.

ข้อมูลที่จะรวมอาจแตกต่างกัน: บทความรีวิวสูตรอาหารวิดีโอ ฯลฯ คุณสามารถดูเอกสารประเภทของ Google สำหรับรายละเอียดเกี่ยวกับประเภทข้อมูล.

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

แต่จะปรากฏในเครื่องมือทดสอบข้อมูลที่มีโครงสร้างของ Google รวมถึงในบัญชีผู้ดูแลเว็บ Google ของคุณ.

ผู้บริโภคของ AMP หรือลูกค้าที่สนับสนุน AMP เช่น Google Search และ Twitter Moments อาจใช้ชุดข้อมูลนี้เพื่อแสดงเนื้อหา AMP ในหน้าผลลัพธ์.

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

ข้อผิดพลาดที่มองข้าม

ข้อผิดพลาดส่วนใหญ่จะถูกบันทึกไว้ในเอกสารอย่างชัดเจนและสามารถหยิบขึ้นมาได้อย่างง่ายดาย อย่างไรก็ตามมีข้อผิดพลาดเล็กน้อยในบริบทที่มีตัวแปรที่เราอาจไม่สามารถสังเกตเห็นได้เช่น “ค่าแอตทริบิวต์ไม่ถูกต้อง”, ซึ่งบอกว่า "แอตทริบิวต์ '% 1' ในแท็ก '% 2' ถูกตั้งเป็นค่าที่ไม่ถูกต้อง '% 3'".

รายงานข้อผิดพลาดนี้ไม่ได้กล่าวถึงหรือแสดงรายการอย่างแม่นยำ ค่าใด ไม่ถูกต้อง แต่สิ่งที่ฉันรู้ก็คือเราไม่สามารถตั้งค่าได้ ความกว้าง และ ความสูง ของ องค์ประกอบเพื่อ 100% หรือ รถยนต์. ค่าแอตทริบิวต์เหล่านี้จะต้องมีขนาดที่แน่นอนของภาพเพื่อรักษาอัตราส่วนภาพ.

นี่เป็นเพียงตัวอย่างเดียว มีองค์ประกอบที่กำหนดเองจำนวนมาก - แอมป์ img, แอมป์ iframe, และ แอมป์โฆษณา - ด้วยชุดของกฎการตรวจสอบของตนเองกับการใช้คุณลักษณะและค่าของมัน.

สิ่งนี้อาจทำให้การตรวจสอบหน้าแอมป์เป็นงานที่น่ากลัวโดยเฉพาะอย่างยิ่งถ้าเราคำนึงถึงเนื้อหาที่เผยแพร่เป็นพันหรือ (อาจ) หลายพันรายการที่เผยแพร่เมื่อหลายปีก่อน.

ความคิดสุดท้าย

AMP ยังอยู่ในช่วงเริ่มต้น มันอยู่ในการพัฒนาอย่างแข็งขันด้วยความพยายามของชุมชนจาก Google และชุมชนการพัฒนาเว็บ แต่ AMP จะพัฒนาอย่างแน่นอน. คล้ายกับ HTML5 อาจมีองค์ประกอบแอตทริบิวต์และแนวทางปฏิบัติบางอย่างที่จะเลิกใช้ในอนาคต ดังนั้น ตรวจสอบให้แน่ใจว่าหน้า AMP ของคุณได้รับการตรวจสอบอย่างต่อเนื่องเป็นระยะ ขึ้นอยู่กับการเปลี่ยนแปลงล่าสุดของแนวทาง.