PageSpeed Insights چیست + آموزش و راهنمای خطایابی

طبق آمار گوگل اگر سرعت بارگذاری سایت برای کاربران موبایلی بیشتر از ۳ ثانیه طول بکشد، نزدیک به ۵۳ درصد از کاربران بی‌خیال دیدن آن سایت می‌شوند. این مسئله نشان می‌دهد که افزایش سرعت لود سایت چقدر مهم است. برای اندازه‌گیری سرعت سایت از نظر گوگل می‌توانید از ابزار PageSpeed Insights استفاده کنید. این ابزار توسط گوگل ارائه شده و استفاده از آن رایگان است. در این مقاله می‌خواهیم درباره‌ی نحوه‌ی عملکرد ابزار تست سرعت PSI صحبت کنیم و سپس به آموزش استفاده از آن بپردازیم.

PageSpeed Insights چیست و چرا باید از آن استفاده کنیم؟

برای تست سرعت سایت ابزارهای متعددی در دسترس است. قبلاً در مقاله‌ی «بهترین ابزارهای تست سرعت سایت» به معرفی این ابزارها پرداخته‌ایم؛ اما از بین تمامی ابزارها، PageSpeed Insights یک ویژگی مهم دارد که آن را نسبت به رقبا متمایز می‌کند. این ابزار تست سرعت رایگان توسط خود گوگل معرفی و توسعه داده شده است.

سئوکارها و دیجیتال مارکترها علاقه‌ی زیادی دارند که همه‌ی مسائل را از نگاه گوگل ببینند. مثلاً دوست دارند بدانند که سرعت سایت‌شان از نظر گوگل چطور است؟ به همین دلیل علاقه‌ی خاصی به ابزار PageSpeed Insights دارند. این ابزار می‌تواند عملکرد سایت را در نمایش موبایلی و دسکتاپ آنالیز کرده و گزارش کامل آن را در اختیار کاربر قرار دهد.

 به جز مسئله‌ای که گفتیم، ۲ ویژگی دیگر هم وجود دارد که عملکرد PageSpeed Insights را نسبت به سایر ابزارهای تست سرعت متمایز می‌کند:

۱.     استفاده از داده‌های واقعی

 PageSpeed Insights برای تست سرعت و عملکرد سایت از داده‌های میدانی (Field Data) استفاده می‌کند. درواقع می‌آید تجربیات واقعی کاربران را طی ۲۸ روز گذشته درنظر می‌گیرد و براساس داده‌های واقعی عملکرد سایت را آنالیز می‌کند. درنتیجه گزارش این ابزار به واقعیت نزدیک‌تر است. دیگر ابزارها به این داده‌های عملی دسترسی مستقیم ندارند. پس اگر می‌خواهید تجربه‌ی کاربران را هنگام ورود به سایت درک کنید، این ابزار کمک زیادی به شما می‌کند.

۲.     استفاده از داده‌های آزمایشگاهی

در کنار داده‌های واقعی، PageSpeed Insights برای اینکه تست سرعت و عملکرد سایت را به طور لحظه‌ای هم ثبت کند، از داده‌های آزمایشگاهی (Lab Data) کمک می‌گیرد. تحلیل لحظه‌ای سایت توسط موتور LightHouse و در یک محیط کنترل شده انجام می‌شود.

نکته‌ی دیگر اینکه وقتی از پیج اسپید اینسایتس استفاده می‌کنید، می‌توانید آنالیز سایت را براساس شاخصه‌های اصلی گوگل (Core Web Vitals) ببینید.

آشنایی با فاکتورهای کلیدی Core Web Vitals

برای اینکه در استفاده از PageSpeed Insights به مشکل نخورید و گزارش‌های آن را بهتر درک کنید، لازم است با اصطلاح Core Web Vitals آشنا باشید. گوگل برای سنجش تجربه‌ی کاربری سایت‌ها سه شاخصه‌ی اصلی را در نظر می‌گیرد که این شاخصه‌ها با اصطلاح Core Web Vitals شناخته می‌شوند. این سه فاکتور عبارتند از:

۱.LCP (Largest Contentful Paint)

این فاکتور نشان‌ دهنده‌ی مدت زمانی است که بزرگ‌ترین عنصر صفحه (مثلاً عکس شاخص یا ویدئو یا حتی عنوان اصلی) لود شده و برای کاربر به نمایش درمی‌آید. از نظر گوگل عدد LCP باید زیر ۲.۵ ثانیه باشد.

۲. INP (Interaction to Next Paint)

