AMP – Accelerated Mobile Pages – เป็นเว็บไซต์เฟรมเวิร์กโอเพ่นซอร์สที่ออกแบบมาเพื่อเพิ่มความเร็วในการโหลดสำหรับผู้ใช้อินเทอร์เน็ตบนมือถือ
บทความนี้จะอธิบายว่า AMP คืออะไร ดูสาเหตุและวิธีที่พัฒนาขึ้น สำรวจประโยชน์ของมันสำหรับกลุ่มผู้มีส่วนได้ส่วนเสียต่างๆ และอธิบายวิธีทำเว็บไซต์ของคุณให้ทำงานได้อย่างรวดเร็วสำหรับ AMP
AMP คืออะไร?
AMP ย่อมาจาก “Accelerated Mobile Pages” รูปแบบโค้ดสำหรับพัฒนาเว็บไซต์แบบโอเพ่นซอร์สที่เปิดตัวเป็นความคิดริเริ่มร่วมกันโดย Google และบริษัทเทคโนโลยี และสำนักพิมพ์อื่นๆ อีกหลายแห่ง ด้วย AMP คุณสามารถสร้างเว็บไซต์บนมือถืออย่างง่ายที่โหลดเกือบจะในทันที คุณลักษณะเฉพาะของ AMP คือองค์ประกอบ JavaScript และ CSS ที่ลดลง และการใช้เครือข่ายการจัดส่งเนื้อหา (CDN)
ทำไมต้อง AMP ?
จำนวนการค้นหาจากอุปกรณ์พกพา ได้แซงหน้าเดสก์ท็อปแล้ว Open Source Framework ที่มีชื่อเรียกว่า “Accelerated Mobile Pages” (AMP) สร้างขึ้นโดยมีเป้าหมายหลักเพียงประการเดียว นั่นคือ การสร้างเวลาในการโหลดที่รวดเร็วสำหรับผู้ใช้อุปกรณ์เคลื่อนที่ นี่เป็นการตอบสนองต่อความต้องการที่เพิ่มขึ้นสำหรับเวลาในการโหลดสั้น ซึ่งเป็นปัญหาที่ผู้จัดพิมพ์และองค์กรต่างๆ หยิบยกขึ้นมาซ้ำแล้วซ้ำเล่า
ความคิดริเริ่มนี้เริ่มต้นขึ้นโดยมีเป้าหมายเพื่อสร้างระบบที่จะเป็นประโยชน์ต่อผู้มีส่วนได้ส่วนเสียทั้งหมด ผู้ลงโฆษณา ผู้เผยแพร่โฆษณา และผู้ใช้ควรได้รับผลกำไรจาก AMP
โครงการ AMP พัฒนาขึ้นอย่างไร
“โครงการ Accelerated Mobile Pages” เปิดตัวในปี 2558 โดยกลุ่มบริษัทต่างๆ ซึ่งรวมถึง Google, WordPress และ Adobe ยักษ์ใหญ่ด้านซอฟต์แวร์ ตั้งแต่เริ่มแรก พอร์ทัลข่าวต่างประเทศหลายแห่งก็มีส่วนร่วมในโครงการ AMP ด้วย โดยเว็บไซต์แรกๆ บางแห่งที่ใช้ AMP ได้แก่ The Guardian (สหราชอาณาจักร) The Washington Post และ Buzzfeed (สหรัฐอเมริกา) Frankfurter Allgemeine Zeitung และ Die Zeit (เยอรมนี) ) และ El Pais (สเปน) Twitter และ LinkedIn มีส่วนเกี่ยวข้องกับ AMP ตั้งแต่เริ่มต้นในฐานะพันธมิตรด้านเทคโนโลยี
ทุกวันนี้ สื่อออนไลน์ขนาดใหญ่เกือบทั้งหมดใช้เทคโนโลยี AMP พวกเขาตระหนักดีถึงคุณค่าอันยิ่งใหญ่ที่จะได้รับจากเว็บไซต์มือถือที่โหลดอย่างรวดเร็ว ด้วยความช่วยเหลือของปลั๊กอินที่เหมาะสม ผู้ใช้ WordPress สามารถเผยแพร่ผ่าน AMP ได้ แม้ว่าจะยังไม่มีโซลูชันอีคอมเมิร์ซสำหรับ AMP
ทำไม AMP ถึงเป็นความคิดที่ดี
ในทศวรรษที่ผ่านมา สมาร์ทโฟนได้แซงหน้าเดสก์ท็อปพีซีในหลายอุตสาหกรรมและหลายประเทศ กลายเป็นอุปกรณ์หลักที่ผู้คนใช้ในการออนไลน์ เราใช้โทรศัพท์มือถือเพื่อค้นหาร้านอาหารใกล้ ๆ เราซื้อของบนโทรศัพท์หรืออ่านข่าวบนโทรศัพท์ของเราบนรถไฟเพื่อไปทำงาน เป็นสิ่งสำคัญอย่างยิ่งสำหรับผู้ใช้มือถือที่เว็บไซต์โหลดได้อย่างรวดเร็ว จุดตัดที่สำคัญคือสามวินาที หากเว็บไซต์ใช้เวลาในการโหลดนานขึ้น ผู้ใช้อินเทอร์เน็ตบนมือถือส่วนใหญ่จะตีกลับและออกจากหน้าเว็บไซต์ไป
AMP เป็นความคิดที่ดีเพราะได้รับการออกแบบมาโดยเฉพาะเพื่อสร้างเว็บไซต์ให้โหลดได้เร็วที่สุดบนอุปกรณ์เคลื่อนที่
ปัญหา : เว็บไซต์ทำไมโหลดช้า
ความเร็วในการโหลดเนื้อหาเว็บขึ้นอยู่กับความเร็วของการเชื่อมต่อและขนาดไฟล์ของเว็บไซต์ ทั้งสองฝ่ายมีความเกี่ยวข้องกัน บางหน้าจะโหลดช้าแม้ว่าความเร็วในการเชื่อมต่อจะเร็ว หากปริมาณไฟล์ที่จะโหลดมากเกินไป ในทำนองเดียวกัน แม้แต่หน้าที่ปรับให้เหมาะสมทางเทคนิคก็อาจโหลดได้ช้าหากการเชื่อมต่อช้าเกินไป
วิธีแก้ปัญหา: AMP
AMP ไม่สามารถมีอิทธิพลต่อความจุที่มีอยู่ของการเชื่อมต่ออินเทอร์เน็ต ดังนั้นเทคโนโลยีจึงมุ่งเน้นไปที่ด้านของเวลาในการโหลดที่อาจส่งผลกระทบได้ AMP สร้างเงื่อนไขที่ดีที่สุดสำหรับเว็บไซต์บนมือถือให้โหลดได้เร็ว แม้ว่าการถ่ายโอนข้อมูลจะช้า ในการดำเนินการนี้ ระบบจะจำกัดจำนวนขององค์ประกอบ JavaScript และ CSS ที่จำเป็น เพื่อให้แน่ใจว่าต้องโหลดทรัพยากรเพียงไม่กี่รายการจึงจะสามารถดูหน้าได้
กุญแจสำคัญในการโหลดที่สั้นของ AMP อยู่ที่การลดจำนวนไฟล์ที่ต้องโหลดเป็นหลัก ปัจจัยสำคัญอีกประการหนึ่งคือพร็อกซีเซิร์ฟเวอร์ที่เก็บแคชของหน้าเป้าหมายให้พร้อม เนื้อหานี้ถูกส่งผ่านเครือข่ายการจัดส่งเนื้อหาซึ่งมีข้อได้เปรียบที่สามารถสร้างหน้าเว็บด้วยความเร็วเท่ากันได้เสมอ ไม่ว่าผู้ใช้จะเข้าถึงจากที่ใด
AMP ซอร์สโค้ด
โดยทั่วไปแล้ว เซิร์ฟเวอร์ทั้งหมดสามารถอ่านซอร์สโค้ดของ AMP ได้ เนื่องจากโค้ดนี้ใช้สคริปต์ที่เป็นที่รู้จัก องค์ประกอบสามประการต่อไปนี้เป็นคุณลักษณะของ AMP:
- AMP HTML : โค้ด HTML ของ Accelerated Mobile Page จำกัดเฉพาะสิ่งจำเป็นเท่านั้น เมื่อโหลดหน้าแล้ว คำขอ http เดียวจะถูกส่งไป
- AMP JavaScript: AMP ใช้ JS Code แบบอะซิงโครนัส ซึ่งช่วยให้ไซต์สามารถเริ่มสร้างก่อนที่จะโหลดองค์ประกอบ JS ทั้งหมด
- AMP CDN:แคชของเว็บไซต์ AMP ทุกแห่งจะถูกบันทึกไว้ในเซิร์ฟเวอร์ต่างๆ ทั่วโลก เนื้อหานี้สามารถนำไปยังผู้ใช้ได้โดยใช้เส้นทางที่สั้นที่สุดโดยใช้เครือข่ายการจัดส่งเนื้อหา ข้อดีอีกประการของ CDN คือมีการตรวจสอบการทำงานของหน้าอย่างต่อเนื่อง ซึ่งจะช่วยหลีกเลี่ยงข้อผิดพลาด
จำเป็นต้องทำการเปลี่ยนแปลงใดบ้างกับโค้ด HTML เพื่อใช้งาน AMP
HTML ของเว็บไซต์ต้องมีคุณลักษณะเฉพาะหลายอย่างเพื่อให้ทำงานผ่าน AMP ได้ เนื้อหาสื่อโสตทัศนูปกรณ์ต้องทำเครื่องหมายด้วยแท็ก AMP พิเศษ เช่น amp-img, amp-video, amp-audio หรือ amp-iframe ตัวอย่างวิธีการแทรกรูปภาพลงในซอร์สโค้ดของหน้าโดยใช้ AMP ได้แก่
<amp-img src=”myimage.jpg” alt=”สิ่งที่คุณเห็นบนรูปภาพ” height=”200″ width=”300″></amp<amp-img src=”myimage.jpg” alt=”what you can see on the image” height=”200″ width=”300″></amp-img>
นอกจากนี้ แท็กต่อไปนี้จะต้องรวมอยู่ในทุกหน้าเพื่อให้สามารถแสดงได้อย่างถูกต้องโดยใช้ AMP:
- Document type: <!doctype html>
- Top level tag: <html>tag oder <html amp>
- <head> and <body> tags
- Canonical Tag in Header: <link rel=”canonical” href=”http://www.mynormalURL.com” />
- Coding: <pre><meta charset=”utf-8″></pre> in Header
- Viewport: <meta name=”viewport” content=”width=device-width, minimum-scale=1″>
- Reference to AMP CDN: <script async src=”https://cdn.ampproject.org/v0.js”></script>
- Note on Opacity: <style>body {opacity: 0}</style><noscript><style>body {opacity: 1}</style></noscript>
ข้อดีของ AMP สำหรับกลุ่มผู้พัฒนาและผู้ใช้งาน
ดังที่กล่าวไว้ข้างต้น AMP เปิดตัวโดยมีจุดประสงค์เพื่อสร้างประโยชน์ให้กับทุกคน: ผู้โฆษณา ผู้เผยแพร่ และ users.a
- ผู้โฆษณา : ผู้โฆษณาสามารถใช้ AMP กับรูปแบบโฆษณาต่างๆ ได้หลากหลาย เนื้อหาโฆษณาโหลดแบบอะซิงโครนัส หมายความว่าประสบการณ์ของผู้ใช้จะไม่ถูกรบกวนโดยโฆษณาที่ป้องกันไม่ให้โหลดหน้า
- ผู้จัดพิมพ์ : ผู้เผยแพร่ได้กำไรจากตำแหน่งที่โดดเด่นของเว็บไซต์ AMP ในสภาพแวดล้อมข่าวสาร ความสามารถในการใช้งานที่สูงของเว็บไซต์ที่ปรับให้เหมาะกับอุปกรณ์เคลื่อนที่ยังก่อให้เกิดสัญญาณเชิงบวกของผู้ใช้อีกด้วย
- ผู้ใช้ : เว็บไซต์ที่ใช้ AMP นั้นสมบูรณ์แบบสำหรับผู้ใช้ พวกเขาไม่ต้องรอนานในการโหลดหน้า และยังสามารถไว้วางใจในประสิทธิภาพสูงเมื่อเรียกดูผ่านการเชื่อมต่ออินเทอร์เน็ตที่ช้า
AMP และดัชนี Mobile-First Index
AMP เป็นเพียงแนวทางหนึ่งในการเพิ่มประสิทธิภาพเว็บไซต์สำหรับอุปกรณ์เคลื่อนที่ ความตระหนักในความสำคัญของการเพิ่มประสิทธิภาพอุปกรณ์เคลื่อนที่ ไม่ใช่แค่ในชุมชน SEO เท่านั้น โดยเฉพาะอย่างยิ่งตั้งแต่Google Updateในปี 2015 ที่มีจุดมุ่งหมายเพื่อส่งเสริมความเป็นมิตรกับมือถือของเว็บไซต์โดยเฉพาะ เครื่องมือค้นหา Google ได้ตั้งแต่ไปไกลไปสู่วิธีการที่มือถือเป็นครั้งแรกที่มีการประกาศว่าดัชนีมือถือของมันคือ – ในบางจุด – จะกลายเป็นหลักดัชนีใน Google ผลการค้นหา สิ่งนี้จะเพิ่มความสำคัญของ AMP เท่านั้น
นอกจาก AMP แล้ว ยังมีกลยุทธ์การเพิ่มประสิทธิภาพมือถืออื่นๆ รวมถึง Responsive Web Design หรือการใช้ URL มือถือแยกต่างหากกับ Progressive Web App
Accelerated Mobile Pages
