LCP(Largest Contentful Paint) چیست!؟
Largest Contentful Paint (LCP) یک معیار عملکرد است که در سال 2020 توسط Lighthouse برای اندازهگیری و درک بهتر تجربه بارگیری سایت توسط کاربران معرفی شد. به عبارت دیگر، LCP اندازهگیری میکند که چه مقدار طول میکشد تا بزرگترین المان صفحه برای کاربران کامل لود و قابل نمایش شود.
درواقع LCP اندازه گیری می کند که محتوای قابل مشاهده در صفحه وب شما با چه سرعتی می تواند توسط بازدیدکنندگان دیده شود. بزرگترین المان صفحه یعنی، المانی که از لحاظ بصری قابل مشاهده هست.
شاید بزرگترین المان صفحه یک متن باشد، یک ویدئو، یک تصویر و یا یک جدول داده ایی باشد لازم به ذکر است که ما نباید آن را با FCP اولین محتوای قابل مشاهده اشتباه گرفت.
عناصر صفحه در هر محتوای html به صورت زیر است:
- یک عنصر تصویر
- یک عنصر ویدیویی
- عنصری با تصویر پسزمینه بارگیری شده از طریق تابع URL (به جای اعلام آن در CSS)
- عناصر سطح بلوک مانند <h1>، <h2>، <div>، <ul>، <table> و …
تاثیر LCP بر رنک وب سایت شما
LCP به عنوان یک معیار 25% از امتیاز عملکرد را به خود اختصاص می دهد و آن را به یکی از مهم ترین معیارها برای بهینه سازی تبدیل می کند.
چرا معیار LCP برای سئو مهم است!؟
باید توجه داشته باشیم وقتی در مورد سئو و رابطه آن با LCP بحث میکنیم، یعنی در مورد یکی از مهم ترین و حیاتی ترین معیارهای Core Web Vitals که توسط الگوریتم ها ارزیابی و باعث میشود سایت امتیاز خوبی در نتایج گوگل کسب کند صحبت میکنیم.
در تصویر بالا هر دو وب سایت لود پایانی یکسانی دارند ولی تفاوت اصلی در نحوه لود عناصر وب سایت آنها میباشد.
زمان های مناسب برای بزرگترین المان صفحه
زمان مناسب برای بزرگترین المان صفحه(بزرگترین بلوک از لحاظ بصری) بر حسب ثانیه اندازه گیری میشود که به شرح زیر است:
زمان LCP | رنک | نتیجه |
---|---|---|
بین 1200 و 1666 میلی ثانیه | خوب | بهبود لازم است |
1666 تا 2400 میلی ثانیه | متوسط | بیشتراز حد زمان توصیه شده |
بالای 2400 میلی ثانیه | ضعیف | بسیار طولانی تر از زمان توصیه شده |
مهمترین دلایل LCP پایین کدام هستند؟
-
سرعت کند پاسخ سرور:
تمام محتوای وب سایت شما بر روی یک سرور بارگذاری میشود، اگر این سرور به لحاظ سخت افزاری ضعیف باشد سایت شما با کندی سرعت لود مواجه میشود که این موضوع به خودی خود به سئو سایت شما آسیب خواهد زد، پس ما قبل اینکه اطلاعات وب سایت خود را بارگذاری کنیم باید حتما از بالا بودن سرعت سرور خود مطمئن شویم. از دلایل کندی سرعت سرور میتوان به موارد زیر اشاره کرد:
- دور بودن موقعیت سرور
- استفاده نکردن از CDN
- کش نکردن اطلاعات
جاوا اسکریپت و CSS بلاک کننده رندر (Render-blocking):
یکی دیگر از مسائل بسیار مهم که باعث کاهش LCP میشود توقف رند سایت یا همان خروجی می باشد! وقتی که مترجم ها در حال پردازش سایت ما هستن به یک فایل جاوااسکریپت یا CSS حجیم برمیخورند که به دلیل حجم پردازش این فایل ها پروسه رندر کردن سایت با مشکل مواجه می شود که به اصلاح به آن رندر بلاکینگ میگویند، بهتر است با بهینه کردن فایل های Css, Javascript که در ادامه بیان میشود این مسئله بسیار مهم را رفع کنیم!
-
سرعت پایین لود شدن منابع:
گاهی اوقات ما فایل ها را از روی سروهای دیگر بارگذاری میکنیم که این خود باعث بارگذاری کند سایت ما میشود. به عنوان مثال یک فایل Css یا Js که به صورت Api بارگذاری شده میتواند سرعت سایت ما را پایین بیاورد. برای رفع این مشکل بهتر است فایل ها را بروی سایت خود داشته باشیم.
-
رندر در سمت کلاینت:
زمان که شما میخواهید تمامی فایل های ضروری و غیر ضروری را در سمت کلاینت اجرا کنید(رندر بگیرید) باید توجه داشته باشید تا حد ممکن اجرا فایل های غیر ضروری را کاهش دهید به خاطر اینکه زیاد بودن این فایل ها به دلیل پردازش سنگین، باعث کند شدن سایت میشود.
به عنوان مثال وقتی فایلهای Css را فشرده میکنید، شاید تعداد درخواست ها از سرور کاهش پیدا کند ولی باید به این نکته توجه داشته باشید که شاید در صفحه ای که الان هستین فایلی بارگذاری شده که اصلا نیازی به پردازشش نبوده و اون تکه از کد Css مربوط به جای دیگر است.
چگونه LCP سایت خود را افزایش دهیم
تا اینجای مقاله با LCP، زمان های مناسب و مواردی که باعث کند شدن سایت میشوند آشنا شده اید. در این قسمت به چگونگی رفع پایین بودن LCP و موارد مهم در بالا بردن این معیار میپردازیم :
-
کاهش زمان پاسخگویی سرور:
یکی از مهمترین عوامل سرعت سایت کاهش زمان پاسخگویی سرور است که ما باید این زمان را بهترین حالت خود بهینه کنیم. بعد از بهینه سازی اگر زمان پاسخگویی کاهش پیدا نکرد شاید مجبور شویم سرور خود را تغییر دهیم. در مقالات بعدی راجع به چگونگی انتخاب بهترین سرویس دهنده مطالبی را حضور آنان ارائه میدهیم.
-
استفاده از CDN نزدیک به کاربر:
CDN به ما کمک میکند کاربرانی که از سرور ما دارای موقعیت دورتری هستند بتوانند با سرعت بیشتری وارد سایت ما شوند. در واقع شبکه توزیع محتوا (CDN) سایت ما را برروی چندین سرور ذخیره میکند تا درصورت لزوم به نسبت موقعیت جغرافیایی سرور اصلی و موقعیت کاربر، نزدیکترین سرور CDN را برای کاهش سرعت بارگذاری در اختیار کاربران قرار دهد.
• کش کردن عناصر وبسایت:
کش (Cache) یا حافظه پنهان، به ما کمک میکند تا اطلاعات تکراری در مراجعه بعدی برای کاربر از قبل به صورت بارگذاری شده باشد. به این صورت که در اولین مراجعه کاربر به سایت ما به خاطر حجم بالای اطلاعات زمان پاسخگویی زیاد میشود، ولی وقتی که قابلیت کش را فعال کرده باشیم اطلاعات روی مرورگر کاربر ذخیره میشود و در مراجعه بعدی اطلاعات از روی مرورگر خود کاربر بارگذاری میشود.
-
به تاخیر انداختن JavaScript و CSS غیرضروری:
همان طور که در قسمت های بالا اشاره شد یکی از دلایل بالا رفتن LCP تاخیر در پردازش فایل های جاوااسکریپت و سی اس اس میباشد. مترجم ما با صورت خط به خط سایت را ترجمه میکند و وقتی به یک فایل Css یا Js برخورد میکند باید اول آنها را به صورت کامل پردازش کند و بعد به خط بعدی برود که این خود یک زمان رو برای رندر کردن از ما میگیرد.
برای رفع این مشکل از راهکارهای زیر میتوان استفاده کرد :
- بهتر است فایل جاوا اسکریپت را قبل از تگ Body صدا بزنیم
- قسمت های حیاتی فایل Css , Js را به صورت Inline در بخش Head سایت صدا بزنیم و بقیه را به صورت Preload شده استفاده کنیم.
- فایل ها را به صورت جدا جدا صدا بزنیم، یعنی برای هر صفحه فایل مخصوص همان صفحه باشد و فایلها را برای کاهش حجم درخواست ها ادغام نکنیم.
- فشرده سازی فایل های Css , Js
بهینهسازی و فشرده کردن تصاویر
یکی دیگر از مواردی که باعث LCP مناسب میشود کاهش حجم تصاویر هست! هرچقدر که تصاویر ما بهینه تر باشد بر روی معیار LCP ما تاثیر گذار هست. نکته ایی که وجود دارد این هست گاهی مواقع با کاهش حجم تصاویر افت شدید کیفیت همراه هست و از آنجا که ما در بین دو راهی سئو بهتر برای گوگل و رضایت کاربر قرار میگیرم بهتر است که ما رضایت کاربر را در نظر بگیریم!!!
نتیجه گیری :
LCP یکی از مهمتری معیار های مهم کور وب وایتال می باشد که تاثیر بسیار زیادی برروی سئو سایت ما از لحاظ ساختاری و تکنیکی دارد. همان طور که در موارد بالا اشاره شد برای بدست آوردن یک LCP خوب و مناسب باید تمامی موارد تکنیکالی سایت مورد بررسی دقیق قرار گیرد و قبل از هر کاری سایت خود را به بهینه ترین حالت ممکن خود دربیاوریم.
سایت دی ام سئو با استفاده از ابزارهای دقیق،دانش و تجربه موفق بهینه سازی صدها سایت معتبر میتواند به شما دوستان عزیز در تمام زمینه های مربوط به تکنیکال سایت همراه و مشاور شما باشد.
شما متوانید به صورت کاملا رایگان با ما در ارتباط باشید، همچنین میتواند از دوره آموزش سرعت سایت دی ام سئو که به صورت کاملا حرفه ای تولید شده استفاده کنید.
دیدگاهتان را بنویسید