نویسنده: نیما جعفری

تست سرعت لود صفحه با Google Scorecard

تست سرعت لود صفحه با Google Scorecard

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

سنجش سرعت صفحه با گوگل اسپید اسکورکارد

پس از اعلام گوگل برای آپدیت الگوریتمش به نام آپدیت سرعت گوگل، این غول موتور جستجو با معرفی ابزاری جدید به نام Speed Scorecard، این امکان را برای سئوکاران و وبمستران فراهم کرد که بتوانند سرعت بارگذاری سایت خود توسط موبایل را با دیتای واقعی که از گوشی های موبایل کاربران در شبکه 4G و شبکه 3G کسب شده، بررسی کنند.

گوگل موبایل اسپید اسکورکارد
تست سرعت بارگذاری صفحه با Google Speed Scorecard

با توجه به تصویر بالا، شما می توانید کشور مورد نظر و همچنین شبکه موبایل 4G یا 3G را از لیست آبشاری انتخاب کرده و حداکثر سرعت لود صفحه 4 سایت را به طور همزمان با یکدیگر مقایسه کنید.

گوگل اطلاعات Speed Scorecard را از کجا می آورد

اطلاعات اسپید اسکورکارد از مرورگر کروم گوشی های موبایل کاربران به صورت ناشناس که Chrome User Experience Report نام دارد، جمع آوری می شوند. در حال حاضر اطلاعات گوگل اسپید اسکورکارد از کاربران موبایل 12 کشور آمریکا، کانادا، استرالیا، انگلیس، هلند، سوئد، آلمان، هند، ایتالیا، ژاپن، اسپانیا و فرانسه جمع آوری می شود و قرار است به تدریج کاربران بیشتری از کشورهای دیگر نیز به این اطلاعات افزوده شوند.

نمره سرعت کدام سایت ها در اسپید اسکورکارد در دسترس است

هم اکنون با Speed Scorecard می توانید اطلاعات سایتهای پرترافیک که عمده کاربران آنها در دوازده کشوری که در بالا به آنها اشاره شد وجود دارند را مشاهده کرده و سایتها را از نظر نمره سرعت لود صفحه با موبایل با یکدیگر مقایسه کنید. اگر سایت شما در آمار اسپید اسکورکارد موجود نبود، همچنان می توانید تاثیر سرعت بارگذاری صفحات بر درآمد سالیانه را از قسمت Impact Calculator که در زیر فرم Speed Scorecard وجود دارد را محاسبه کنید.

محاسبه تاثیر سرعت بارگذاری صفحه بر درآمد با Impact Calculator

با توجه به تاثیر مثبت افزایش سرعت بارگذاری صفحه بر استفاده کاربران از سایت که در نهایت منجر به افزایش درآمد سایت می شود، همان طور که در تصویر زیر مشاهده می کنید، گوگل ابزاری دیگر به نام Impact Calculator را جهت محاسبه سود حاصل از افزایش سرعت لود صفحات سایت در اختیار وبمستران و تحلیل گران گذاشته است.

محاسبه تاثیر سرعت بارگذاری صفحه بر درآمد با Impact Calculator
محاسبه تاثیر سرعت بارگذاری صفحه بر درآمد سالیانه با Impact Calculator

شماره هایی که در تصویر بالا مشخص شده اند به شرح زیر می باشند:

  1. نام دامین
  2. میانگین بازدید ماهانه
  3. میانگین ارزش هر سفارش یا فروش
  4. سرعت بارگذاری صفحه که در Speed Scorecard محاسبه شده و یا سرعت لود فرضی که قصد دارید تاثیر آن را بر درآمد سالیانه مشاهده کنید.
  5. نرخ تبدیل (نسبت سفارش به تعداد بازدید)
  6. تاثیر مثبتی که سریعتر شدن لود صفحه به میزان نمایش داده شده در قسمت 7 بر درآمد سالیانه سایت می گذارد.
  7. دکمه کشویی که توسط آن می توانید سرعت لود صفحه را به صورت دستی تغییر داده تا تاثیر آن را در قسمت 6 بر درآمد سالیانه سایت ببینید.

اگر سایت شما پرترافیک است، هم اکنون می توانید جهت سئوی حرفه ای سایت و تست سرعت بارگذاری صفحهات سایتتان و یا هر سایت پرترافیک دیگر به صفحه Winning on Mobile گوگل مراجعه نمایید. دقت فرمایید که متاسفانه این آدرس با IP ایران در دسترس نیست و جهت استفاده از این سرویس فعلا باید از آی پی آدرس غیر از ایران استفاده کنید.

