بهینه سازی کیفیت تجربه کاربر، کلید موفقیت بلندمدت هر سایتی در وب است. چه مالک کسب و کار، چه بازاریاب یا توسعه دهنده باشید، Web Vitals می تواند به شما کمک کند تا تجربه سایت خود را کمی کنید و فرصت های بهبود را شناسایی کنید.
نمای کلی
Web Vitals ابتکاری توسط Google برای ارائه راهنمایی یکپارچه برای سیگنال های با کیفیت است که برای ارائه یک تجربه کاربری عالی در وب ضروری است.
گوگل طی سالها ابزارهای مختلفی را برای اندازهگیری و گزارش عملکرد ارائه کرده است. برخی از توسعه دهندگان در استفاده از این ابزارها خبره هستند، در حالی که برخی دیگر فراوانی ابزارها و معیارها را چالش برانگیز دانسته اند.
صاحبان سایت نباید برای درک کیفیت تجربه ای که به کاربران خود ارائه می دهند، مربی عملکرد باشند. هدف ابتکار Web Vitals سادهسازی چشمانداز است و به سایتها کمک میکند تا روی معیارهایی که بیشترین اهمیت را دارند، یعنی Core Web Vitals تمرکز کنند.
مرتبط: Web Vitals و معیارهای مختلف آن
Core Web Vitals
Core Web Vitals زیرمجموعه ای از Web Vital ها هستند که برای همه صفحات وب اعمال می شوند، باید توسط همه صاحبان سایت اندازه گیری شوند و در تمام ابزارهای Google ظاهر می شوند. هر یک از Core Web Vitals نمایانگر جنبهای از تجربه کاربر است، در میدان قابل اندازهگیری است و تجربه دنیای واقعی یک نتیجه حیاتی کاربر محور را منعکس میکند.
معیارهایی که Core Web Vitals را تشکیل می دهند در طول زمان تکامل خواهند یافت. مجموعه فعلی برای سال ۲۰۲۲ بر سه جنبه از تجربه کاربر تمرکز دارد – بارگیری ، تعامل و ثبات بصری – و شامل معیارهای زیر (و آستانه مربوط به آنها) است:
- بزرگترین رنگ محتوایی (LCP) :عملکرد بارگذاری را اندازه گیری می کند. برای ارائه یک تجربه کاربری خوب، LCP باید در عرض ۲.۵ ثانیه از زمانی که صفحه برای اولین بار بارگذاری می شود، رخ دهد.
- تاخیر ورودی اول (FID) : تعامل را اندازه می گیرد . برای ارائه یک تجربه کاربری خوب، صفحات باید FID ۱۰۰ میلی ثانیه یا کمتر داشته باشند.
- تغییر چیدمان تجمعی (CLS) : ثبات بصری را اندازه گیری می کند . برای ارائه یک تجربه کاربری خوب، صفحات باید CLS 0.1 و یا کمتر داشته باشند.
برای هر یک از معیارهای بالا، برای اطمینان از رسیدن به هدف توصیه شده برای اکثر کاربران خود، یک آستانه خوب برای اندازه گیری صدک ۷۵ بارگذاری صفحه است که در دستگاه های تلفن همراه و دسکتاپ تقسیم بندی شده است.
ابزارهایی که انطباق با Core Web Vitals را ارزیابی میکنند، باید یک صفحه را در صورتی که به اهداف توصیهشده در صدک ۷۵ برای همه سه معیار بالا برآورده میشود، در نظر بگیرند.
ابزارهای اندازه گیری و گزارش Core Web Vitals
گوگل معتقد است که Core Web Vitals برای همه تجربیات وب حیاتی است. در نتیجه، متعهد است که این معیارها را در همه ابزارهای محبوب خود به نمایش بگذارد . در بخشهای زیر توضیح میدهیم که کدام ابزارها از Core Web Vitals پشتیبانی میکنند.
ابزارهای میدانی برای اندازه گیری Core Web Vitals
گزارش تجربه کاربر Chrome دادههای اندازهگیری کاربر واقعی و ناشناس را برای هر Core Web Vital جمعآوری میکند. این داده ها به صاحبان سایت امکان می دهد تا به سرعت عملکرد خود را بدون نیاز به ابزار تجزیه و تحلیل دستی در صفحات خود ارزیابی کنند و ابزارهایی مانند PageSpeed Insights و گزارش Core Web Vitals کنسول جستجو را تقویت می کند.
LCP | FID | CLS | |
گزارش تجربه کاربر Chrome | ✔ | ✔ | ✔ |
PageSpeed Insights | ✔ | ✔ | ✔ |
کنسول جستجو (گزارش Core Web Vitals) | ✔ | ✔ | ✔ |
دادههای ارائهشده توسط Chrome User Experience Report راهی سریع برای ارزیابی عملکرد سایتها ارائه میکند، اما تلهمتری دقیق در هر بازدید از صفحه را که اغلب برای تشخیص دقیق، نظارت و واکنش سریع به رگرسیونها ضروری است، ارائه نمیکند. در نتیجه، ما قویاً توصیه می کنیم که سایت ها نظارت بر کاربر واقعی خود را تنظیم کنند.
اندازه گیری Core Web Vitals در JavaScript
هر یک از Core Web Vitals را می توان در جاوا اسکریپت با استفاده از APIهای وب استاندارد اندازه گیری کرد.
ساده ترین راه برای اندازه گیری تمام Core Web Vitals استفاده از کتابخانه جاوا اسکریپت web-vitals است، یک بسته بندی کوچک و آماده تولید در اطراف API های وب زیرین که هر متریک را به گونه ای اندازه گیری می کند که دقیقاً با نحوه گزارش آن ها توسط همه افراد مطابقت داشته باشد. ابزارهای گوگل ذکر شده در بالا.
با کتابخانه web-vitals ، اندازهگیری هر متریک به اندازه فراخوانی یک تابع ساده است:
|
هنگامی که سایت خود را به گونه ای پیکربندی کردید که از کتابخانه web-vitals برای اندازه گیری و ارسال داده های Core Web Vitals خود به یک نقطه پایانی تجزیه و تحلیل استفاده کند، گام بعدی این است که آن داده ها را جمع آوری و گزارش دهید تا ببینید آیا صفحات شما آستانه های توصیه شده حداقل ۷۵ درصد از بازدیدهای صفحه را برآورده می کنند یا خیر.
در حالی که برخی از ارائه دهندگان تجزیه و تحلیل از معیارهای Core Web Vitals پشتیبانی داخلی دارند، حتی آنهایی که این کار را انجام نمی دهند باید ویژگی های معیاری اولیه سفارشی را داشته باشند که به شما امکان می دهد Core Web Vitals را در ابزار خود اندازه گیری کنید.
یکی از نمونههای این گزارش Web Vitals است که به صاحبان سایت اجازه میدهد تا Core Web Vitals خود را با استفاده از Google Analytics اندازهگیری کنند. برای راهنمایی در مورد اندازهگیری Core Web Vitals با استفاده از سایر ابزارهای تحلیلی، به بهترین روشها برای اندازهگیری Web Vitals در این زمینه مراجعه کنید.
همچنین میتوانید در مورد هر یک از Core Web Vitals بدون نوشتن هیچ کدی با استفاده از Web Vitals Chrome Extension گزارش دهید . این برنامه افزودنی از کتابخانه web-vitals برای اندازهگیری هر یک از این معیارها و نمایش آنها به کاربران هنگام مرور وب استفاده میکند.
این برنامه افزودنی میتواند در درک عملکرد سایتهای خود، سایتهای رقیب شما و به طور کلی وب مفید باشد.
LCP | FID | CLS | |
---|---|---|---|
وب حیاتی | ✔ | ✔ | ✔ |
برنامه افزودنی Web Vitals | ✔ | ✔ | ✔ |
همچنین، توسعهدهندگانی که ترجیح میدهند این معیارها را مستقیماً از طریق APIهای وب زیربنای اندازهگیری کنند.
ابزارهای آزمایشگاهی برای اندازه گیری Core Web Vitals
در حالی که تمام Core Web Vitals، قبل از هر چیز، معیارهای میدانی هستند، بسیاری از آنها در آزمایشگاه نیز قابل اندازه گیری هستند.
اندازهگیری آزمایشگاهی بهترین راه برای آزمایش عملکرد ویژگیها در حین توسعه است – قبل از اینکه برای کاربران عرضه شوند. همچنین بهترین راه برای گرفتن رگرسیون های عملکرد قبل از وقوع است.
ابزارهای زیر را می توان برای اندازه گیری Core Web Vitals در یک محیط آزمایشگاهی مورد استفاده قرار داد:
LCP | FID | CLS | |
---|---|---|---|
Chrome DevTools | ✔ | ✘ ( به جای آن از TBT استفاده کنید ) | ✔ |
فانوس دریایی | ✔ | ✘ ( به جای آن از TBT استفاده کنید ) | ✔ |
در حالی که اندازهگیری آزمایشگاهی بخش ضروری ارائه تجربیات عالی است، جایگزینی برای اندازهگیری میدانی نیست.
عملکرد یک سایت بر اساس قابلیت های دستگاه کاربر، شرایط شبکه آنها، سایر فرآیندهایی که ممکن است در دستگاه در حال اجرا باشد و نحوه تعامل آنها با صفحه می تواند به شدت متفاوت باشد. در واقع، هر یک از معیارهای Core Web Vitals می تواند امتیاز خود را تحت تأثیر تعامل کاربر قرار دهد. فقط اندازه گیری میدانی می تواند تصویر کامل را با دقت ثبت کند.
توصیه هایی برای بهبود نمرات خود
هنگامی که Core Web Vitals را اندازهگیری کردید و زمینههای بهبود را شناسایی کردید، گام بعدی بهینهسازی است. راهنماهای زیر توصیه های خاصی را برای نحوه بهینه سازی صفحات خود برای هر یک از Core Web Vitals ارائه می دهند:
سایر موارد حیاتی وب
در حالی که Core Web Vitals معیارهای حیاتی برای درک و ارائه یک تجربه کاربری عالی هستند، معیارهای حیاتی دیگری نیز وجود دارد.
این سایر موارد حیاتی وب اغلب به عنوان معیارهای پراکسی یا مکمل برای Core Web Vitals عمل میکنند تا به ثبت بخش بزرگتری از تجربه یا کمک به تشخیص یک مشکل خاص کمک کنند.
برای مثال، معیارهای Time to First Byte (TTFB) و First Contentful Paint (FCP) هر دو جنبههای حیاتی تجربه بارگیری هستند و هر دو در تشخیص مشکلات مربوط به LCP ( به ترتیب زمان پاسخ سرور آهسته یا منابع مسدودکننده رندر ) مفید هستند. .
به طور مشابه، معیارهایی مانند زمان مسدود کردن کل (TBT) و زمان برای تعامل (TTI) معیارهای آزمایشگاهی هستند که در تشخیص و تشخیص مسائل بالقوه تعاملی که بر FID تأثیر میگذارند، حیاتی هستند. با این حال، آنها بخشی از مجموعه Core Web Vitals نیستند زیرا قابل اندازهگیری در میدان نیستند، و همچنین یک نتیجه کاربر محور را منعکس نمیکنند .
توسعه وب حیاتی #
Web Vitals و Core Web Vitals بهترین سیگنالهای موجود توسعهدهندگان را برای اندازهگیری کیفیت تجربه در سرتاسر وب نشان میدهند، اما این سیگنالها بینقص نیستند و باید انتظار پیشرفت یا اضافات آینده را داشت.
Core Web Vitals مربوط به تمام صفحات وب است و در ابزارهای مرتبط Google قابل مشاهده است . تغییرات در این معیارها تأثیر گسترده ای خواهد داشت. به این ترتیب، توسعهدهندگان باید انتظار داشته باشند که تعاریف و آستانههای Core Web Vitals پایدار باشند و بهروزرسانیها اطلاع قبلی و یک آهنگ سالانه قابل پیشبینی داشته باشند.
سایر موارد حیاتی وب اغلب مختص زمینه یا ابزار هستند و ممکن است آزمایشی تر از Core Web Vitals باشند. به این ترتیب، تعاریف و آستانه آنها ممکن است با فراوانی بیشتری تغییر کند.
برای همه موارد حیاتی وب، تغییرات به وضوح در این CHANGELOG عمومی ثبت خواهد شد .