Core Web Vitals چیست؟ الگوریتم جدید گوگل هست که در وبمستر از آن یاد می شود. گوگل در پنجم ماه May سال ۲۰۲۰ الگوریتم "هسته اصلی ویتامین ها" یا همان Core Web Vitals را رونمایی کرده است که مربوط به سرعت جستجو گوگل می باشد. 
به گزارش GSC معیار های جدیدی به گوگل اضافه شده است که در روند نمایش نتایج گوگل در صفحه اول تاثیر گذار است. گوگل با رنگ بندی های مختلف این تفکیک سرعت ها را انجام داده است و بزرگترین رنگ محتوا (LCP) است. تأخیر ورودی اول (FID) و تغییر چیدمان تجمعی (CLS) نام دارد.
این سه پارامتر با دیگر آپدیت های گوگل ادغام شده اند و فرایند پیچیده تری را به ارمغان آورده اند. سئو کاران و طراحان وب این سه پارامتر را باید مورد توجه خود قرار دهند زیرا برای کسب رتبه نخست گوگل باید سرعت صفحات سایت شما بالاتر باشد. در طراحی UX به این موضوع اشاره کرده ایم که باید رابط کاربری سایت شما با آنچه که مشتریان از صفحه سایت شما می بینند.
هماهنگ باشد. مشتری نباید در سایت شما گیج شود و باید به سادگی بتواند از سایت شما استفاده کند و همه این موارد مربوط به طراحی قالب سایت شما می شود. اگر از CMS وردپرس یا جوملا استفاده می کنید باید این موضوع را توجه کنید در غیر این صورت بزودی از نتایج اول گوگل حذف خواهید شد و مشتریان خود را از دست خواهید داد. لازم به ذکر است که مجموعه آراد برندینگ قالب جدید خود را بر اساس این آپدیت تغییر نموده است تا مشتریان خود را راضی نگه دارد و کاری کند.
که آنها نیز مشتریان خودشان را حفظ کنند و از دست ندهند. بنابراین ما سعی کردیم که همه ی این تغییرات را در مجموعه خود بکار ببندیم و جزئیات فرایند آن را برایتان شرح دهیم تا شما هم با ما همگام شده و بتوانید مشتریان خود را حفظ کنید. گوگل اعلام نموده که تا ۶ ماه آینده تغییرات جدید خود را بر روی سایت های فارسی اعمال نمی کند و به همه این بازه زمانی را فرصت داده تا تغییرات را بر روی سایت خود اعمال کنند و بعد از این تاریخ همراه با آپدیت های دیگر، تغییرات را اعمال خواهد نمود.
گوگل در Top Stories های خود که مربوط به AMP موبایل می باشد اولویت بندی نمایش صفحه اول گوگل را تغییر می دهد، لذا هرکس که تمایل دارد در صفحه اول گوگل باقی بماند باید از این آپدیت گوگل پیروی نماید. وب سایت های تازه کاران نیز چون بر اساس این آپدیت طراحی شده اند، زودتر جایگاه خواهند گرفت. لذا پیشنهاد می کنیم که حتما حداقل ۱ سایت با قالب جدید را خریداری نمایید. از این رو وب سایت های برندینگی و ویترینی آراد نیز تغییر یافته اند و بر اساس همین تغییرات گوگل، آپدیت شدند.
سیگنال های تجربه صفحه موجود
همانطور که گفتیم ، هسته های اصلی ویتامین ها با سیگنال های تجربه موجود در صفحه قرار می گیرند که Google مستقیماً برای رتبه بندی از آن استفاده می کند. این سیگنال ها به صورت صفحه ای، همانند Core Web Vitals نیز ارزیابی می شوند.
- Mobile Friendliness
- Safe Browsing (no malicious content, social engineering etc.)
- HTTPS
- Intrusive Interstitials
سخنگویان گوگل چندین بار خاطرنشان کردند که بعضی از سیگنال ها معمولاً به عنوان کراوات (tie-breakers) شکننده در نظر گرفته می شوند و هنوز هم بر روی ارائه بهترین مطالب به کاربران متمرکز هستند. با این حال همانطور که در اطلاعیه بیان شد، داشتن صفحه تجربه خوب می تواند به Google در تصمیم گیری در مورد رتبه بندی در هنگام انتخاب بین محتوای باکیفیت که تا حد زیادی مشابه است کمک کند.
تعبیر ما این است که اگر شما محتوای قابل مقایسه ای با رقبای خود دارید ، داشتن صفحه خوب تجربه می تواند به شما کمک کند سوزن را به سمت رده های بالاتر منتقل کنید. معیارهای موجود در Core Web Vitals احتمالاً منطقه خوبی برای تمرکز در این مورد خواهد بود. با این حال (و این بخش مهم است) - اگر به شما رقیب محتوا ندهید ، کار بر روی نمرات Core Web Vitials شما کافی نخواهد بود تا شما را به جلو سوق دهد. محتوا هنوز پادشاه King / Queen است و باید تمرکز اصلی شما باشد.
ویتامین های اصلی (Core Vitals) چیست؟
اما ، هسته های اصلی چیست؟ آنها را چگونه مشاهده می کنید؟ روی چه چیزی باید تمرکز کنید؟ ما وقت خود را در گذراندن کلیه اسنادی که گوگل به ما ارائه داده است به همراه توصیه های اخیر از Analist Trends Webmaster Google ،جان مولر و سایر تفسیرهای جستجوگرها در مورد آن گذرانده ایم تا بتوانیم موارد زیر را در اختیار شما قرار دهیم. Core Web Vitals بر سه جنبه مختلف تجربه صفحه تمرکز دارد:
- بارگذاری
- تعامل
- پایداری بصری
هر یک با یک متریک جداگانه نشان داده شده است.
بزرگترین رنگ محتوا (LCP) چیست؟ - بارگیری
این یک معیار در داخل ابزار بینش PageSpeed و تعدادی دیگر از ابزارهای توسعه دهنده است. در واقع سرعت لود یک صفحه برای طراحان سایت از اهمیت بالایی برخوردار است. LCP مخفف Largest Contentful Paint است و به معنای مدت زمانی است که صرف می شود تا بزرگترین المان محتوا در صفحه، لود و رندر و در viewport به کاربر نمایش داده شود.
Largest Contentful Paint یک متریک است که برای ارزیابی میزان بارگذاری صفحه برای کاربران طراحی شده است. متریک به مدت زمان طولانی شدن ارائه بزرگترین مطالب در صفحه اشاره دارد. Google نتایج این آزمایش را در سه سطل (سبز ، نارنجی و قرمز) قرار می دهد.
چه امتیاز LCP خوب است؟
داشتن نمره رندر LCP شما در زیر ۲٫۵ ثانیه حاکی از بهبود است. بنابراین در صورتیکه LCP کمتر از ۲٫۵ ثانیه باشد، صفحه مد نظر شما از نظر LCP دارای وضعیت مطلوبی است و اگر بین ۲٫۵ تا ۴ ثانیه باشد، نیاز به اصلاحات وجود دارد و اگر LCP بیش از ۴ ثانیه بود، صفحه در وضعیت نامطلوبی قرار گرفته و بهتر است که هر چه سریعتر، بررسی های لازم در خصوص Largest Contentful Paint انجام شود. Google ادامه می دهد که شما می خواهید اطمینان حاصل کنید که حداقل ۷۵٪ از صفحات بارگیری شما معیار ۲٫۵ ثانیه ای را دارند که به عنوان "GOOD" ارزیابی می شوند؟ گوگل عناصر زیر را برای اینکه آیا آنها بزرگترین مطالب در صفحه هستند، همانطور که توسط بزرگترین API رنگ محتوا مشخص شده است در نظر می گیرد:
کدام المان ها در LCP مد نظر گرفته می شود؟
در حال حاضر المان های زیر توسط LCP در نظر گرفته می شوند:
- المان
- المان درون یک المان
- المان
- المانی که بکگراند عکس آن از طریق فانکشن url() بارگذاری شده باشد.
- المان های Block Level در HTML که دارای متن هستند.
- سعی کنید نمرات سرعت صفحه را با بیشترین سرعت ممکن انجام دهید و به دنبال "شماره کامل" یا همان perfect number نباشید، زیرا این اتفاق هرگز رخ نخواهد داد. ببینید چه چیزی برای شما، مخاطبان و وب سایت شما اهمیت دارد. توجه داشته باشید که این مفهوم باید برای همه معیارهای Web Vitals اعمال شود.
تأخیر ورودی اول (FID) - تعامل
- FID مخفف First Input Delay است و پارامتری است که برای اندازه گیری Load responsiveness است. از Load responsiveness برای اندازه گیری سرعت لود صفحه و اجرای جاوا اسکریپت های لازم برای پاسخگویی به تعامل کاربر استفاده می شود. هر چه کاربر بتواند سریعتر با صفحه تعامل داشته باشد،
- با کلیک روی پیوند یا دکمه
- وارد کردن متن در یک قسمت خالی
- انتخاب یک منوی کشویی
- با کلیک روی کادر تأیید
- به طور عمده ، هر چیزی که باعث تعامل با عناصر html زیر شود:
- تجربه کاربری بهتری خواهد داشت. به عبارت دیگر FID فاصله زمانی بین تعامل کاربر با صفحه (مانند کلیک روی یک لینک یا دکمه و یا tap کردن روی یک المان تعاملی) و زمانی است که مرورگر به تعامل کاربر پاسخ می دهد. بعضی از آنها عبارت اند از:
چه امتیاز FID خوب است؟
- همان طور که در تصویر بالا نیز مشاهده می کنید، در صورتی که FID صفحه کمتر از ۱۰۰ میلی ثانیه باشد، صفحه از نظر First Input Delay در وضعیت مطلوبی است و اگر بین ۱۰۰ تا ۳۰۰ میلی ثانیه باشد، نیاز به انجام اصلاحات وجود دارد و در نهایت اگر FID بیشتر از ۳۰۰ میلی ثانیه باشد، صفحه در وضعیت نامطلوبی قرار دارد.
- و بهتر است که هر چه زودتر بررسی و اصلاح گردد. یکی از بزرگترین چالش های این متریک (هم برای بهبود و هم برای اندازه گیری) در صورت اجرای صفحه سنگین JavaScript است. ما ممکن است این مطلب را در پست دیگری پوشش دهیم ، برای همین توصیه می کنیم برای اطلاعات بیشتر با مستندات web.dev مشاوره بگیرید. همچنین می توانید افزونه Web Vitals Chrome را برای اندازه گیری این جنبه ها بدون نوشتن کد اضافی نصب کنید.
تغییر چیدمان تجمعی (CLS) چیست؟ - پایداری بصری
- CLS مخفف عبارت Cumulative Layout Shift است و به برای اندازه گیری Visual Stability استفاده می شود. برای درک بهتر، یک مثال می زنم. حتما برای شما پیش آمده که در حال خواندن یک صفحه هستید و قصد دارید روی یک لینک یا دکمه کلیک یا tap کنید و درست همان لحظه، متن یا یک لینک حرکت می کند و جابجا می شود.
- و شما به اشتباه روی یک لینک دیگر کلیک می کنید. این جابجایی layout برای کاربر آزاردهنده است. پارامتر CLS در حقیقت صفحه را از نظر جابجایی layout بررسی می کند و به معنای مدت زمانی است که layout های صفحه پس از اینکه رندر شدند و برای کاربر، قابل رویت شدند، حرکت غیر منتظره داشته باشند. Cumulative Layout Shift - CLS یک معیار کاملاً جدید است که هدف آن ارزیابی پایداری بصری یک صفحه است.
ثبات بصری چیست؟
- شما احتمالاً صفحات را تجربه کرده اید (به ویژه در تلفن همراه) که پس از ورود، محتوای به دلیل ظاهر شدن عناصر جدید تغییر می کند. گاهی اوقات این باعث می شود شما به طور تصادفی روی یک تبلیغ کلیک کنید و فقط به طور کلی یک صفحه صفحه آزار دهنده است.
- ویدیو بالا یک نمونه از حرکت ناگهانی layout است که برای کاربر ناخوشایند است.
اقدامات CLS:
- "مجموع کل نمرات تغییر طرح بندی منحصر به فرد برای هر تغییر طرح غیر منتظره که در طول عمر صفحه رخ می دهد". برای انجام این کار ، مرورگر به اندازه viewport و حرکت هر عنصر ناپایدار نگاه می کند. نمره با مجموع تأثیری که تغییر دارد ، و فاصله شیفت اندازه گیری می شود. توجه به این نکته حائز اهمیت است
- که این شامل تغییر شیوه های مورد انتظار نیست ، مانند زمانی که کاربر بر روی پیوند یا دکمه ای کلیک می کند که باعث حرکت عناصر صفحه می شود. در زیر سه سطل گوگل برای رتبه بندی این امتیازها در Core Web Vitals ارائه شده است. باز هم ، آنها به شما توصیه می کنند حداقل ۷۵٪ از صفحات خود را "خوب" بدست آورید:
چه امتیاز CLS خوب است؟
- با توجه به تصویر بالا، در صورتی که زمان CLS کمتر از ۰٫۱ ثانیه باشد، وضعیت صفحه از نظر Cumulative Layout Shift مطلوب است و اگر بین ۰٫۱ تا ۰٫۲۵ ثانیه بود، نیاز به اصلاح دارد و در صورتی که CLS بیشتر از ۰٫۲۵ ثانیه بود، وضعیت نامطلوب است و بهتر است که تلاش کنید که این زمان را کاهش دهید.
ابزارهای اندازه گیری LCP و FID و CLS در Web Vitals
- هر سه پارامتر LCP و FID و CLS در Web vitals که در مورد آنها صحبت شد، توسط ابزار Lighthouse که به عنوان مثال در
- وجود دارد قابل اندازه گیری هستند. اطلاعات LCP و FID و CLS توسط CrUX که مخفف
- است جمع آوری می شود. همچنین می توانید این پارامتر ها را در گزارش Core Web Vitals سرچ کنسول مشاهده کنید.
- همچنین می توانید از
- که البته هنوز ورژن آلفا است نیز برای اندازه گیری سه پارامتر مذکور استفاده کنید. Dan Taylor همچنین افزونه ای را برای سایت های WordPress ایجاد کرده است ، بنابراین می توانید این داده ها را در داشبورد Google Analytics خود وارد کنید. ما هنوز این را آزمایش نکرده ایم ، بنابراین اگر دوست دارید تجربه های شما را در بخش نظرات همین پست می شنویم!
جمع بندی در مورد Web Vitals:
- سه پارامتری که در Web Vitals اندازه گیری می شوند در راستای بهبود تجربه کاربری هستند و دولوپرها و سئوکاران نیاز است که در جهت سئوی حرفه ای نگاه ویژه ای به آنها داشته باشند و تلاش کنند که دست کم ۷۵ درصد از بازدیدهایی که دارند از نظر LCP و FID و CLS در وضعیت مطلوب باشند.
پرسش های متداول در مورد LCP و FID و CLS در Web Vitals
- آیا سرعت هاست تاثیری در بهبود Largest Contentful Paint دارد؟ بله. هر چه سرعت هاست یا سرور بالاتر باشد و Response time سرور پایین تر باشد، امتیاز LCP بهتر خواهد بود. آیا کمپرس کردن فایل های جاوا اسکریپت تاثیری در بهبود پارامتر First Input Delay صفحه دارد؟ بله. کمپرس کردن و مینیفای کردن فایل های جاوااسکریپت تاثیر مستقیم در بهبود سرعت اجرای جاوا اسکریپت صفحه دارد و در نتیجه باعث بهبود امتیاز FID خواهد شد. برای بهبود Cumulative Layout Shift چه نکاتی را در مورد عکس باید رعایت کنیم؟
- همه عکس ها در HTML باید دارای ابعاد width و height باشند که مرورگر قبل از لود آنها، بداند که ابعاد عکسی که باید رندر کند چقدر است. اگر ابعاد عکس در HTML مشخص نشده باشد ممکن است کم منجر به تاثیر منفی در امتیاز CLS شود. اگر از موضوعات امروز چیزی متوجه نشدید نگران نباشید. این آپدیت مخصوص طراحان و برنامه نویسان هست و افراد غیر متخصص از آن سردر نمی آورند. اگر پشتیبانی سایت شما توسط آراد برندینگ انجام می شود، نگران این موضوع نباشید و با تغییر قالب سایت خود می توانید از آخرین آپدیت گوگل برخوردار شوید.
