Cumulative Layout Shift چیست؟ یک معیار مهم !

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

اما Cumulative Layout Shift چیست؟ این معیار با اندازه گیری میزان جابجایی آیتم های صفحه نسبت به زمان و مقدار جابجایی آن ها به صفحه مورد نظر ، امتیاز می دهد. اما چیزی که حائز اهمیت است ، این است که این معیار از بابت سرعت لود نیست و بیشتر برای ایجاد یک تجربه کاربری خوب از این معیار استفاده می کنند.

از بابت این که همواره سایت ما ، توسط کاربران زیادی ایندکس و بررسی می شود ، نیاز است تا یک site با ایده آل آن ها بهشان ارائه دهیم. پس بهتر می توانیم درک بکنیم که Cumulative Layout Shift چیست.

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

برای درک بهتر اینکه Cumulative Layout Shift چیست ، این مقاله را برای شما گرد آوری کرده ایم. مطالبی چون خود cls و معیار های مهم دیگر آن ، تا بهینه سازی Cumulative Layout Shift در این مقاله وجود دارد. پس آن را از دست ندهید و حتما آن را تا آخر مورد مطالعه قرار دهید.

پادکست :

cumulative layout shift چیست
cumulative layout shift چیست

Cumulative Layout Shift چیست؟

CLS یا Cumulative Layout Shift یکی از سه معیار مهم در core web vitals و ابزار های لود مانند جی تی متریکس و لایت هاوس است. این معیار با اندازه گیری میزان و تعداد جابجایی در آیتم های site در حال نمایش نسبت به زمان ، شاخصی را ارائه می دهد که روی performance در جی تی متریکس و بقیه تاثیر گذار است.

ابزار های تست لود site و معیار های دیگر ، همواره بعد از وارد کردن آدرس url در آن ها ، اطلاعاتی از قبیل تمام معیار های موجود و ایراداتی که در هر قسمت از سایت رو لود آن تاثیر گذاشته را به ما ارائه می دهد تا نسبت به آن معیار های دیگر و همچنین معیار CLS را بهینه کنیم.

شکل های مختلف در site از ارور Cumulative Layout Shift چیست؟ ببینید اگر وب سایت ها را تا الان باز کرده باشید ، در برخی از آن ها متوجه شده اید که بعضی از آیتم و المان ها ، در حین لود به طور سریعی جابجا شده یا به پایین صفحه منتقل شده است. به طور کلی در حین منتظر برای لود و بارگذاری وب مورد نظر ، جابجایی های نامنظمی در لحظه ای کوتاه و یا بلند وجود دارد.

cumulative layout shift چیست

این جابجایی ممکن است نوشته ای ، عکسی ، ویدیو ، دکمه و … باشد. اما نکته اینجاست که آیتم ها در حین لود در سر جای خود نیستند. به این مثال و عکس بالا توجه کنید.

در شکل وب سایت اول که A نام دارد ، صفحه ای با تعداد نوشته و دکمه هایی لود شده است. اما با کلیک بر روی آن ، ناگهان نوشته و آیتم های دیگر ، به پایین کشیده می شود. به این تغییر مکان و جابجایی ناگهانی shift می گویند. حال وقتی شییفت اتفاق می افتد ، المان های دیگری که در بالاتر از قسمتی که ، ما در آن حضور داشتیم وجود داشت ، تازه لود می شوند.

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

برای درک بهتر اینکه Cumulative Layout Shift چیست ، برای شما مثال های اتفاق افتاده را نیز خواهیم زد.

cumulative layout shift چیست

به عنوان مثال در گوگل کلمه ای را سرچ کرده اید ، لینک یکی از وب سایت های پیشنهاد شده را باز کرده و داخل می شوید. در حین این که وب سایت لود شده است ، شما آیتم و یا لینکی در آن را کلیک می کنید و ناگهان تغییر مکان در المان ها را میبینید. یا حتی با کلیک دکمه به عنوان مثال A ، بعد از اینکه shift رخ داد متوجه می شوید که کلیک شما ، بر روی گزینه B افتاده و رو اون حساب شده.

یا در موارد دیگری در وب سایتی که مقاله را در حال خواندن هستید. بعد از گذت چند ثانیه از لود آن ، ناگهان متن و تمام موارد دیگر دچار جابجایی در مکان می شوند.

در واقع CLS بد ، نشان دهنده یک تجربه کاربری بد است. آیتم ها هر کدام در این حالت به صورت جدا جدا در مکان های خود ظاهر می شوند. اما در اصل باید آیتم ها ، در مکان هایی که برای آن تعیین شده ، طبق استاندارد به صورت لود ترتیبی اجرا شوند. 

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

cumulative layout shift چیست

معیار Cumulative Layout Shift چیست و چه استانداردی دارد؟

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

ولی اگر شما برعکس این ماجرا را در وب سایت خود داشت باشید. یک لود خوب و سریع و با کمترین میزان جابجایی عناصر خواهید داشت.

