صفحات (AMP) موبایل چیست و چگونه از آن استفاده کنیم قسمت ۱

چگونه از صفحات اینترنتی پرسرعت در موبایل (AMP) استفاده کنیم

شرکت Google در حال ساخت و گسترش صفحات اینترنتی پر سرعت به عنوان صفحه نتایج جستجوهای اینترنتی در موبایل است ، اما شما چگونه می توانید از آن استفاده کنید؟

AMP چیست؟

در ماه اکتبر اخیر ، شرکت Google از تکنولوژی صفحات اینترنتی پر سرعت در موبایل (AMP) سخن به میان آورد که یک ساختار در دسترس به منظور ایجاد صفحات اینترنتی پرسرعت در موبایل می باشد. این ایده خلاقانه به صورت open source بوده و برای این منظور طراحی شده است که ناشران برنامه ها به راحتی بتوانند سرعت نرم افزارها
( در نهایت تجربه کاربر) را بهبود بخشند و این کار بدون هیچ گونه هزینه تبلیغاتی که ممکن است برای این ناشران حائز اهمیت باشد صورت می گیرد.
اگرچه ناشران باتجربه با استفاده از برنامه های بهینه سازی عملکرد می توانند به نتایج بهینه مشابه دست یابند اما اغلب آنها به دلیل محدودیت منابع از این کار چشم پوشی می کنند. AMP این امکان را فراهم می کند که این عملیات بهینه سازی به راحتی و بدون تغییر تنظیمات اصلی صفحات وب در موبایل قابل دستیابی باشند. همچنین مزایای زیادی در استفاده های آتی از خدمات شرکت Google و سایر شرکت های مشهور در زمینه تکنولوژی وب موجود می باشد که شما را به صورت شدید به استفاده از سکوهای جستجوی خود تشویق و جذب می کنند.

سیستم AMP چگونه کار می کند؟

سیستم AMP از سه بخش اساسی تشکیل شده است که به عنوان یک چارچوب برای ایجاد صفحات وب در موبایل استفاده می شود:
۱-AMP HTML : یک زیر مجموعه از HTML می باشد که این زبان علامت گذاری برخی برچسب ها و مشخصات ویژه دارد و از طرفی نیز دارای محدودیت هایی نیز می باشد. اما اگر با HTML معمول آشنا باشید، مشکلی با سازگاری صفحات موجود با AMP HTML نخواهید داشت.

۲-AMP JS : از سری چارچوب های JavaScript در صفحات موبایل می باشد. در اغلب بخش ها وظیفه مدیریت و کنترل منابع و بارگذاری غیر همزمان را بر عهده دارد. این نکته شایان ذکر است که استفاده از JavaScript طرف سوم همراه با AMP مجاز نمی باشد.
۳-AMP CDN : یک شبکه تحویل داده اختیاری می باشد ، این شبکه از صفحات AMP شما استفاده کرده ، آنها را ذخیره می کند و برخی عملیات بهینه سازی خودکار بر روی آنها انجام می دهد.

چگونه می توانید سایت خود را به AMP تبدیل کنید؟

برای تازه کاران ، شما باید حداقل ۲ نسخه از صفحات موضوعی خود را باز نگه دارید: صفحه نسخه اصلی که کاربران عموما آن را می بینند و نسخه AMP صفحه مورد نظر.
از انجایی که AMP اجازه استفاده از المان های فرم دهی و Java Script طرف سوم را نمی دهد شما ممکن است نتوانید فرم های پیشران در صفحات و بخش پیشنهادات داشته باشید و مجبور به استفاده از المان های دیگر برای کاربری استاندارد صفحات خود هستید.
(اگرچه هنوز چارچوب های مورد استفاده برای هک کردن برای حل این مشکل موجود می باشند ، باید از Conrad O’Connell برای کمک به تائید موضوع هک تشکر کرد)
ممکن است شما برای قرار دادن محدودیت ها مجبور به بازنویسی الگوی سایت خود باشید. به عنوان مثال، تمامی CSS های درون AMP باید در یک خط بوده و کمتر از ۵۰۰ کیلوبایت باشند. به علت فشردگی بارگذاری فونت های رایج ، آنها باید با استفاده از گسترش amp-font ویژه بارگذاری شوند که باعث افزایش کنترل بر روی بارگذاری آنها می شود.

برنامه های چند رسانه ای باید به صورت ویژه ای کنترل شوند. به عنوان مثال، تصاویر باید از المان رایج amp-img که دارای عرض و ارتفاع مشخص می باشند استفاده کنند (به هنگام تبدیل یک سایت قدیمی به الگوی AMP در صورتیکه مشخصات عرض و ارتفاع مشابه موارد مورد استفاده فعلی نباشند ، این کار نیازمند صرف زمان و زحمت زیادی خواهد بود) به علاوه اگر تصاویر شما به فرمت GIF و انیمیشن درآمده اند شما باید از یک فاکتور گسترش دهنده جداگانه دیگر به نام amp-anim استفاده کنید.

مشابه با تصاویر، یک برچسب رایج برای قرار دادن و بارگذاری ویدئوها از طریق HTML5 وجود دارد که تحت عنوان amp-video شناخته می شوند. اما برای قرار دادن ویدئوهای یوتیوب که بخش اعظمی از ویدئوهای وبسایت ها را شامل می شود یک فاکتور گسترش دیگر تحت عنوان amp-youtube موجود می باشد.
همچنین پشتیبانی از مسائلی همچون نمایش اسلاید از طریق amp-carousel و جعبه های خرید تصاویر از طریق amp-image-lightbox همچون رسانه های ارتباط جمعی مانند توئیتر، اینستاگرام ، فیسبوک و پینترست و واین از طریق فاکتورهای گسترش آنها موجود می باشد.
این برچسب ها و فاکتورهای گسترش دهنده به راحتی قابل استفاده هستند و تنها نیازمند برنامه ریزی در طراحی سایت شما می باشند. به منظور کمک به شرکت Google یا سایر شرکت های پشتیبان تکنولوژی و پروژه AMP ، برای شناسایی نسخه AMP صفحه شما ، تنها نیازمند اصلاح نسخه اصلی صفحه خود خواهید بود. صفحه اصلی شما باید شامل برچسب های زیر باشد که به ویژه برچسب canonical برای صفحات AMP ضروری است:

<link rel=”amphtml” href=”http://www.example.com/blog-post/amp/”>

صفحه جستجوی AMP همچنین یادآور می شود که سکوهای پشتیبانی کننده AMP نیازمند طرح و تم از Schema.org است که مشخص کننده محتویات و نوع صفحه می باشد (در حال حاضر نمونه های “مقاله”، “رسید”، “مرور” و “ویدئو” در لیست نوع صفحات ذکر شده در GitHub آورده شده اند.)

به علاوه این امر همچنین نشان می دهد که Schema.org یک پیش نیاز برای این موضوع است که محتویات صفحه شما واجد شرایط برای حضور در نسخه آزمایشی چرخه جستجوی خبر Google می باشند. بنابراین اگر به دنبال دریافت مزایای آتی Google با به کارگیری AMP هستید اطمینان حاصل کنید که طرح و تم درستی برای آن انتخاب کرده اید.