AMP یک پروژه سرعت بخشیدن به صفحات موبایل است که توسط گوگل ایجاد و پشتیبانی می‌شود.
AMP یک پروژه سرعت بخشیدن به صفحات موبایل است که توسط گوگل ایجاد و پشتیبانی می‌شود. گوگل به وسیله آن می‌تواند سرعت بارگزاری صفحات را در دستگاه‌های موبایلی افزایش داد. در تاریخ 24 فوریه 2016، گوگل رسما لیست AMP را در نتایج جستجوی خود قرار داد. صفحاتی که از کدگذاری AMP استفاده می‌کنند، در جاهای خاصی از نتایج جستجو ظاهر می‌شوند و یا با علامت مخصوص AMP به نمایش در می‌آیند.
AMP شامل AMP HTML، کتابخانه AMP JS و حافظه (Cache) گوگل AMP می‌باشد. زمانی که صفحه وب برای استفاده موبایلی بهینه نباشد، خطر افزایش شاخص‌های منفی بالا می‌رود؛ اگر صفحه در حداکثر 3ثانیه بارگزاری نشود، 30 درصد از کاربران صفحه را ترک می کنند. محصول نهایی AMP بازدهی سایت‌ها را در اینترنت به شدت بهبود می‌بخشد. این تکنولوژی فقط به تکنیک‌هایی برای ایجاد صفحات محدود نمی‌شود، در واقع شامل HTML معمولی با چندین محدودیت و اضافه شدن برچسب‌های تخصصی است و کارهای اضافه بیشتری نیاز ندارد. AMP JS این اطمینان را ایجاد می‌کند که محتوا با سرعت و وضوح بارگزاری شوند، در حالی که محتواهایی مانند تبلیغات در اولویت قرار نمی‌گیرند. این تکنولوژی کشف کرد که محتویاتی که به سرعت بارگزاری می شوند، سریعتر هم خوانده می‌شود.
نحوه ساخت AMP وب سایت
1-ساختن صفحه AMP HTML
2- تگ تصویر
3- اصلاح ارائه و لایه
4- پیش نمایش و اعتباربخشی
5- آماده کردن صفحه برای کشف و توزیع
6- قدم‌های پایانی پیش از انتشار
1-ساختن صفحه AMP HTML
در داخل سایت AMPProject.Org قطعه کد HTML وجود دارد که باید آن را به عنوان یک فایل با پسوند HTML کپی و ذخیره کنید. محتوای در تگ body نسبتا آسان است. اما در تگ head در صفحه، کدهای بسیار اضافه‌تری موجود است که ممکن است بلافاصله آشکار نشود.
2- تگ تصویر
اکثر تگ‌های HTML را می‌توان به طور مستقیم در AMP HTML به کار برد، اما تگ‌های خاصی مانند تگ <img> جایگزین تگ‌های مساوی یا کمی سفارشی از AMP HTML می‌شود (و برخی از تگ ها ممنوع می باشند).
3- اصلاح ارائه و لایه
صفحات وب: برای بخش ظاهری صفحه از مشخصات عمومی Css استفاده می شود. عناصر ظاهری از کلاس یا Inline Stylesheet در <head> استفاده می کند که <Style amp-Custom> نام دارد.
هر صفحه AMP فقط می‌تواند یک Stylesheet واحد جاسازی شده داشته باشد و چندین Selector مشخص که شما اجازه استفاده از آن را ندارید.
4- پیش نمایش و اعتباربخشی
پیش نمایش: پیش نمایش در صفحه AMP مانند پیش نمایش هر سایت استاتیک HTML است. هیچ چیز از پیش طراحی شده یا قدم دیگری نیاز نیست.شما می توانید انتخاب کنید:
• باز کردن صفحه در مرورگر به طور مستقیم از file system (بعضی از عناصر ممکن است به خاطر اشکال در XMLHttpRequests کار نکنند).
• استفاده از وب سرور محلی مانند Apache2 یا Nginx
اعتبار بخشی، اطمینان حاصل کنید صفحه AMP واقعا معتبر باشد.
5- آماده کردن صفحه برای کشف و توزیع
در برخی موارد، ممکن است شما یک صفحه مشابه با هر دو نسخه با AMP و هم بدون این تکنولوژی داشته باشید، برای مثال مقاله خبری. این را در نظر بگیرید، اگر جستجوی گوگل نسخه بدون Amp صفحه را پیدا کند، چگونه می تواند بفهمد که یک نسخه AMP هم وجود دارد؟
ربط دادن صفحات به وسیله <link>:
برای پیاده سازی صفحه non-AMP و AMP باید با آنها مانند یک زوج رفتار کرد؛ ما اطلاعات صفحه AMP را در صفحه non-AMP اضافه می‌کنیم و بالعکس، این کار را در قالب برچسب <link> و در <head> انجام می‌دهیم.
اگر فقط یک صفحه باشیم چطور؟
اگر شما فقط یک صفحه داشته باشید، و آن هم یک صفحه AMP باشد، شما بازهم باید از یک لینک استاندارد استفاده کنید، لینکی که به سادگی به نوع این صفحه اشاره می‌کند.
"این نکته را مدنظر داشته باشید که در این 5 مرحله قطعه کدهایی در تگ‌های مختص به خود وجود دارند که میتوانید با جستجویی ساده این قطعه‌ها را بدست بیاورید. وب سایت ampproject.Org که وب سایت رسمی AMP می‌باشد، می‌تواند در این راه به شما کمک کند".
نحوه نصب AMP روی وب سایت وردپرسی
خب می‌دانید که در بسیاری از دستگاه‌های موبایلی، بارگزاری متن‌ها کند است. این تکنولوژی را می توان از طریق کدهای html و Javascript اجرا کرد. به زبان ساده طریقه عملکرد این تکنولوژی به این صورت است که محتوای سایت در حافظه یا همان کش Google AMP ذخیره می‌شود و بعد از ورود دوباره کاربر، سایت از روی کش به سرعت لود می‌شود. وب سایت‌های معتبری همچون توییتر، لینکدین و ... از این ابزار استفاده می‌کنند.
پشتیبانی از Google Analytics باعث شده تا AMP با قابلیت جست و جوی گوگل سازگار باشد.مانند نصب همه افزونه های وردپرس، نصب AMP هم روی وردپرس آسان است. این افزونه که مخفف عبارت Accelerated Mobile Pages می‌باشد را از مخزن افزونه وردپرس دانلود کرده و در فولدر پلاگین‌ها (Plugins) بارگزاری کنید. بعد از نصب و فعال کردن این افزونه اگر در پایان مقاله خود متن /amp را بیفزایید، نسخه آن را مشاهده خواهید کرد.
تنظیمات بیشتر AMP
برای اعمال تنظیمات و Customize بیشتر به پلاگین AMP for WP – Accelerated Mobile Pages نیاز دارید که آن را هم باید نصب و فعال کنید. زمانی که آن را فعال کردید و اگر وارد بخش نمایش AMP شوید خواهید دید که ویژگی‌های بیشتری به آن اضافه می‌شود و دستتان برای افزودن قابلیت‌های بیشتر بازتر است.
AMP JS
کتابخانه JavaScript از بهترین شیوه‌های عملکردی استفاده می‌کند، مدیریت منابع بارگزاری شده مهمترین ویژگی آن می‌باشد. این بخش باعث می‌شود تا شما اطمینان داشته باشید که صفحه، با سرعت هرچه بیشتر به کاربر ارائه می شود.
تکنیک‌های دیگری برای افزایش کارایی می‌باشد که شامل پیش محاسبه (Pre-Calculating) لایه و تمامی عناصر آن پیش ازلود شدن منابع، غیرفعال کردن CSS Selector و تمامی iframe ها می‌باشد.
amp این تکنولوژی چگونه کار می کند؟
AMP برای بارگزاری سریع صفحات، ترکیبی از عناصری برای بهینه سازی صفحه است. جاوا اسکریپت، ممکن است برای بهبود بخشیدن هر بخشی در صفحه استفاده شود، اما همچنین ممکن است رندر کردن صفحات را به تاخیر بیندازد. برای جلوگیری از تاخیری که جاوا اسکریپت در رندر کردن صفحه می‌اندازد، AMP تنها به صفحات ناهمگون اجازه می دهد. این صفحات AMP هر جاوا اسکریپتی که توسط وب مستر (مدیر وب) نوشته شده باشد را ممنوع می‌کند و در عوض از جاوا اسکریپت قانونی و معینی استفاده می‌کند؛ صفحات تعاملی باید تنها از عناصر سفارشی AMP تشکیل شده باشد. این عناصر سفارشی می‌تواند جاوا اسکریپت را در هسته تشکیل دهند، آنها باید به طور خاصی طراحی شوند تا اطمینان حاصل شود که تداخلی در عملکرد صفحه وب به وجود نمی‌آورند.
منابعی نظیر iframeها، تبلیغات یا تصاویر باید اندازه خود را درون HTML تعیین کنند تا AMP بتواند اندازه آنها را در هر بخش و موقعیت آنها پیش از دانلود تمامی منبع، شناسایی کند.
AMP اجازه نمی دهد که مکانیزم‌های توسعه رندر کردن صفحه را بلاک کنند.AMP برای گسترش مواردی همچون Instagram، Tweets، lightboxes و غیره، سودمند می‌باشد.