شاخص Cumulative Layout Shift توسط خود وب سایت جی تی متریکس ، یکسری مدت زمان را برای این موضوع که کاملا استاندارد باشد را در نظر گرفته که به شرح زیر است.

cumulative layout shift چیست

کمتر از یک میلی ثانیه : نشان دهنده یک CLS خوب و بدون نیاز به بهینه سازی

بین یک تا پانزده میلی ثانیه : این عدد نشان دهنده خوب بودن این معیار را دارد ولی جای بهینه سازی را دارد

بین 15 تا 25 میلی ثانیه : معیار بالا بوده و نیاز به ارتفا و بهینه سازی دارد

بیشتر از 25 میلی ثانیه : به شدت تایم معیار بالا بوده و باید در سریع ترین زمان ممکن این مشکل از site بر طرف شود

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

البته این نیز حائز اهمیت است تا گفته شود. وب سایت هایی هستند که این معیار در آن ها صفر است. بله صفر و این نشان دهنده یک رابط کاربری عالی در این حوزه است. 

cumulative layout shift چیست

تاثیر CLS بر روی سئو چیست؟

از جایی که خود وب سایت جی تی متریکس اعلام کرده ، در حدود 5 درصد از امتیاز performance را این معیار تشکیل می دهد. اما باید این نکته را در نظر داشته باشیم که این معیار به تنهایی تاثیر زیادی ندارد. اما از آنجایی که یکی از سه معیارهای مهم core web vitals از CLS تشکیل شده و در مجموع هسته گوگل روی سئو بسیار تاثیرگذار است ، پس cls بسیار مهم است. 

دانستیم تا اینجا که Cumulative Layout Shift چیست و به چه شکل هایی امکان بروز دارد. اما در این قسمت به تاثیرات آن روی سئو می پردازیم.

همانطور که می دانید ، معیار ها و الگوریتم های گوگل و سایر موتور های جستوجوگر در حال رشد هستند. در نظر داریم که این فاکتور ها همگی با شناسایی رفتار کاربران از قرارگیری در هر کدام از شرایط مربوطه ایجاد می شود.

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

از طرفی امتیاز دهی الگوریتم ها در سئو سایت به این شکل است که با جمع آوری اطلاعات از سمت تعداد ورود و کلیک و … کاربران به اضافه ، جمع آوری اطلاعات توسط ربات های گوگل ، حاصل یک مجموعه اطلاعات کلی از امتیازات است.

cumulative layout shift چیست

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

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

پس از نظر الگوریتم ها در امتیاز دهی به صفحات و وب سایت ما ، داشتن یک رابط و تجربه کاربری خوب ، نسبت به معیار های اعلام شده است. از طرفی تمام اطلاعاتی که از سمت جی تی متریکس معرفی شده اند ، همه در راستای یک UI و UX خوب هستند تا کاربر جذب ماندن در صفحات شما شود.

بهینه سازی Cumulative Layout Shift یکی از راه های خوب در داشتن site با شاخص های تعریف شده است. در ادامه به این می پردازیم که راه های بهینه سازی Cumulative Layout Shift چیست.

cumulative layout shift چیست

منظور از بهینه‌ سازی CLS چیست ؟

وقتی از تاثیر این معیار در performance و به خصوص در سئو ، با خبر می شویم ، سریعا قصد این را پیدا می کنیم تا هر چیزی که در راستای بهینه سازی Cumulative Layout Shift است را انجام دهیم. 

به هرگونه فعالیتی که در راستای از بین بردن ارور های cls باشد را ، بهینه سازی Cumulative Layout Shift می گویند. این فعالیت می تواند از اصول گرافیکی اولیه باشد تا بهینه سازی محتوای درون صفحه و فونت های مطالب آن.

اصولی که در بهینه سازی Cumulative Layout Shift مورد معرفی و بخث قرار می گیرند. هر کدام به میزان قابل توجهی در کاهش تایم CLS دارد. اما نکته اینجاست که با روش های انجام بهینه سازی این اصول آَشنایی داشته باشید.

برای اینکه به پاسخ سوال راه های بهینه سازی Cumulative Layout Shift چیست برسید ، سر تیتر بعدی را مورد مطالعه قرار دهید.

cumulative layout shift چیست

شروع بهینه‌سازی Cumulative Layout Shift

از مهم ترین بهینه سازی ها ممکن در این معیار این است که شما ، عکس ها و تصاویر سایت خود را در سایز های استاندارد و مورد نظر ، در کد های site تعریف کرده باشید. تعیین طول و عرض تصاویر و المان های مربوطه از مهم ترین کار هایی است که در بهینه سازی آن به کار می رود.

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

با این کار جدای این که شما هم cls سایت خود را بهینه کرده اید ، بلکه کمک به سرعت لود کلی site کرده اید. بر طرف کردن این مشکل از site باعث می شود تا به طور جمعی روی سرعت بارگذاری تاثیر گذار باشد.

cumulative layout shift چیست

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

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

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

