نقش AMP در وردپرس

گشت و گذار در اینترنت باید برای همه با استفاده از هر دستگاهی سریع و آسان باشد. توسعه دهندگان همواره در تلاش هستند تا با بهینه‌سازی عملکرد وب سایت‌ها و بهبود سرعت آن‌ها این امکان را فراهم کنند، بدین ترتیب یک راه عالی برای دستیابی به این امر بهره‌گیری از فناوری AMP است.

اوایل وب سایت‌ها برای صفحه نمایش‌های بزرگ طراحی می‌شدند. اما امروزه تعداد صفحه نمایش‌های کوچک‌تر در حال افزایش بوده و حتی از لپ‌تاپ‌ها و کامپیوترهای دسکتاپ هم پیشی گرفته‌اند. تلفن‌های همراه در حال حاضر 65 درصد از ترافیک رسانه‌های دیجیتال را تشکیل می‌دهند. بنابراین برای بارگیری صفحات به همان سرعتی که در صفحه‌های بزرگ‌تر صورت می‌گیرد، نیاز دارند.

برای پاسخگویی به این حجم از تقاضا به منظور بارگیری سریع محتوا، برنامه‌های طراحی شده در پلتفرم‌های موبایل جهت مرور اخبار و مقالات در دسترس هستند. به همین دلیل گوگل تصمیم گرفت صفحات شتاب‌یافته موبایل (AMP) را برای سرعت بخشیدن به تحویل محتوای تلفن همراه و ارائه تجربه کاربری بهتر معرفی کند.

AMP چیست؟

پروژه AMP توسط گوگل در اکتبر 2015 معرفی و در فوریه 2016 منتشر شد. این یک رویکرد متن باز است که به ناشران امکان می‌دهد یک بار محتوای بهینه شده برای موبایل ایجاد کنند و آن را به سرعت در همه جای وب برای تلفن همراه بارگیری نمایند.

در 24 فوریه 2016، گوگل شروع به استقرار محتوای سازگار با AMP در صفحه نتایج جستجوی تلفن همراه خود کرد. از آن پس کاربران می‌توانند موردی که می‌خواهند را انتخاب کرده و روی آن ضربه بزنند. طبق گزارش Pinterest صفحات 4 برابر سریع‌تر شده و صفحات معمولی به دلیل نحوه قالب‌بندی و تحویل محتوا کم‌تر برای موبایل مورد استفاده قرار می‌گیرند.

از آگوست 2016، گوگل بیش از 150 میلیون داکیومنت AMP در فهرست جستجوی خود دارد و با نرخ 4 میلیون در هفته رشد می‌کند. در اوایل ماه اوت، گوگل همچنین پیش‌نمایشی از جستجوی خود را برای محتوای تقویت شده آغاز کرد. همچنین قصد دارد تا اواخر سال جاری آن را به طور گسترده‌تری اجرا کند.

برای جستجوی فعال AMP می‌توانید از این لینک نگاهی اجمالی به صفحات بارگیری سریع داشته باشید، اما باید با استفاده از مرورگر تلفن همراه خود آن را بررسی کنید (روی کامپیوترهای دسکتاپ کار نمی‌کند).

چه وب سایت‌هایی باید از AMP استفاده کنند؟

در ماه فوریه این پروژه برای ناشران آغاز شد. اما پذیرش AMP بسیار فراتر از صنعت انتشارات به سرگرمی، مسافرت، تجارت الکترونیک و موارد دیگر گسترش یافته است.

گزارش‌های مطلوبی از پذیرندگان اولیه دریافت می‌شود. واشنگتن پست با بهبود 88 درصدی زمان بارگیری برای صفحات AMP، افزایش 23 درصدی تعداد کاربران تلفن‌های همراه را گزارش می‌دهد. eBay یکی از شرکت‌های بزرگ تجارت الکترونیک است که با نزدیک به 15 میلیون صفحه محصول مبتنی بر AMP، به این فناوری روی آورده است. انتظار می‌رود در مدت کوتاهی تعداد این صفحات افزایش یافته و در جستجو قرار گیرند.

اما چه وب سایت‌هایی باید از AMP استفاده کنند؟ قطعا آن‌هایی که ترافیک بالایی از موبایل می‌گیرند. اما با توجه به این‌که کاربران زیادی استفاده از دستگاه‌های تلفن همراه را برای وب‌گردی انتخاب می‌کنند، پس می‌توان گفت لازمه هر وب سایتی است.