تعامل تا نمایش بعدی یا INP معیاری است که گوگل از سال ۲۰۲۴ آن را جایگزین FID کرد. این معیار نشان می‌دهد که وقتی کاربر در سایت روی چیزی کلیک می‌کند، چقدر طول می‌کشد تا مرورگر فریم بعدی رندر کرده و نمایش دهد. از نظر گوگل باید مقدار INP کمتر از ۴۰ میلی‎ثانیه باشد.

۳.CLS (Cumulative Layout Shift)

احتمالاً گاهی پیش آمده که وارد سایتی می‌شوید، سپس می‌خواهید روی لینکی یا عنوانی کلیک کنید؛ اما همان لحظه یک تبلیغ ظاهر شده یا مکان لینک جابه‌جا می‌شود. فاکتور CLS این پرش‌های آزاردهنده را هدف قرار داده و مدت‌زمانی که صفحه به ثبات می‌رسد را اندازه می‌گیرد. از نظر گوگل این عدد باید زیر ۰.۱ باشد.

در جدول زیر نشان داده‌ایم که از نظر گوگل و البته PageSpeed Insights باید این معیارها چه وضعیتی داشته باشند.

آشنایی با سایر فاکتورهای مهم در PageSpeed Insights

در کنار سه فاکتوری که مربوط به Core Web Vitals هستند، ابزار تست سرعت PageSpeed Insights دو فاکتور FCP و TTFB را نیز اندازه‌گیری می‌کند. آشنایی با این دو فاکتور هم برای تحلیل مشکلات سایت لازم است. تعریف این دو فاکتور را در ادامه مشاهده می‌کنید:

•   فاکتور FCP (First Contentful Paint): این فاکتور زمانی را ثبت می‌کند که اولین المان از محتوای سایت (مثل متن، تصویر، لوگو و…) روی صفحه‌ی مرورگر ظاهر می‌شود. قبل از نمایش اولین المان صفحه کاملاً سفید است، اما با مشاهده‌ی اولین المان متوجه می‌شود که صفحه در حال بارگذاری است و فقط باید کمی منتظر بماند.
•   فاکتور TTBF (Time to First Byte): این فاکتور برای اندازه‌گیری مدت زمانی است که مرورگر شما اولین بایت اطلاعات را از سمت سرور سایت دریافت می‌کند. وقتی وارد سایت می‌شوید یا روی لینکی کلیک می‌کنید، مرورگر درخواستی را به سمت سرور می‌فرستد. سرور باید این درخواست را پردازش کرده و پاسخ را برگرداند. به‌محض اینکه اولین بایت پاسخ به مرورگر می‌رسد، زمان TTBF ثبت می‌شود. ایده‌آل‌ترین زمان برای این فاکتور زیر ۲۰۰ میلی‎ثانیه است؛ اما تا ۸۰۰ میلی‌ثانیه هم استاندارد محسوب می‌شود.

آموزش قدم به قدم تحلیل عملکرد سایت با PageSpeed Insights

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

قدم اول: دریافت گزارش از PageSpeed Insights

برای شروع باید وارد سایت PageSpeed Insights شوید. سپس در باکس آنالیز آدرس وب‌سایت مدنظرتان را وارد کنید. حالا روی گزینه‌ی Analyse بزنید و منتظر بمانید تا گزارش پیج اسپید اینسایتس آماده شود. نکته مهم اینکه ممکن است نیاز باشد از VPN برای ورود به این سایت استفاده کنید.

قدم دوم: تعیین نوع دستگاه برای ارائه گزارش

ابزار PageSpeed Insights در حالت عادی گزارش را برای حالت Mobile آماده کرده و نشان می‌دهد؛ اما همزمان با این گزارش، می‌توانید حالت نمایش Desktop را نیز دریافت کرده و ببینید. با این حال چون گوگل ابتدا صفحات موبایلی را ایندکس می‌کند، سئوکارها ترجیح می‌دهند اول مشکلات سرعت سایت را برای نمایش موبایلی حل کنند. نکته‌ی مهم اینکه گوگل برای سنجش سرعت نمایش موبایلی سخت‌گیری بیشتری هم دارد. درنتیجه اگر مشکلات این بخش را حل کنید، سرعت نمایش سایت روی دسکتاپ هم تا حد زیادی بهبود می‌یابد.

قدم سوم: تحلیل بخش Discover what your real users are experiencing

