تأثیر AMP بر وبسایت های وردپرس

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

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

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

AMP چیست؟

در اکتبر ۲۰۱۵، پروژه AMP توسط گوگل معرفی شد و در فوریه ۲۰۱۶ منتشر شد. این یک رویکرد متن باز است که به ناشران امکان می‌دهد یک بار محتوای بهینه شده برای موبایل ایجاد کنند و سپس آن را به سرعت در همه جای وب برای تلفن همراه بارگیری نمایند.

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

از ماه آگوست ۲۰۱۶، گوگل بیش از ۱۵۰ میلیون داکیومنت AMP در فهرست جستجوی خود دارد و با نرخ رشد هفتگی ۴ میلیون، به سرعت در حال گسترش است. در اوایل ماه اوت، گوگل همچنین پیش‌نمایشی از جستجوی خود را برای محتوای تقویت شده آغاز کرد و قصد دارد تا به طور گسترده‌تری این را اجرا کند، تا پایان سال جاری.

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

کدام سایت‌ها لازم است از AMP استفاده کنند؟

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

گزارش‌های بسیار خوبی از پذیرش AMP توسط اولین کاربران آن دریافت شده است. به عنوان مثال، واشنگتن پست با بهبود ۸۸ درصدی زمان بارگیری برای صفحات AMP، افزایش ۲۳ درصدی تعداد کاربران تلفن همراه را گزارش کرده است. همچنین، شرکت eBay یکی از شرکت‌های بزرگ تجارت الکترونیک است که با نزدیک به ۱۵ میلیون صفحه محصول مبتنی بر AMP، به این فناوری روی آورده است. انتظار می‌رود که تعداد صفحات AMP و جستجوی آن‌ها در مدت کوتاهی افزایش یابد.

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

معایب و مزایای AMP چیست؟

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

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

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

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

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

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

به علاوه، ناشران با استفاده از AMP می‌توانند به 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 صفحات در حین ایجاد آن‌ها، بسیار مهم است؛ زیرا با این روش، شما مطمئن می‌شوید که صفحات برای نمایش در پلتفرم‌های مختلف، از جمله توییتر و اینستاگرام، مناسب هستند.

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

AMP plugin

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

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

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

AMP برای وردپرس

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

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

مهم‌تر از همه، این پلاگین گزینه‌هایی را برای طراحی صفحات AMP شما فراهم می‌کند تا بتوانید ظاهر خروجی 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 جدا از وبسایت‌های وبلاگی و خبری که فقط یکسری محتوای متنی/تصویری را به شما نمایش می‌دهند، در تمام حالت‌های دیگر باعث می‌شود که کارایی و فانکشنالیتی وبسایت کاهش یابد و بسیاری از قابلیت‌های مهم را در نسخه منحصر به فرد خود از بین ببرد.

بنابراین، با توجه به دلایل گفته شده، عملکرد این تکنولوژی در بسیاری از وبسایت‌های مهم امروزی که خبری یا وبلاگی نیستند، تحت تأثیر قرار می‌گیرد و با توجه به تجربیات حاصل شده، توسعه دهندگان بیشتر از این تکنولوژی استفاده نمی‌کنند.