چه تفاوت‌هایی در AMP وجود دارد؟

این سیستم تحویل محتوا بر اساس فریمورک HTML AMP توسعه یافته و سریع‌تر از HTML معمولی است، زیرا:

• یک نسخه خاص از HTML معمولی است، منهای تمام محتوای جاوا اسکریپت. برای جاوا اسکریپت، فریمورک به کتابخانه مشترک AMP JS متکی است.
• محتوا در حافظه کش ذخیره می‌شود و در یک سرویس ابری مشترک قرار می‌گیرد، بنابراین زمان واکشی اطلاعات از سرور حذف می‌گردد.

تفاوت‌های بسیار بیشتری وجود دارد، اما دو مورد ذکر شده در بالا می‌تواند درک سریع و گسترده‌تری به شما بدهد.

چرا ناشران و وبلاگ نویس‌ها باید از AMP استفاده کنند؟

تا زمانی که خواندن مطالب با بارگیری آهسته در تلفن همراه یک تجربه دلسردکننده برای کاربران باقی بماند، ناشران درآمد حاصل از تبلیغات در تلفن همراه را از دست می‌دهند. اما AMP به جذب و حفظ بازدیدکنندگان برای مدت طولانی در وب سایت کمک می‌کند و پتانسیل درآمدزایی از طریق کلیک‌های بیشتر را دارد.

صفحات AMP در کنار یک آیکون رعد و برق ظاهر می‌شوند تا از صفحات وب معمولی متمایز شوند. کاربرانی که روی این گزینه کلیک می‌کنند، مستقیما به محتوای AMP منتقل می‌شوند. نه تنها این محتوا سریعا در جستجوی گوگل قرار می‌گیرد، بلکه از طریق پلتفرم‌های اجتماعی مانند Twitter، LinkedIn، WordPress، Parse.ly، Adobe Analytics، Nuzzel و Pinterest نیز قابل دسترسی خواهد بود.

به علاوه ناشران برای مشاهده عملکرد صفحات خود به Google Analytics دسترسی خواهند داشت. آن‌ها می‌توانند بهترین محتوای خود را مشخص کنند و از آن برای بهینه‌سازی عملکرد وب سایت و تجربه کاربری بهره بگیرند.

AMP مزیت دیگری را ارائه می‌دهد که از عملکرد بالا و تجربه کاربر مراقبت می‌کند، بنابراین منابع ناشران را می‌توان بر روی ارائه محتوای عالی متمرکز کرد.

چه بهینه‌سازی‌هایی برای AMP مورد نیاز است؟

AMP در حالت کلی نوعی بهینه‌سازی وب سایت است که طبق نیاز گوگل به روشی یکسان انجام می‌شود. بهینه‌سازی‌های مختلفی که برای سازگار کردن صفحات وب با AMP باید انجام دهید عبارتند از:

• فقط کدهای ناهمزمان را مجاز به اجرا کنید - این کار برای جلوگیری از تأخیر در رندر کردن صفحه انجام می‌شود. در این صورت دیگر نمی‌توانید از هیچ کد جاوا اسکریپتی که ایجاد می‌کنید استفاده نمایید و باید برای مدیریت محتوای تعاملی صفحات خود به عناصر AMP تکیه کنید. جاوا اسکریپت تنها در iframes مجاز است، اما به شرطی که مانع رندرینگ نشود.
• همه منابع را به صورت استاتیک مشخص کنید - AMP صفحات را بدون منتظر ماندن برای دانلود منابعی مثل تصاویر و iframe بارگیری می‌کند. اندازه این منابع باید در HTTP ذکر شود، بنابراین اندازه و موقعیت آن‌ها قبل از شروع دانلود باید مشخص باشد.
• اجازه ندهید مکانیزم افزونه‌ها رندرینگ را مسدود کنند - اگر قرار است هر افزونه‌ای در صفحه گنجانده شود، اسکریپت سفارشی باید سیستم را در مورد آن مطلع کند. بنابراین فضایی برای افزونه مورد نظر ایجاد می‌شود، حتی قبل از این‌که AMP بداند شامل چه مواردی است. افزونه‌ها عموما برای لایت باکس‌ها، محتوای اینستاگرام و توییت‌ها مناسب هستند؛ زیرا رندر صفحه را مسدود نمی‌کنند، حتی اگر به درخواست‌های HTTP اضافی نیاز داشته باشند.
• فایل‌های جاوا اسکریپتی شخص ثالث را خارج از مسیر اصلی نگهداری کنید - کدهای سفارشی جاوا اسکریپت فقط در sandbox iframeها مجاز هستند. به این ترتیب بارگیری صفحه اصلی را مسدود نمی‌کنند.
• کدهای CSS باید به صورت درون خطی و محدود به اندازه باشند - این کار به کاهش تعداد درخواست‌های HTTP در مسیر اصلی کمک می‌کند.
• به کارگیری فونت‌ها باید کارآمد باشد - سیستم AMP به درخواست‌های HTTP تا زمانی که فونت‌ها شروع به دانلود نشوند اجازه نمی‌دهد.
• محاسبات مجدد را به حداقل برسانید - محاسبات مجدد رندرینگ را به تاخیر می‌اندازد، بنابراین باید به حداقل برسند.
• فقط انیمیشن‌های دارای GPU را اجرا کنید - همه انیمیشن‌ها باید بتوانند روی GPU (واحد پردازش گرافیکی) اجرا شوند.
• بارگیری منابع را در اولویت قرار دهید - چرا که ابتدا فقط محتوای مورد نیاز بارگیری می‌شوند، سپس تبلیغات و تصاویر واکشی می‌گردند اما فقط در صورت لزوم به نمایش درمی‌آیند. به این ترتیب تقاضا برای CPU به حداقل می‌رسد.
• صفحات را در یک لحظه بارگیری کنید – عملیات پیش‌رندرینگ پهنای باند و توان پردازشی زیادی مصرف می‌کند. به همین جهت AMP ابتدا فقط محتوای مورد نیاز را بارگیری کرده و بعد iframes شخص ثالث و سایر منابع را فقط در صورت لزوم دانلود می‌کند.

طیف استانداردی از قالب‌های تبلیغاتی، شبکه‌های تبلیغاتی و فناوری‌ها از این طریق در دسترس خواهد بود. در عین حال ناشران نیز می‌توانند قالب‌های خود را انتخاب کنند، مادامی که سرعت را پایین نیاورد.

نحوه استفاده از AMP در وردپرس

گوگل آموزشی دارد که می‌توانید برای ایجاد صفحات AMP بر پایه HTML، مرحله‌بندی آن‌ها، اعتبارسنجی برای سازگاری با AMP، انتشار و توزیع صفحات به آن مراجعه کنید. اعتبارسنجی صفحات AMP مهم است، زیرا به این ترتیب اشخاص ثالث مانند توییتر و اینستاگرام مطمئن هستند که صفحات به خوبی در پلتفرم‌هایشان نمایش داده می‌شوند.

همچنین تا آنجا که به وب سایت‌های میزبانی شده در WordPress.com مربوط می‌شود، به طور خودکار برای وردپرس پشتیبانی شده‌اند و نیازی به انجام هیچ کار اضافه‌ای نیست. اینگونه وب سایت‌ها می‌توانند با نصب یک پلاگین، AMP را برای وب سایت خود در وردپرس فعال کنند.

AMP plugin

پس از دانلود، نصب و فعال‌سازی AMP plugin در وردپرس، پست‌های شما به طور خودکار دارای یک نسخه AMP تولید شده به صورت پویا خواهند بود. همچنین با افزودن amp در انتهای URL خود (example.com/my-post/amp) می‌توانید به این صفحات دسترسی داشته باشید. اگر Permalink را فعال ندارید، amp=1? را به لینک‌های خود اضافه نمایید (example.com/?p=100&amp=1 است). مرحله آخر این است که صفحات خود را همانطور که در بالا ذکر شد تست و اعتبارسنجی کنید.

شما اصلا متوجه تنظیمات یا ویژگی‌های این پلاگین نخواهید شد. فقط یک گزینه اضافه شده به داشبوردتان برای AMP Analytics وجود دارد که می‌توانید کد پیکربندی JSON خود را جای‌گذاری کنید.

این یک پلاگین رسمی ساخته شده توسط Automattic است که در حال حاضر از صفحات و آرشیوها پشتیبانی نمی‌کند و نمی‌توانید صفحات را شخصی‌سازی کنید. اما یک ابزار بسیار ساده برای استفاده است و می‌توانید از طریق این لینک در گیت هاب برای سفارشی‌سازی آن راهنمایی‌هایی را بیابید.

AMP for WP