بخش اول گزارش PageSpeed Insights با سرتیتر Discover what your real users are experiencing مشخص شده است. این بخش نشان می‌دهد که کاربران واقعی سایت شما را چطور می‌بینند و چه تجربه‌ای از ورود به آن دارند. گوگل برای سنجیدن این مسئله از همان معیارهای Core Web Vitals استفاده می‌کند. در بخش قبلی این معیارها را معرفی کردیم. در تحلیل این بخش می‌توانید از همان جدول سنجش معیارهای Core Web Vitals کمک بگیرید. در ضمن خود گزارش هم به‌صورت رنگی وضعیت سایت‌تان را نشان می‌دهد. معیارهایی که از نظر گوگل وضعیت مساعدی دارند، سبزرنگ هستند. رنگ نارنجی هم به معنای لب مرز بودن است. رنگ قرمز نیز نشان می‌دهد که باید هرچه سریع‌تر سراغ بهبود مشکلات بروید.

قدم چهارم: خواندن گزارش Diagnose performance issues

یکی از مزیت‌های مهم PageSpeed Insights این است که علاوه بر سنجش وضعیت سایت بر مبنای داده‌های واقعی ۲۸ روزه، بخشی هم برای سنجش وضعیت فعلی سایت دارد. وضعیت فعلی سایت با استفاده از داده‌های آزمایشگاهی موتور LightHouse سنجیده می‌شود. گزارش وضعیت فعلی سایت را می‌توانید در بخش Diagnose performance issues ببینید. گوگل در این مرحله به سایت شما امتیازی از ۰ تا ۱۰۰ می‌دهد.
از نظر گوگل اگر امتیازات این بخش بین ۹۰ تا ۱۰۰ باشد، یعنی سایت شما در وضعیت خیلی خوبی است. امتیاز ۵۰ تا ۸۹ هم نشان می‌دهد که سایت‌تان نیاز به بهبود دارد. اگر امتیاز سایت بین ۰ تا ۴۹ هم باشد که نشان‌دهنده‌ی مشکلات جدی سایت است که نیاز به پیگیری سریع دارد.

بیشتر بخوانید : بهترین افزونه بهینه سازی تصاویر وردپرس

شاخص‌های موجود در این بخش شامل Performance، Accessibility، Best Practices و SEO می‌شود. اگر کمی صفحه را اسکرول کنید، می‌بینید که برای پرفورمنس یا همان عملکرد سایت یک گزارش دیگر هم در دسترس است. در این گزارش همان معیارهای FCP، LCP، TBT و CLS اندازه‌گیری می‌شوند. همچنین در این بخش می‌توانید عدد Speed Index را نیز مشاهده کنید.

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

نکته‌ی مهم ۲: برخی از مدیران یا سئوکاران وسواس زیادی برای رسیدن به امتیاز ۹۰ تا ۱۰۰ دارند؛ اما امتیاز ۱۰۰ نباید هدف شما در بهینه‌سازی سایت باشد. گاهی اوقات ممکن است اضافه کردن یک ویژگی کاربردی به سایت، مثل چت باکس آنلاین، باعث شود تا امتیازهای بخش Performance از ۹۵ به ۸۵ برسد. این کاهش امتیاز به نفع تجربه‌ی کاربر است. پس اتفاق ناگواری محسوب نمی‌شود.

قدم پنجم: خطاهای سایت و آموزش رفع آن‌ها

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

۱)  خطای Property size images (بهینه‌سازی تصاویر)

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

۲) خطای Eliminate render-blocking resources

این خطا توضیح می‌دهد که مشکل سرعت بارگذاری سایت به فایل‌های CSS و جاوا اسکریپت برمی‌گردد. برای رفع این خطا باید کدهای جاوا اسکریپت غیرضروری را به انتهای صفحه منتقل کنید؛ یا اینکه از ویژگی defer و async در تگ اسکریپت استفاده کنید.

۳)خطای Reduce Initial Server Response Time (TTFB)

خطای TTBF به این معناست که سرور شما خیلی دیر به درخواست کاربر پاسخ می‌دهد. به همین دلیل هم سرعت لود صفحات پایین آمده است. استفاده از پلاگین‌های کش وردپرس و استفاده از یک شبکه توزیع محتوای (CDN) مناسب می‌تواند تا حد زیادی مشکل را حل کند. گاهی هم نیاز است که سراغ تعویض هاست سایت بروید. خواندن دو مقاله‌ی «بهترین افزونه کش وردپرس» و «بهترین CDN برای وردپرس» می‌تواند برای حل این مشکل به شما کمک کند.

۴)خطای Efficiently encode images

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

سخن آخر

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