صفحات موبایل تسریع شده: AMP برای بهینه سازی موبایل وردپرس

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

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

برای پاسخگویی به این تقاضا برای بارگذاری سریع محتوا، برنامه‌های طراحی‌شده برای پلتفرم‌های تلفن همراه خاص در Apple (اخبار)، فیس‌بوک (مقالات فوری) و اسنپ چت (Discover) در دسترس هستند. اوایل امسال Google برای سرعت بخشیدن به تحویل محتوای تلفن همراه و ارائه تجربه کاربری بهتر، Accelerated Mobile Page (AMP) را معرفی کرد.

AMP چیست؟

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

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

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

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

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

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

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

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

چه چیزی در AMP متفاوت است؟

این سیستم تحویل محتوا بر اساس چارچوب AMP HTML است و سریعتر از HTML معمولی است زیرا،

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

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

چرا ناشران و وبلاگ ها باید AMP را فعال کنند

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

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

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

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

چه بهینه سازی هایی برای AMP لازم است

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

است

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

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

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

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

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

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

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

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

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

AMP برای WP – صفحات موبایل شتاب داده شده

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

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

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

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

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

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

آیا باید AMP را برای وردپرس اضافه کنید؟

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

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

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

با این حال، اگر می‌خواهید تجربه‌ای سریع و جذاب برای کاربران خود ایجاد کنید و آنها را مجبور به ماندن طولانی‌تر کنید، باید AMP را برای WordPress (یا هر نوع وب‌سایتی دیگری که ممکن است اجرا کنید) در نظر بگیرید. اگر نقطه‌ای در چرخ فلک AMP در صفحات جستجوی Google است که می‌خواهید آن را گوشه دهید، به AMP bandwagon بروید.