یکی دیگر از گزینه‌های عالی AMP for WP است. این پلاگین رایگان راه‌اندازی سریع و آسانی را ارائه می‌دهد. فقط کافی است آن را نصب کنید، تنظیمات را فعال کنید و شروع به تولید خودکار AMP برای وب سایت خود نمایید.

به علاوه یک سری تنظیمات داخلی برای AMP شامل افزودن تبلیغات، داده‌های ساختاریافته (بخش مهمی از سئو)، ادغام متا تگ Yoast SEO، گزینه‌های پیشرفته index/no-index، افزودن نوتیفیکیشن، ترجمه‌های سفارشی (اگر از زبانی غیر از انگلیسی استفاده می‌کنید) و موارد دیگر وجود دارد.

مهم‌تر از همه، این پلاگین گزینه‌هایی برای طراحی ارائه می‌دهد تا بتوانید ظاهر خروجی AMP خود را سفارشی کنید. همچنین می‌توانید از تم‌های پیش‌فرض AMP استفاده کرده یا از AMP Theme Framework برای ایجاد طرح‌های منحصر به فرد کمک بگیرید.

AMP for WP افزونه‌های خوبی را برای اضافه کردن ویژگی‌ها (مانند CTA یا حافظه کش) و پشتیبانی از پلاگین‌های محبوب مانند WooCommerce، Advanced Custom Fields و Contact Form 7 ارائه می‌دهد.

ابزارهای بیشتر برای افزودن AMP در وردپرس

علاوه بر موارد بالا پلاگین‌های دیگری که می‌توانند به شما در زمینه AMP برای وب سایت‌های وردپرسی کمک کنند، عبارتند از:

• WP AMP - برای ایجاد طراحی AMP سفارشی و بهبود سئو بدون کدنویسی.
• Accelerated Mobile Pages ( AMP ) for WordPress - برای ایجاد قالب AMP.
• Custom AMP - برای کمک به سفارشی کردن محتوای AMP.
• Facebook Instant Articles & Google AMP Pages - برای انتشار و مدیریت محتوا به طور مستقیم از وردپرس به صفحات Google AMP با پشتیبانی از ads و analytics.
• Glue for Yoast SEO & AMP - برای اطمینان از اینکه پلاگین AMP پیش‌فرض وردپرس از متا دیتا سئو مناسب Yoast استفاده کرده و امکان اصلاح طراحی صفحه AMP را فراهم می‌کند.

آیا AMP درحال حاضر کاربرد دارد؟ 

فارغ از مواردی که تا به اینجا کار گفته شد یک سوالی که پیش خواهد آمد این است که آیا AMP در حال حاضر کاربرد دارد یا خیر؟ 

AMP مانند هر تکنولوژی دیگری یکسری مزایا و یکسری معایب دارد اما در حال حاضر با توجه به تجربیات بسیار زیادی که روی این تکنولوژی انجام شد، بیشتر توسعه دهندگان حرفه‌ای متوجه شده‌اند که این تکنولوژی تنها برای یکسری از وبسایت‌ها با تعداد کم می‌تواند جوابگو باشد چرا که AMP در بیشتر سایت‌های امروزی نمی‌تواند کاربرد مناسبی داشته باشد. دلایل بسیاری برای این موضوع نیز وجود دارد که ما در زیر به آن‌ها اشاره خواهیم کرد.

• پیاده سازی AMP معمولا با در نظر گرفتن هماهنگی با بخش‌های مختلف وبسایت کار سخت و معمولا پر از مشکل است.
• AMP بیشترین پتانسیل برای ایجاد تداخل در وبسایت را دارد چرا که روی پلاگین‌های مختلف و از همه بیشتر روی پوسته‌ای که نصب کرده‌اید تاثیر می‌گذارد.
• AMP جدای از وبسایت‌های وبلاگی و خبری که فقط یکسری محتوای متنی/تصویری را به شما نمایش می‌دهند، در تمام حالت‌های دیگر باعث می‌شوند که کارکرد و فانکشنالیتی وبسایت شما تقلیل پیدا کند و بسیاری از بخش‌های مهم را در نسخه منحصر به فرد خود از بین ببرد.

بنابر دلایل گفته شده کارایی این تکنولوژی در بیشتر وبسایت‌های مهم امروزی که خبری یا وبلاگی نیستند از بین رفته و با توجه به تجربیات بدست آمده کسی از این دست تکنولوژی‌ها استفاده نمی‌کند.