درباره ایران سئو، خدمات SEO و بهینه سازی سایت بیشتر بخوانید

طراحی AMP و تاثیر آن بر سئو

طراحی AMP و تاثیر آن بر سئو

سال نوی میلادی، 2017 را با مقاله ای جدید آغاز می کنیم؛ سالی که دنیای سئو و طراحی سایت روی اسمارت فون ها حساس تر از قبل خواهد بود و AMP یکی از همین تکنولوژی هاست. از زمان انتشار Google Accelerated Mobile Pages - AMP در آبان 94 در حال رصد این تکنولوژی هستیم تا بدانیم AMP‌ چیست؟ چطور کار میکند؟ چرا به وجود آمده و چه زمانی باید از AMP‌ استفاده کنیم؟ در این مقاله سعی میکنیم به تعدادی از سوالات شما در این زمینه پاسخ بدهیم.


سرعت سایت مهم است

یکی از نکات بسیار مهم در طراحی سایت توجه به سرعت سایت است. سرعت سایت میتواند یک تجارت رو به نابودی بکشاند. طبق تحقیقی که در این زمینه صورت گرفته فقط افزایش سرعت سایت به میزان یک ثانیه میتواند Conversion Rate رو به میزان 27 درصد و نرخ خروج یا Bounce Rate رو به میزان 56 درصد بهبود بخشد. بنابراین سرعت سایت تاثیر مستقیمی بر تجربه کاربری و اهداف تجاری دارد.

حالا یک نکته مهم را در نظر بگیرید. 39 درصد کاربران موبایل از مشاهده سایت ها در موبایل راضی نیستند. یعنی به طور میانگین از هر 5 نفر که با موبایل وب گردی میکنند 2 نفر از این موضوع راضی نیستند و وب گردی با موبایل را رضایت بخش نمیدانند. و جالب است بدانید که در حال حاضر حدودا 2 میلیارد تلفن هوشمند در دنیا وجود دارددر کشورهایی مانند آمریکا تعداد مراجعه به وب سایت ها با استفاده از موبایل در حال پیشی گرفتن از کامپیوترهای رومیزی است. طبق یک آمار دیگر 75 درصد از کاربران موبایل معتقدند که سرعت سایت ها در موبایل پایین است و 46 درصد از کاربران موبایل دیگر به سایت های با سرعت پایین سر نمیزنند.

این آمارها بسیار قابل توجه هستند. حالا یکبار دیگه به این جمله دقت کنید که فقط افزایش حدودا یک ثانیه ای سرعت لود شدن سایت میتواند تجارت شما را نجات دهد.

پس با بررسی آمارهای بالا یک نکته بسیار واضح میشود و آن اینکه آینده دنیای وب متعلق به موبایل های هوشمند است. بنابراین باید برای رفع مشکل سرعت سایت در موبایل ها راه حلی پیدا کرد. به دلیل اهمیت این موضوع شرکت های مختلف راهکارهای مختلفی در این زمینه ارائه دادند. فیس بوک تکنولوژی Instant Article را معرفی کرده و اپل روی Apple News کار میکند و گوگل AMP را معرفی کرده است. AMP‌ یک پروژه متن باز است که برای حل مشکل سرعت در موبایل به وجود آمده است.



چطور AMP‌ از سایت های مرسوم سریع تر است؟

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

فقط اسکریپت های نا همگام یا async:

اسکریپت های ناهمگام آنهایی هستند که با تقدم و تاخر در سایت لود میشوند. مثلا بعد از لود کامل صفحه اجرا میشوند. تمام این اسکریپت ها توسط AMP‌ بلاک میشوند. ساده تر اینکه به طور کلی AMP‌ امکان استفاده از Javascript ها رو به شما نمیدهد. فقط اسکریپت هایی میتوانند در صفحه لود شوند که توسط خود AMP‌ با در نظر گرفتن سرعت آماده شده باشند. اسکریپت هایی مانند گوگل آنالیتیکز و فیس بوک و توئیتر و یوتیوب از این دسته هستند. اسکریپت های خارجی هم فقط به صورت iFrame میتوانند به صفحه اضافه شوند آن هم فقط یکبار. اسکریپت هایی مانند Google Ads از این دسته هستند.