AMP در گذر زمان

AMP در گذر زمان

پروژه امپ در سال 2015 به صورت متن باز معرفی شد. گوگل همواره بر روی پروژه AMP سرمایه گذاری کرده و در توسعه آن تلاش بسیاری کرده است. در اوایل معرفی AMP Project حدود 500 توسعه دهنده برای توسعه Accelerated Mobile Pages فعالیت می کردند و این رقم هم اکنون به حدود 15000 دولوپر رسیده که نشان دهنده اشتیاق توسعه دهندگان وب AMP است. قابلیت های متعددی در این مدت به صفحات امپ اضافه شدند که هدف آنها جذب بیشتر کاربر و بارگذاری سریعتر صفحه بود.

امپ از 2015 تا کنون

در ادامه، آنچه از ابتدای معرفی پروژه امپ روی داده است را به ترتیب گذر زمان مشخص کرده ایم:

Accelerated Mobile Pages 2015

  • 2015-08-07 معرفی پروژه امپ توسط گوگل

پروژه امپ در سال 2016

  • 2016-02-24 گوگل از پروژه امپ به صورت رسمی رونمایی کرد. البته در اوایل رونمایی از Accelerated Mobile Pages، فقط سایتهای خبری و بلاگ ها در نتایج جستجوی گوگل نمایش داده می شدند.
  • 2016-09-20 آغاز نمایش انواع صفحات AMP در صفحه نتایج سرچ توسط گوگل
AMP carousel در گوگل
AMP carousel در گوگل

 

Accelerated Mobile Pages 2017

  • 2017-03-07 گوگل در کنفرانس امپ اعلام کرد که موتور جستجو بایدو چین و یاهو ژاپن از صفحات امپ پشتیبانی می کنند و در نتیجه آن یک میلیارد نفر کاربر به استفاده کنندگان از صفحات AMP اضافه شد.
  • 2017-05-23 امکان استفاده از صفحات امپ در گوگل ادوردز امکان پذیر شد و از آن پس تبلیغ کنندگان می توانند آدرس URL صفحه amphtml خود را در سرویس گوگل ادوردز استفاده کنند.

صفحات امپ در گوگل ادوردز

پروژه امپ در سال 2018

  • 2018-02-13 گوگل از روشی جدید برای نمایش مالتیمدیا در صفحات امپ به نام AMP Stories رونمایی کرد. امپ استوری روشی جدید برای نمایش محتوا به کاربران موبایل است که امکان نمایش عکسهای متحرک و ویدیو را به کاربرانی که با موبایل در حال دیدن صفحه امپ هستند می دهد.
AMP Stories
AMP Stories

با توجه به اهمیت امپ در سئو به همه وبمستران و توسعه دهندگان توصیه می کنیم که راستای بهینه سازی سایت حرفه ای در صورتیکه هنوز سایتشان دارای صفحات امپ نیست، هر چه زودتر برای این کار برنامه ریزی کنند و اگر سایتشان دارای صفحات استاندارد امپ است، تلاش کنند تا با استانداردهای روز AMP جلو بروند و از قابلیت های صفحات امپ بیشترین بهره را ببرند. واژه “امپ کردن” صفحات و سایت آنقدر کاربردی بوده که عبارت انگلیسی Amplify به دایره لغات اضافه شده است.

همچنین در دنیای Mobile First این روزها، قویا توصیه می کنیم که برای پراگرسیو وب اپ یا PWA نیز برنامه ریزی داشته باشید که بتوانید کاربران بیشتری را جذب سایت خود کنید.

5 ماه فرصت دارید تا سایت خود را https کنید

5 ماه فرصت دارید تا سایت خود را https کنید

گوگل همواره اهمیت ویژه ای به امنیت کاربران در اینترنت قائل بوده است و از چند سال پیش، قبل از اینکه https بودن یکی از سیگنالهای محاسبه رنکینگ گوگل شود، شروع به تشویق وبمستران سایت ها برای حرکت از http به https کرد و پس از مدتی در آگوست سال 2014 اقدام به در نظر گرفتن https به عنوان یکی از سیگنالهای رنکینگ در الگوریتم هایش نمود که منجر به ارتقا رنکینگ صفحات https گردید.

درصد لود صفحات با https در سیستم عامل های مختلف
درصد لود صفحات با https در سیستم عامل های مختلف

