اجرا AMP و آزمایش آن روی وردپرس: راهنمای ۷ مرحله‌ای

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

کاربران توقع دارند صفحات موبایل نیز همچون صفحات کامپیوتری به سرعت بارگذاری شوند. آمازون، یکی از بزرگترین فروشگاه‌های آنلاین، به این نتیجه رسیده است که حتی یک ثانیه تاخیر در بارگذاری صفحه باعث کاهش ۱.۶ میلیارد دلاری درآمد سالانه‌اش می‌شود.

صفحات پر سرعت موبایل (AMP) به سرعت در حال تبدیل شدن به نمونه‌ای از صفحات با سرعت بارگذاری بالا هستند. با استفاده از پیش بارگذاری صفحه، AMP ها قادرند بدون از بین بردن هیچگونه عملکردی، ۱۵ تا ۸۰ درصد سریعتر از صفحات استاندارد تلفن همراه بارگذاری شوند. در حالی که نحوه اجرای AMP بسته به CMS سیستم مدیریت محتوا شما متفاوت است، وردپرس می‌تواند محیطی آزمایشی مناسبی برای پیش نمایش آنچه در صفحه AMP شما اجرایی است را به شما نمایش دهد.

برای فعال کردن AMP در وردپرس، می‌توانید از این راهنمای هفت مرحله‌ای سریع استفاده کنید.

توجه: بخش‌هایی از این راهنما فرض می‌کنند که افزونه Yoast SEO را به عنوان بخشی از راه اندازی وردپرس خود فعال کرده‌اید. اگر این افزونه را ندارید، می‌توانید بخش‌هایی که در اینباره صحبت می‌کند را در نظر نگیرید – اگر در خصوص سئو و وردپرس صفحه خود جدی هستید، پیشنهاد می‌کنیم از این افزونه استفاده کنید.

مرحله ۱: افزونه AMP خود را نصب و فعال کنید

افزونه AMP ساخته شده توسط Automattic برای شروع اجرای AMP لازم است. این افزونه اصلی است که برای کار با AMP به آن نیاز دارید.

افزونه اصل که باید نصب کنید

افزونه AMP بطور خودکار نسخه‌های سازگار با AMP پست‌های شما را تولید می‌کند، که شما می‌توانید با افزودن عبارت /amp/ در انتهای URL خود، آن را مشاهده کنید. به عنوان مثال:

URL اصلی:

https://example.com/aa-bb-277080

AMP URL:

https://example.com/aa-bb-277080/amp

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

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

افزونه AMP for WP: از ویژگی های قابل توجه این افزونه می توان به ادغام Google AdSense، پشتیبانی از برچسب rel = canonical و امکان ایجاد محتوای AMP که با محتوای موجود در صفحات استاندارد تلفن همراه متفاوت است، اشاره کرد.

افزونه Glue for Yoast SEO & AMP:  یکی از مزایای استفاده از این افزونه این مسئله است که به شما این امکان را می‌دهد تا صفحات، پست‌ها و محتوای سازگار با AMP تهیه کنید. افزونه Glue for Yoast & AMP همچنین اطمینان حاصل می‌کند که افزونه پیش فرض AMP از ابر داده‌ای درستی استفاده می‌کند. همانند AMP for WP ، امکان  پیش‌نمایش شخصی صفحات AMP وجود داشته و حتی می‌توان یک لوگو سفارشی را انتخاب کرده و نحوه نمایش آن در وب سایت خود را در صفحه AMP تغییر دهید.

توجه: برای اینکه این افزونه کار کند، باید افزونه Yoast SEO را نصب و فعال کنید.

مرحله ۲: راه اندازی گوگل آنالیتیکس Google Analytics

برای تنظیم صفحات خود برای ردیابی Google Analytics، ابتدا باید شناسه ردیابی خود را پیدا کنید. وارد Google Analytics شوید، سپس روی نماد چرخ دنده در پایین سمت چپ کلیک کنید تا پنل Admin ظاهر شود. هنگامی که ACCOUNT و PROPERTY را از منوهای کشویی مربوطه انتخاب کردید، روی «Tracking Info » در ستون PROPERTY کلیک کنید. از آنجا، روی «Tracking Code» کلیک کنید تا شناسه ردیابی خود را ببینید – شناسه باید با UA شروع شود.

کد آنالیتیکس را مطابق عکس وارد کنید

