GSC पर कोर वेब विटल्स में LCP L अधिक से अधिक त्रुटि को ठीक करें
सामग्री:
Google ने खोज में एक नई रिपोर्ट जारी कीकंसोल का नाम कोर वेब विटल्स है। इनकी गति रिपोर्ट बदल दी गई और 2021 में इसे एक रैंकिंग फैक्टर माना जाएगा। कोर वेब विटल्स को पेज स्पीड, HTTPS के साथ रैंकिंग फैक्टर माना जाएगा। मोबाइल मित्रता और अन्य ऑन-पेज कारक।
कोर वेब वाइटल यूएक्स और यूआई तत्वों को तीन कोर मेट्रिक्स के लिए पेज के औसत का पता लगाने के लिए पृष्ठ पर विचार करता है,
- एलसीपी: सबसे बड़ा विवादास्पद पेंट
- खूंटी: पहला इनपुट विलंब
- सीएलएस: संचयी लेआउट शिफ्ट
हल करने के लिए कोई विशेष एकल कोडित फिक्स नहीं हैमुद्दों लेकिन आप त्रुटियों को हल करने के लिए वेबसाइट का अनुकूलन कर सकते हैं। यहाँ मैं कुछ प्रथाओं की सूची दूंगा जो आपको सबसे बड़े विवादास्पद पेंट (LCP) को हल करने में मदद कर सकती हैं ofइससे अधिक' आपके वेब पेजों के लिए।
↑ LCP क्या है?
सबसे बड़ी सामग्री पेंट (LCP) मीट्रिक रिपोर्टव्यूपोर्ट के भीतर दिखाई देने वाली सबसे बड़ी सामग्री तत्व का रेंडर समय। सरल शब्दों में, पृष्ठ लोड होने के बाद एक प्रमुख तत्व को देखने योग्य स्क्रीन पर लोड करने के लिए समय लिया जाता है।
एक अच्छा उपयोगकर्ता अनुभव प्रदान करने के लिए, साइटों को पहले के भीतर सबसे बड़ा कंटेंटफुल पेंट होने का प्रयास करना चाहिए 2.5 सेकंड पृष्ठ का लोड शुरू हो रहा है।
↑ एलसीपी के लिए क्या तत्व माने जाते हैं?
सबसे बड़े विवादास्पद पेंट के लिए विचार किए जाने वाले तत्व हैं;
<img>तत्वों<छवि>तत्वों के अंदर एक<svg>तत्त्व<वीडियो>तत्वों- एक पृष्ठभूमि छवि के साथ एक तत्व के माध्यम से भरी हुई है
url ()समारोह - ब्लॉक-स्तरीय तत्व जिसमें टेक्स्ट नोड्स या अन्य इनलाइन-स्तरीय टेक्स्ट एलिमेंट्स बच्चे हैं।
↑ उच्च LCP के कारण क्या हैं?
- धीमी प्रतिक्रिया समय सर्वर
- जावास्क्रिप्ट और सीएसएस को रोकना
- धीरे-धीरे संसाधन लोड समय
- क्लाइंट-साइड रेंडरिंग
↑ उच्च LCP को ठीक करने के लिए वेबसाइट का अनुकूलन कैसे करें?
अच्छी प्रतिक्रिया समय के साथ एक अच्छी होस्टिंग का उपयोग करें औरकम विलंबता दर। सुनिश्चित करें कि आप सर्वरों को ऑप्टिमाइज़ करते हैं, मुफ्त 3 पार्टी सीडीएन जैसे क्लाउडफेयर, जेएसडेलिव, स्टेटिकली डिलीवर करने के लिए स्टेटिकली डिलीवर करें। यदि आप वर्डप्रेस पर काम कर रहे हैं तो बहुत सारे प्लगइन्स हैं जो आपके लिए काम करने में मदद कर सकते हैं।
अगली-जीन छवि प्रारूपों के साथ संपीड़ित चित्रों का उपयोग करेंजेपीईजी एक्सआर, जेपीईजी 2000 या वेबपी की तरह। ये आधुनिक प्रारूप छवि भार को 50% तक बढ़ाने में मदद करते हैं। वर्डप्रेस के लिए कुछ प्लगइन्स हैं जो स्वचालित रूप से फ्लाई पर छवियों को संपीड़ित और परिवर्तित करने में आपकी सहायता करते हैं। इसके अलावा, सर्वर बैंडविड्थ को कम करने और साइट की गति बढ़ाने के लिए WP-Photon जैसी छवि CDN का उपयोग करें।
एक स्थिर HTML लोड करने के लिए आप Cache सेवाओं का उपयोग कर सकते हैंवह पृष्ठ जो प्रत्येक अनुरोध पर परिवर्तित नहीं होता है, कैशिंग उसे अनावश्यक रूप से पुन: बनाए जाने से रोक सकता है। कैश प्लगइन्स आपके सर्वर पर जेनरेट किए गए HTML की एक कॉपी स्टोर करेगा और जब एक पेज का अनुरोध किया जाता है तो सर्वर कैश लोड को रिलीज़ करता है जो टाइम टू फर्स्ट बाइट (TTFB) को कम कर सकता है और संसाधन उपयोग को कम करता है।
आप Cloudflare जैसी सेवाओं का भी उपयोग कर सकते हैंब्राउज़र पृष्ठभूमि में सेवा कार्यकर्ता चलाता है और सर्वर से अनुरोधों को रोक सकता है। वे पृष्ठ का पूरा HTML कैश लेते हैं और HTML पृष्ठों को कैश-सर्व करते हैं जो लोडिंग समय को काफी कम कर सकते हैं।
अन्य महत्वपूर्ण बातों पर विचार करना अच्छा LCP के लिए वेबसाइट का अनुकूलन करना है
- जावास्क्रिप्ट और सीएसएस को रेंडर-ब्लॉक करना हटा दें
- गैर-महत्वपूर्ण सीएसएस को हटाएं
- संसाधन कम करें
- महत्वपूर्ण संसाधनों को लोड करें
आप LCP को कम करने और बेहतर UX के लिए अपने पृष्ठों को तेज़ी से लोड करने के लिए वेबसाइट को अनुकूलित करने के तरीके के बारे में अधिक विस्तृत मार्गदर्शिका पा सकते हैं आधिकारिक Web.Dev साइट.
निष्कर्ष: जीएससी में कोर वेब विटल्स की शुरुआत के साथऔर इसे रैंकिंग कारक माना जा रहा है। एलसीपी को ठीक करने के लिए एक बहुत महत्वपूर्ण मीट्रिक है क्योंकि यह डिवाइस के व्यूपोर्ट में लोड करने के लिए सबसे बड़े तत्व के लिए समय का ध्यान रखता है। मैंने निम्न एलसीपी के लिए साइट को अनुकूलित करने के लिए कुछ अस्थायी सुधार और समाधान प्रदान किए हैं।