پروتکل https آنقدر اهمیت داشت که از سال 2015 گوگل در راستای اعمال فشار بر سایتها برای امن شدن، شروع به ایندکس سایت ها با https به صورت پیشفرش نمود که البته این مورد فقط برای صفحاتی اعمال می شود که چند شرط زیر را دارا باشند:

  • همه منابع سایت با https بارگذاری شوند.
  • آدرسهای https با robots.txt بلاک نشده باشند.
  • آدرسهای https به آدرسهای http ریدایرکت نشوند.
  • صفحات دارای canonical با آدرسهای http نباشند.
  • صفحات دارای متا تگ noindex نباشند.
  • سرور دارای سرتیفیکیت TLS یا SSL معتبر باشد.

از ژانویه 2017 گوگل کروم همانند تصویر زیر اقدام به نمایش عبارت Not secure برای صفحات http که دارای فیلد پسورد و کردیت کارت بودند کرد.

رفتار گوگل کروم 53 و 56 در برابر صفحات http
رفتار گوگل کروم 53 و 56 در برابر صفحات http

حالا گوگل اعلام کرده است که در راستای ارتقا امنیت وب از ماه جولای سال 2018 در مرورگر گوگل کروم همانند تصویر زیر اقدام به نمایش عبارت Not secure در کنار آدرس همه صفحاتی که با http در دسترس هستند خواهد کرد.

رفتار گوگل کروم 64 و 68 در برابر صفحات http
رفتار گوگل کروم 64 و 68 در برابر صفحات http

بنابراین دیگر پروتکل http کم کم به انتهای راه خود رسیده است. اگر برای سئوی حرفه ای سایت برنامه ریزی دارید و اگر هنوز سایت شما با http در دسترس است هر چه سریعتر اقدام به تهیه و نصب سرتیفیکیت SSL کنید که هم با بی اعتمادی کاربران مواجه نشوید و هم با https شدن، سئوی سایتتان را بهبود ببخشید.

برای اینکه سایتی با پروتکل https در دسترس باشد نیاز به تهیه و نصب گواهی SSL دارد. سرتیفیکت های مختلف SSL وجود دارند که شما می توانید در راهنمای خرید گواهینامه SSL با آنها آشنا شوید تا بتوانید انتخاب هوشمندانه تری در خرید سرتیفیکیت SSL داشته باشید.

آینده PWA

آینده پراگرسیو وب اپ

مرورگر گوگل کروم در سیستم عامل اندروید از ابتدای معرفی PWA از آن پشتیبانی کرد و قرار است در آینده نزدیک Chrome Apps حذف شده و Progressive Web App به جای آن پا بر عرصه اپلیکیشن های تحت گوگل کروم برای همه سیستم عامل های لینوکس، ویندوز و مک بگذارد. به دلیل اهمیت اهداف PWA، بدیهیست که شرکت های بزرگ تولیدکننده مرورگر اینترنت و سیستم های تولید محتوا یا CMS از آن استقبال کنند.

برنامه ریزی وردپرس برای PWA

در همایش  توسعه دهندگان Progressive Web App که در اواخر سال 2017 برای اولین بار توسط گوگل برگذار شد، گوگل اعلام کرد که در حال همکاری با WordPress جهت افزودن قابلیت PWA به وردپرس ورژن 5 است. بدون تردید افزودن قابلیت PWA به وردپرس، نقطه عطفی در سیستم های تولید محتوا خواهد بود و تاثیر بسزایی بر سبک برنامه نویسی قالب ها و پلاگین ها خواهد داشت.

اضافه شدن PWA به وردپرس 5
اضافه شدن PWA به وردپرس 5

استقبال مرورگرهای اینترنتی مطرح از PWA

  • هم اکنون شرکت موزیلا با مرورگر فایرفاکس و همچنین شرکت اپرا با مرورگر Opera Mobile نیز از پراگرسیو وب اپ پشتیبانی می کنند.
  • شرکت مایکروسافت نیز رسما اعلام کرد که پس از آپدیت مارچ 2018 در مرورگر Microsoft Edge و همچنین در ویندوز 10 از پراگرسیو وب اپ پشتیبانی خواهد کرد و از آن تاریخ به بعد امکان آپلود این گونه اپ ها در Microsoft Store وجود خواهد داشت.
  • همچنین شرکت اپل نیز اعلام نمود که مرورگر Safari آن از iOS ورژن 11.3 از Progressive Web App پشتیبانی خواهد کرد.

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

 