منابع باید حتما دارای ابعاد باشند:

اجزا مانند عکس ها و iframe ها حتما باید دارای اندازه و ارتفاع باشند تا AMP بتواند سایز آنها رو قبل از دانلود بداند.

عدم اجازه به هیچ چیز در جهت رندر شدن صفحه:

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

CSS ها باید به صورت inline و با حجم مشخص استفاده شود:

بر خلاف سایت های مرسوم که معتقدند فایل های css باید در درون html لینک شوند در AMP شما ملزم به استفاده از inline CSS ها هستید. دلیل این موضوع نیز مانند اسکریپت هاست. در زمان لود صفحه باید همه اجزایی که برای لود صفحه لازم هستند به صورت هم زمان لود شوند. برای اطمینان از کارکرد صحیح CSS ها حجم آنها نباید بیشتر از 50 کیلوبایت باشد.

فونت ها باید به صورت کارآمد لود شوند:

وب فونت ها میتوانند خیلی بزرگ باشند و گاها تاثیر مخربی بر روی سرعت سایت دارند. در یک موقعیت عادی مرورگرها دانلود فونت ها رو تا زمان دانلود CSS و اسکریپت ها به تعویق می اندازند و این زمان زیادی را برای دانلود فونت ها تلف میکند. در AMP اسکریپت ها به صورت هم زمان لود میشوند و css ها نیز به صورت inline نوشته میشوند بنابراین مرورگها برای دانلود فونت ها منتظر نمی مانند.

انیمیشن ها تنها در پردازنده های گرافیکی قابل اجرا هستند:

برخی از انیمیشن ها نیاز دارند تا قالب بندی صفحه را تغییر دهند تا اینکه این فعالیت را در پردازنده گرافیکی انجام دهند. AMP انیمیشن ها رو محدود میکند به Transform و Opacity بنابراین به تغییر قالب بندی صفحه نیاز نیست و انیمیش ها در پردازنده گرافیکی اجرا میشوند در نتیجه سرعت افزایش پیدا میکند.

اولویت بندی در لود منابع صفحه:

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

صفحات در یک لحظه لود میشوند:

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

برای دیدن مثالهایی از نحوه به کارگیری AMP در طراحی سایت ، ادامه مقاله را دروپالیون بخوانید.



آیا AMP بر رتبه ها اثر می گذارد؟

چیزی که لازم است گفته شود آن است که AMP پارامتری برای ارزیابی صفحات در رتبه بندی نیست اما بر تعداد کلیک در نتایج جستجو، میزان حضور سایت در نتایج (Impression)، و تجربه کاربری اثر می گذارد و به عبارت دیگر بر سئو سایت اثر می گذارد. تخمین ها حکایت از آن دارد که AMP در سال 2017 مهم تر خواهد شد. سایتها و به ویژه سایتهای خبری اگر قصد بهره بردن از این تکنولوژی جدید را دارند باید به 3 مورد زیر، توجه نمایند:

  1. عنوان های جذاب که کاربران را به کلیک کردن تشویق می کنند.
  2. تصاویر جذاب و جلب توجه کننده در ابتدای خبر
  3. صد کلمه ابتدای متن که به اندازه کافی کاربر را ترغیب به خواندن ادامه مطلب کند.
بنابراین پیشنهاد می شود طراحان سایت پیاده سازی اصولی AMP را در دستور کار خود قرار دهند. خوشبختانه سیستم های مدیریت محتوایی چون وردپرس و دروپال ابزارهایی برای اعمال AMP در سایت را در اختیار می گذارند.


پیش از این گوگل اعلام کرده است که بیش از 50 درصد جستجوها در سراسر دنیا از روی موبایل انجام می شود. اینکه شما چقدر به AMP یا آمار گوگل علاقه دارید شاید کمتر مهم باشد زمانیکه بدانید برای کاربران، سرعت مسئله ای مهم است.

بخش اول نوشته را عرفان بناکار نوشته اند. بخش دوم که به سئو مرتبط است به کمک این مقاله تهیه شد: Does Google AMP Affect SEO