cumulative layout shift چیست

بیشتر site های امروزی ، از انیمیشن های بسیار در صفحات خود استفاده می کنند. به لیل جذابیتی که در کاربر دارد ، همواره استفاده از آن در شکل و محتوای متفاوت در هر site ، مرسوم است. حال نکته اینجاست که اگر سایز انیمیشن همانند عکس ها به درستی و جای خودش تعیین نشده باشد ، در CLS بسیار تاثیر گذار است. اما راه بهینه کردن انیمیشن ها در Cumulative Layout Shift چیست؟ تعیین اندازه معین آن و همینطور ایجاد جایگاه آن برای لود ترتیبی و طبق معیار بهینه سازی آن مشکل است.

در ادامه مورد دیگری که بسیار در Cumulative Layout Shift تاثیر گذار است ، باکس ها و آیتم هایی هستند که از طریق روش های embeds و inframes در وب سایت قرار گرفته اند. معمولا پاپ آپ ها در site و یا تبلیغاتی بهینه نشده که از منبعی دیگر و یا فایل هایی خاص که به صفحات site هدایت می شوند ، بر روی این شاخص بسیار تاثیر گذار است. پس بهینه کردن و یا حتی حذف این موارد را در بهبود آن دست کم نگیرید.

cumulative layout shift چیست
نکات مهم در بهینه سازی Cumulative Layout Shift چیست؟

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

زیرا cls شاخصی نیست که همواره مشکل ساز باشد و یا ایرادی در صفحات ما ایجاد کند. در برخی موارد این ارور ها و مواردی که تغییر مکان آیتم ها را به وجود می آورند ، بسیار خوب و هوشمندانه است.

اول اطلاعات جامع نسبت به محتوای درون سایت و کد ها و تنظیماتی که پشت آن ها وجود دارد را کسب کنید ، سپس در صورت نیاز بودن ، شروع به بهینه سازی آن ها کنید.

cumulative layout shift چیست
معیار های مهم دیگر در کنار CLS

سوالی که زیاد پرسیده می شود این است که از مهم ترین کار هایی که می توان در صدد رسیدن به اطلاعات بیشتر از جی تی متریکس و این معیار Cumulative Layout Shift چیست؟ در ادامه 6 معیار مهم جی تی متریکس که بسیار پر کاربرد و مهم هستند را به تریب براش شما آماده کرده و توضیح مختصری از آن ها نوشته ایم تا نسبت به آن ها آگاه تر شوید.

  1. Speed Index : SI
  2. first contentful paint : FCP
  3. Largest Contentful Paint : LCP
  4. Time to Interactive : TTI
  5. Total Blocking Time : TBT
  6. Cumulative Layout Shift : CLS

این موارد از 6 شاخص اصلی جی تی متریکس و لود سایت هستند که به غیر از این موارد ، شاخص های دیگری وجود دارد که در لود سایت تاثیر گار هستند

SI : این شاخص یک اطلاعاتی کلی را نسبت به لود تمام آیتم ها و المان های درون سایت به وبمستر نشان می دهد.

 

cumulative layout shift چیست

FCP : این معیاریست که در اولین حرکت یک site ، باید از خود علائمی در جهت نشان دادن این که در حال لود است نشان دهد است. یعنی با این علائم ، در حال لود بودن خود را اعلام می کند.

LCP : این شاخص نشان دهنده این است که بزرگترین محتوا و آیتم های صفحه مورد نظر ، در مدت زمان چه تایمی بارگذاری می شوند و به کاربر نشان داده می شود.

TTI : این معیار نشان دهنده این است که ، آیتم ها و المان های درون سایت ، چه مقدار زمان می برد تا با کاربر بتواند تعامل برقرا کند.

TBT : این نشان دهنده مقدار زمانی است که مرحله رندرینگ محتوای سایت ما در مرورگر کاربر ، چه مدت زمانی را مسدود یا بلاک بوده و مانع از رندرگیری شده است.

CLS : که محتوای امروز ما بود در خصوص این است که ، میزان جابجایی و تغییر مکان آیتم های درون site ما ، نسبت به زمان و میزان جابجایی چقدر است.

core web vitalscore web vitals چیست

بهینه سازی Cumulative Layout Shift را همین الان شروع کنید!

در خصوص این که Cumulative Layout Shift چیست و چه تاثیری بر روی سئو سایت ما دارد در این مقاله صحبت کردیم. همچنین در خصوص راه های بهینه سازی آن نیز بحث کردیم و گفتیم از چه طریقی می توان  این معیار را بهینه سازی کرد.

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

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

شما می توانید در صورت تمایل ، برای صرفه جویی در وقت و هزینه خود ، این پروسه و پروسه کامل سئو خود را به تیم پویا وب بسپارید.

از همراهی شما تا انتهای این مقاله سپاس گذاریم.

تماس با پویا وب

Share on whatsapp
Share on telegram
Share on facebook

دیدگاه ها بسته شده است

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