PWA چیست

PWA یا پراگرسیو وب اپ چیست

نظرتان در مورد یک اپلیکیشن تحت وب که مانند اپلیکیشن واقعی که بر روی گوشی نصب می شود باشد چیست؟

Progressive Web App که به اختصار PWA گفته می شود برای همین هدف به وجود آمد. پس از معرفی و حمایت پراگرسیو وب اپ توسط گوگل در سال 2016 در کنفرانس Google I/O، این بار نیز PWA مانند پروژه AMP با استقبال توسعه دهندگان و شرکت های مطرح تولیدکننده مرورگر مانند مایکروسافت، موزیلا و اپل روبرو شد. پراگرسیو وب اپ ها به دو دسته کلی تقسیم می شوند:

  • سایت هایی که مانند اپلیکیشن رفتار می کنند.
  • اپلیکیشن های تحت وب

به عنوان نمونه اگر با مرورگر گوگل کروم بر روی دستگاه اندروید سایت https://www.webyooz.com را باز کنید، می توانید از طریق منوی گوگل کروم بر روی گزینه Add to Home screen بزنید و آیکون وب یوز را بر روی صفحه گوشی موبایلتان اضافه کنید. سپس می توانید با tap کردن بر روی آیکون مذکور از سایت وب یوز مانند یک اپلیکیشن تحت وب استفاده کنید. البته بنده در اینجا صرفا به ساخت یک نمونه بسیار ساده PWA کرده ام و جا دارد تا امکانات بیشتری را به PWA سایت وب یوز اضافه کنم.

وب یوز Progressive Web Appاهداف PWA از نظر گوگل

طبق توضیح گوگل، پراگرسیو وب اپ ها دارای چهار هدف اصلی هستند:

  1. قابل اطمینان (Reliable) هستند. چون کاربر با پیغام لود نشدن صفحه در اثر کندی یا قطعی اینترنت مواجه نخواهد شد.
  2. سریع هستند. علت سریع بودن آنها در کش شدن برخی فایلهای مورد نیاز در دستگاه کاربر است.
  3. جذاب هستند. جذاب بودن PWAها به دلیل تشابه آنها به اپلیکیشن های مرسوم روی گوشی های موبایل است و به همین دلیل کاربران از PWA بیشتر از یک سایت ساده استقبال می کنند.
  4. افزایش نرخ تبدیل (Conversion Rate). به عنوان مثال سایت AliExpress پس از افزودن قابلیت پراگرسیو وب اپ به سایتش با افزایش نرخ تبدیل به میزان 102% در همه مرورگرها و به میزان 82% در سیستم عامل iOS مواجه شد.

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

نمونه سایت PWA

از زمان معرفی Progressive Web App، شرکت های زیادی شروع به طراحی پراگرسیو وب اپ نمودند. در زیر می توانید برخی از سایت ها و اپلیکیشن هایی که به صورت PWA طراحی شده اند را ملاحظه بفرمایید. برخی از نمونه ها فقط بر روی موبایل به صورت PWA کار می کنند و برخی مانند دو نمونه آخر، قابلیت کار به صورت آفلاین در دسکتاپ را نیز دارند.

  1. سایت همایش توسعه دهندگان گوگل Google I/O که در آن حتی می توانید به صورت آفلاین اقدام به نوشتن کامنت نیز بکنید.
  2. سایت فروشگاه بزرگ اینترنتی AliExpress
  3. سایت شبکه اجتماعی اینستاگرام
  4. سایت تلگرام تحت وب
  5. سایت UBER
  6. سایت cnet
  7. سایت توییتر
  8. اپلیکیشن ادیت عکس SVGOMG که می توانید در آن به صورت آفلاین به ادیت عکس های با فرمت SVG کنید.
  9. اپلیکیشن کاهش سایز فایل عکس Smaller Pictures برای کاهش filesize عکس به میزان دلخواه

در تصویر زیر تعدادی از سایت های مطرح که دارای PWA هستند نمایش داده شده اند.

سایت های دارای PWA
برخی از سایت های دارای PWA

با توجه به روشن بودن آینده Progressive Web App و اهداف و مزیت های آن و همچنین تاثیر مثبت آن در سئوی حرفه ای و همچنین  به همه توسعه دهندگان و طراحان وب سایت توصیه می شود که به این مقوله نگاهی ویژه داشته باشند.