اگر شما هم وب سایتی داشته باشید که بخواهی آن را از بابت لود سایت برسی کنید ، سریعا به ابزار های تست لود سایت مراجعه می کنید. از معروف ترین و حرفه ای ترین ابزار های شناسایی تست معیار های لود سایت و پرفورمنس ، جی تی متریکس است.
همانطور که میدانید در این ابزار های معیار های و سربرگ های متفاوتی در جهت این که شما چه جور وب سایت دارید را نشان می دهد. به طور صریح تر ، الان با به وجود آمدن خواسته های بیشتر کاربران از وب سایت ها ، تجربه کاربری خوب بر پایه core web vitals بنا شده و باید طبق نیاز های کاربر و راحتی او سرعت لود وب سایت بهینه سازی شود.
پرفورمنس در ج تی متریکس یکی از سربرگ ها و معیار های مهم در این ابزار است که مجموع امتیاز های اصلی تجربه کاربری و لود سایت را به ما نشان می دهد. در حدود 70 درصد امتیاز gtmetrix grade را معیار های پرفورمنس تشکیل میده که باید تمام اون ها طبق اصول و چیزی که در لایت هاوس گوگل تنظیم شده ، بهینه سازی و انجام بشه.
به طور کلی ما از معیار های زیادی در performance جی تی متریکس داریم که با انتخاب سربرگ ان به تمام این معیار های خواهیم رسید. در ادامه به تمام معیار های و اطلاعات صفحه و سربرگ performance خواهیم پرداخت.
پادکست :
پرفورمنس از چه معیار هایی تشکیل شده؟
در پرفورمنس جی تی متریکس ، به خصوص وب سایت های ایرانی ، به دلیل اینکه بر حسب معیار ها لایت هاوس و جی تی متریکس کار نشده ، معمولا امتیاز آن بین 10 تا 50 است. که شما با داشتن همچین امتیازی باز هم باید خدا را شاکر باشید. زیرا وب سایت های ایرانی نسبت به هاستینگ های آ« ها و مواردی که طبق آن جلو میروند ، تقریبا قدیمی بوده و به روز نیستند.
در قسمتی از این صفحه و سربرگ باز شده با تیتری به نام performance metrics که 6 شاخص اصلی در این قسمت را برای شما معرفی کردیم.
تمام این شش مورد از معیار های اصلی پرفورمنس هستند که در امتیازی که از هر کدام حاصل می شود، درصدی را از امتیاز کلی performance تشکیل خواهد داد.
آشنایی با معیار fcp پرفورمنس
FCP : این معیار به این اشاره دارد که وب سایت مورد نظر در چه مدت زمانی ، اولین محتوا را به کاربر نشان می دهد. برای درک بهتر باید یک ریز معیار دیگری وجود دارد که در قسمت پایینی این 6 معیار قرار دارد با تیتر browser timings قرار دارد. این معیار first paint نام دارد و به این معنی است که اولین علائمی از نمایش را به کاربر نشان می دهد. در عکس مربوطه می توانید خوب متوجه شوید منظور چیست.
تفاوت این دو معیار در نمایش محتوا و نمایش علائم لود است. در first paint شما فقط علائم رنگی از اینکه وب سایت در حال بارگذاری است را خواهید دید اما در fcp شما محتوا هایی را نیز در حین لود وب سایت خواهید دید که درحال کامل شدن هستند.
محاسبه این شاخص به این شکل است که در آن از اولین لحظه ورود و ارسال اطلاعات سرور به کلاینت ، تا به نمایش گذاتشه شدن و رندر شدن اولین محتوا در صفحه مرورگر است. بعد از این معیار شروع به محاسبه ترتیبی سایر معیار ها است.
استانداردی که برای این مورد از سمت خود وب سایت جی تی متریکس تعیین شده به شرح زیر است :
برای این که در پرفورمنس یک نمره خوبی از fcp داشته باشید باید سرور خود را تقویت کنید و سراغ بهینه سازی کد های وب سایت خود بروید. این بهینه سازی خوب در حدود حداکثر 15 درصد از امتیاز performance را از جانب fcp افزایش می دهد. به عنوان مثال :
Lcp : این معیار همان مخفف largest contentful paint است. این معیار همان طور که از معنی کردن اون متوجه می شویم ، به معنی به نمایش گذاشته شدن محتوا هایی است که حجم سنگین و بزرگ هستند می باشد. به حالت صریح تر این معیار محاسبه می کند که در حین لود وب سایت و شکل گرفتن fcp ، اولین آیتم ها و المان های بزرگی که به کاربر به نمایش گذاشته می شوند کدامند.
همانطور که واضح هستش ، محتوای و آیتم های سنگین و بزرگ ، می تواند یک بنر برگی از معرفی سایت باشد و یا یک اسلایدری که زمان بیشتری می برد تا به کاربر نشان داده شه. یا آیتم های سنگین دیگری که برای اینکه شکلی از اون به نمایش گذاشته شه ، و کاربر یک مفهومی از آن را متوجه شود ، می تواند از شکل گیری کامل lcp در پرفورمنس باشد.
نکته مهم در مورد lcp این است که در حدود 25 درصد از امتیاز performance رو تشکیل میده. پس نه تنها خیلی تاثیر گذار هستش ، بلکه از این بابت که باید هر چه سریعت تر بهینه سازی بشه هم مهم هستش.
و محاسبه lcp بیشتر از این نقطه است که مثلا اگر شما بنر و یا تیتر و آیتم سنگینی دارید که کاربر باید آن را ببینید ، در چه مدت زمانی طول می کشد که حجم بالایی که آن دارد ، درمرورگر اون paint یا همان نمایش داده شود.
معیاری که خود جی تی متریکس برای این موضوع در نظر گرفته به شکل زیر هستش :
برای اینکه بتوانیم lcp را بهینه کنیم و ببینیم پرفورمنس چه تاثیری در سئو دارد ، مواردی را قسمت زیر در خصوص آن آورده ایم.
Si : این معیار نیز همانند lcp به قسمت اول وب سایت که بالاترین نقطه آن است ، و در اولین لحظه به کاربر نشان داده می شود ، اشاره دارد. اما با fcp و lcp متفاوت هستش.
این معیار با در نظر داشتن اینکه اولین محتوا در بالاترین قسمت صفحه مورد نظر ، نسبت به اندازه صفحه نمایش مرورگر ، در چه مدت زمان به نمایش گذاشته می شود ، محاسبه خود را انجام میدهد.
در نظر داشته باشید که بالاترین قسمت از وب سایت ، منظور اول صفحه مورد نظر است که هیچ اسکرولی صورت نگرفته و اصطلاحا above the fold نام دارد. به طور کلی این شاخص 15 درصد از امتیاز پرفورمنس را به خود اختصاص داده و بر این مبنا امتیاز می دهد که نمایش سریع بصری در اولین قسمت از وب سایت که به نمایش گذاشته می شود ، در چه مدت زمان صورت می گیرد.
استانداردی که خود وب سایت جی تی متریکس برای این موضوع در نظر گرفته به شرح زیر است :
معمولا بهینه سازی خود معیار های fcp و lcp که روی پرفورمنس تاثیر گذار هستند ، در مجموع روی si نیز تاثیر می گذارد. اما موارد مهمی که می توان به صورت اختصاصی به بهینه سازی SI پرداخت به شرح زیر است.
هدف اصلی این معیار تجربه کاربری بهتر هستش و طبق یک فرمول خاصی از ریاضی محاسبه خود را انجام میده. به طور کلی نیازه تا از مرورگر های بهتری برای ایندکس کردن استفاده شه و از طرفی سرعت در نمایش محتوای بصری خیلی مهمه و در performance تاثیر گذار هستش.
Tti : در صفحه گزارشات پرفورمنس بعد از این موارد از معیار ها باید به مورد tti بپردازیم. این مورد اطلاعات را بعد از به نمایش در آمدن محتوا ها و آیتم ها می سنجد. در معیار های قبلی در نظر داشته باشید که آن ها فقط در صدد نشان دادن و به نمایش درآمدن محتوا و آیتم ها بودند. اما حال اگر کاربر بخواهد با آیتم هایی که ری اکشن دارند و می خواهند با آن تعامل داشته باشند چه می شود.
این موضوع بر میگردد به این که المان ها ، آیتم ها ، دکمه ها ، لینک ها و … که با کلیک کردن و رفتار کاربر قرار است تا ، تعامل و ری اکشن داشته باشد. اما نکته اینجاست که این ری اکشن و تعامل با کاربر ، در مدت زمان های معینی مسدود است و نمی تواند ری اکشنی را به کاربر نشان دهد.
پس این مورد را با معیار tti که مخفف time to interactive است مشخص می کنند. این معیار در پرفورمنس به معنی مدت زمان جهت فعال شدن است. یعنی المان و آیتم های ما در آن جهت کلیک و تعامل کاربر فال شده باشند و قابلیت انجام موارد تعریف شده ای چون تگ ها و اسکریپت ها باشد.
دلیل ایجاد این معیار به خاطر این بوده که بهینه سازی آیتم و موارد های مهم به شکلی باشد که فقط محتوا به نمایش گذاشته نشود. بلکه بعد از به نمایش درآمدن سریع محتوا ، آیتم ها و موارد گفته شده نیز ، قابلیت اجرا تعامل ها را با کلیک و رفتار های کاربر را داشته باشد. منتها به سرعت این مورد باید فعال شود.
زیرا در صورتی که کاربر با محتوا مواجه شود اما با کلیک او واکنشی رخ ندهد ، سریعا این طرز فکر در او رخ می دهد که وب سایت کلا مشکل داره و به وب سایت دیگری در نمایش نتایج serp خواهد رفت. پس می توان به صراحت دید این معیار و پرفورمنس چه تاثیری در سئو دارند.
استاندارد هایی که خود وب سایت جی تی متریکس برای این معیار اعلام کرده ، برحسب زمان و نسبت به فعال شدن آیتم ها در آن زمان در نظر گرفته شده که در قسمت زیر برای شما آن ها را آماده و شرح داده ایم :
این معیار برای اینکه یک تجربه کاربری یا همان ux خوب برای کاربر ایجاد شده تا بتوان بهتر و دقیق تر روی بهینه سازی این موارد از وب سایت تسلط داشت. برای بهینه سازی این معیار می توانید فعالیت زیر رو داشته باشید.
Tbt : همانطور که میدانید ، پروسه لود از چندین بخش تشکیل شده. این بخش ها به صورت ردوبدل اطلاعات بین دو دستگاه انجام میشه. دستگاه کاربر که کلاینت نام دارد درخواستی را به دستگاه وب سایت که سرور نام دارد ، ارسال می کند. این طلاعات درخواست از طریق مرورگر در قالب یک فایل به وب سرور ارسال می شود
قابل ارسال شده توسط سرور دریافت می شود و پس از بازگشایی ، آن را پردازش یا همان پراسس می کند. سپس نسبت به درخواستی که ارسال شده ، سرور اطلاعات را در قالب یک فایل به مرورگر متقاضی ارسال می کند.
در صورت نبودن مشکل از جانب دیتابیس و اطلاعات درخواست شده از سرور ، اطلاعات از سمت سرور در مرورگر کاربر دریافت می شود ، و بسته مربوطه بازگشایی می شود. سپس نسبت به اطلاعات و منابع و کد های آن ، مراحل پردازش آن شروع می شود. این پردازش در نقطه شروع به رندرینگ می کند.
شاید شنیده باشید که بسیاری از طراحان گرافیکی و تدوین گر از سیستم های رندرینگ برای افزایش سرعت پروسه پردازش آن تهیه می کنند. این قسمت از رندرینگ در مرورگر نیست مشابه همان است.
اطلاعاتی و صفحاتی که در قالب کد طراحی و نوشته شده است ، حال باید به شکل پیکسل های قابل درک در صفحه نمایش ما در مرورگر به نمایش گذاشته شود. این پروسه ارسال و دریافت نمایش به قدری سریع است که ما هیچدام از مراحل گفته شده را به چشم نمی توانیم ببینیم.
اما رفته رفته با تکامل بشر و افزایش نیاز های کاربر ، کوچک ترین تاخیر ها در نمایش محتوا و فعال شدن المان ها برای کاربر بسیار مهم شده است. برای حل این مشکل از معیاری به نامtotal blocking time ایجاد شدن تا طبق آن مجموع تایم هایی که رندر شدن منابع و اطلاعات بلاک یا مسدود بوده را سنجش و محاسبه می کند و در مجموع آن را اعلام می کند.
نکته اینجاست که این مورد زمانی رخ می دهد که ما یک main thread شلوغ و بلاک داشته باشیم. مواردی که در سربرگ واترفال مربوطه به سایت می توان تمام آن و task های طولانی آن را بررسی کرد و شناسایی کرد که چه منابع و مواردی باعث مسدود سازی رندرینگ محتوا شده است.
لازم به ذکر است که این معیار سنجش خود را از میان دو معیار fcp و tti شروع و انجام می دهد و به این شکل می شود که سنجش از زمان شکل گیری fcp و تا صورت گرفتن tti ادامه دارد. باید این را نیز در نظر داشته باشید که این مورد از موارد اصلی core web vitals هستش و تمام این موارد برای داشتن یک تجربه کاربری خوب برای متقاضی بازدید کننده وب سایت است.
استاندارد های اعلام شده جی تی متریکس برای این معیار به شرح زیر است :
راه های بهینه سازی نیز به شکل های زیر امکان پذیر است ، اما در نظر داشته باشید که به بهینه سازی هر یک از معیار ها fcp و tti ، تا حد قابل توجهی روی این معیار نیز تاثیر گذار خواهی بود اما موارد زیر تاثیر گذار نیز هستند :
Cls : این معیار که مخفف واژه cumulative layout shift است. به معین این است که محتوای ما درون وب سایت چه مقدار جابجایی در آن صورت گرفته است. بگذارید با یک مثال عملی برای درک بهتر شما توضیح دهیم.
حتما برای شما هم پیش آمده که پس از ورود به وب سایتی ، در حین اینکه دارید مطالب آن را می خوانید و یا می خواهید روی گزینه ای کیلک کنید ، ناگهان تغییر مکان در آیتم های آن رخ می دهد و المان های آن به مراتب پایین تر کشیده می شود.
خب این همان cls است. در واقع این معیار نسبت به آیتم هایی در صفحه مربوطه وجود دارند ، آن ها شناسایی می کند و بعد از ظاهر شدن تک تک آن ها به روی هم دیگر و جابجایی که صورت می گیرد. نسبت به مدت زمانی که این اتفاق رخ میدهد ، شاخصی را دراین پروسه محسابه می کند و اعلام می کند. به حالتی صریح تر می شود که؛ در حین لود سایت ، آیتم هایی که یکی یکی ظاهر و روی هم به ترتیب لود می شوند ، نسبت به مدت زمانی که این جایجایی رخ داده ، معیاری از آن به وجود می آید که به اختصار به آن می گوییم cls.
استانداردی که برای این موضوع در نظر گرفته شده است به شرح زیر است :
برای کاهش تایم cls موارد زیر بسیار توضیح می شود :
خب نوبتی هم باشه ، نوبت میرسه به معیار های قسمت browser timings در پرفورمنس. این دسته از معیار های جی تی متریکس ، از دسته ریز معیار هایی هستند که بد نیست که حتما گزارش او نها بررسی بشه و اگر مشکلی بود و اطلاعات راجع به آن ها باید تغییر بکنه ، انجام بشه. در این بخش به تمام این معیار ها به صورت کوتاه پرداخته ایم :
Redirect duration : اشاره به مدت زمان هایی که اگر قبل از ورود به صفحه ، ریدایرکت صورت گرفته شده باشد دارد.
Connection duration : اشاره به مدت زمانی هستش که بعد از ریدایرکت اولیه ، تلاش برای اتصال به صفحه مربوطه هستش.
Backend duration : اشاره به مدتی زمانی که طول می کشد بعد از کانکشن به سرور ، پاسخی از جانب آن دریافت شود.
Ttfb : اشاره به اولین بایت از اطلاعاتی که از سرور مربوطه در مرورگر و کلاینت دریافت می شود.
First paint : همانطور که قبلا در fcp اشاره شد ، منظور این معیار اولین علائم و تغییر رنگ ها از مراحل لود و ایندکس شدن صفحه است.
Dom interactive time : اشاره به مدت زمانی که مرورگر کلاینت تمام مراحل لود و تجزیه و تحلیل فایل های و کد های html را به پایان رسانده است.
Dom content loaded time : اشاره به آماده بودن dom برای اجرا استایل ها و کد و فایل های js است.
Onload time : اشاره به مدت زمانی است که در آن تمام منابع استایلی ، عکس ها ، کد های css و … دانلود شده اند.
Fully load time : اشاره به معیار اندازه گیری است که بعد از انجام شدن onload time ، منابع دریافتی ، درخواست ها و فراخوانی های دیگری را از سرور می خواهند
همانطور که تا این با پرفورمنس و سایر میعرا های گزارش آن آشنا شدیم ، متوجه نیز شدیم که این موارد روی افزایش لود سایت بسیار تاثیر گذار است. این موارد از سمت لایت هاوس گوگل تایید شده اند و در نتیجه یکی از فاکتور های سئو به حساب می آیند.
هر چقد رابط کاربری یک وب سایت خوب باشد ، در نتیجه رفتار کاربران و کل وبسایت طبق الگوریتم های تعریف شده گوگل خواهند بود.
با بهینه سازی هر یک از این موارد شما روی سئو خود تاثیر بسیار زیاد خواهید داشت. به شکلی که کاملا تاثیر آن را با بررسی رخ ctr و سایر معیار های دیگر ، می توانید به مرور زمان ببینید.
حتما در این موارد اطلاعات خود را کامل کنید و کل پروسه مربوطه را طی کنید تا یک بهینه سازی عالی در خصوص آن داشته باشید.
تیم ما یعنی تیم پویا وب ، با داشتن سابقه بیشینه در حوزه طراحی ، امنیت و سئو سایت ، همواره چند قدم از سایر رقبا خود جلو تر است. شما می توانید در صورت تمایل برای مشاوره سئو و بهینه سازی وب سای خود با ما در ارتباط باشید. از همراهی شما تا انتهای مقاله سپاس گذاریم.
آژانس طراحی سایت پویا وب با طراحی وب سايت حرفهای و طراحی فروشگاه اینترنتی بيش از پانصد شرکت و ميزبانی بيش از هزار وب سايت، فعاليت رسمی خود را از تابستان سال 1395 آغاز کرده و همواره میکوشد خدمات خود را با بالاترين کيفيت ممکن و با بهرهگيری از جدیدترین متدها به شما ارائه دهد.