شناسه ردیابی خود را کپی کنید ، سپس وارد WordPress شوید. در بخش سمت چپ، به AMP> Analytics بروید و شناسه ردیابی خود را در جایی که عبارت «Google Analytics» نوشته شده است، قرار دهید و سپس روی گزینه Save Changes کلیک کنید.

مرحله ۳: تنظیمات افزونه را پیکربندی کنید

در این مرحله، من در مورد برخی از تنظیمات اساسی افزونه Glue for Yoast SEO که در مرحله ۱ ذکر شد، صحبت می‌کنم. اگر شما قصد استفاده از این افزونه را ندارید، می‌توانید این مرحله را نادیده بگیرید.

تنظیمات پیشنهادی در اینجا به شما این امکان را می‌دهد تا ظاهر و احساس صفحات پرشتاب موبایل خود را تنظیم کنید و همچنین پشتیبانی ای ام پی را برای انواع مختلف محتوای چند رسانه‌ای فعال کنید.

برای شروع به قسمت Yoast SEO > AMP > Post Types بروید. در اینجا شما قادر به انتخاب نوع  پست متناسب  هستید.

نحوه فعال سازی برای هر دسته از پست‌ها

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

مرحله ۴: تنظیم خود را آزمایش و معتبر کنید

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

خوشبختانه، چندین راه‌حل برای آزمایش URLها شما وجود دارد. چند صفحه کلیدی را انتخاب کنید و نسخه‌های ای ام پی را با استفاده از یکی از روش‌های زیر آزمایش کنید. همانطور که در مرحله ۱ ذکر شد، می توانید برای مشاهده یک URL استاندارد، در انتهای آن amp/ ضمیمه کنید.

گزینه ۱: تست صفحات

به سایت https://search.google.com/test/amp مراجعه کنید

URL خود را در اینجا کپی کنید و بر روی گزینه «اجرای تست» کلیک کنید و نتیجه را یادداشت کنید.

باید این پیغام را ببینید

گزینه ۲: کنسول توسعه دهنده

این گزینه مخصوص کسانی است که از مرورگر Google Chrome استفاده می‌کنند. اگر از مرورگر دیگری استفاده می‌کنید ، این گزینه برای شما مناسب نیست.

• صفحه  را در مرورگر خود باز کنید
• # development = 1 را به URL اضافه کنید
• مثال:

تست اعتبار سنجی در کورم

http:// example.com/hhh-sss-/amp/#development=1

• کنسول Dev Tools کروم را باز و خطاهای اعتبارسنجی را بررسی کنید.
• اگر همه چیز صحیح باشد، اعتبارسنجی باید موفق باشد.

خطاها را یکی یکی در اینجا ببینید

گزینه ۳: اعتبار سنجی

• به سایت https://validator.ampproject.org/ بروید
• URL AMP را در قسمت URL جاگذاری کرده و بر روی گزینه Validate کلیک کنید.
• این ابزار هر گونه خطایی را برجسته می‌کند و آنها را در HTML پرچم گذاری می‌کند.

نکته: شما همچنین می‌توانید از افزونه AMP Validator Chrome extension استفاده کنید تا همان نتایج مشابه را در URL AMP خود مشاهده کنید.

مرحله ۵: مهم‌ترین URLهای AMP خود را برای ایندکس شدن در گوگل ارسال کنید

اگر از تست AMP از طریق کنسول جستجوی گوگل استفاده می‌کنید، می‌توانید هنگامی که آزمون را اجرا کردید و صفحه تأیید شد، بر روی دکمه submit to Google  کلیک کنید:

نمایی از بخش amp در گوگل سرچ کنسول و خطا‌های آن

از طرف دیگر، اگر به حساب جستجوی کنسول گوگل خود وارد شوید، می‌توانید گزینه submit to Google  را جستجو کرده و URL را مستقیماً در نتایج جستجوی گوگل ارسال کنید:

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

مرحله ۶: به منظور عیب‌یابی خطاها، کنسول جستجوی گوگل را بررسی کنید

کنسول جستجوی گوگل راهی برای مدیریت همه صفحات شما در یک مکان مختصر را ارائه می‌دهد.

• وارد کنسول جستجوی گوگل شوید.
• از ستون سمت راست بخش enhancements  کلیک کنید. در صورت شناسایی صفحات amp شما یک گزینه amp به این قسمت اضافه شده است .
• تعداد خطاها و صفحات معتبر یا valid را در این قسمت می توانید ببینید

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

مرحله ۷: سرعت AMP را تست کنید

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

با AMP شروع کنید!

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

خلاصه مطلب