Το Core Web Vitals δείχνει τις τρεις μετρήσεις στις οποίες κατατάσσεται η Google — LCP, CLS και INP — που μετρώνται ζωντανά στη σελίδα που προβάλλετε, βαθμολογούνται με βάση τα όρια της Google και εντοπίζονται στο ακριβές στοιχείο πίσω από κάθε αριθμό.
Το Core Web Vitals αποφασίζει μέρος της κατάταξης των σελίδων σας, αλλά οι συνήθεις τρόποι μέτρησής τους είναι περίεργοι. Τα εργαστηριακά εργαλεία βαθμολογούν ένα συνθετικό φορτίο που κανείς δεν βιώνει. Το Search Console αναφέρει πραγματικούς χρήστες, με καθυστέρηση τεσσάρων εβδομάδων, ομαδοποιημένο σε κάδους URL. Κανένα από τα δύο δεν σας λέει ποιο στοιχείο στη σελίδα που έχετε μπροστά σας είναι το πρόβλημα.
Αυτό το εργαλείο μετρά τη σελίδα που πραγματικά κοιτάτε, καθώς τη χρησιμοποιείτε. Το LCP, το CLS και το INP λαμβάνουν το καθένα ένα πλακίδιο με την αξία του, μια βαθμολογία Καλή, Απαιτείται εργασία ή Κακή σε σχέση με τα δημοσιευμένα όρια της Google και μια γραμμή που δείχνει πού κάθεστε. Το FCP και το TTFB βρίσκονται δίπλα τους για το περιβάλλον, επειδή ένα αργό LCP που προκαλείται από έναν αργό διακομιστή είναι διαφορετικό πρόβλημα από αυτό που προκαλείται από μια βαριά εικόνα.
Οι ορισμοί ταιριάζουν με αυτά που αναφέρει το Chrome στο CrUX, κάτι που έχει σημασία αν σκοπεύετε να συγκρίνετε αριθμούς με το Search Console. Το CLS χρησιμοποιεί παράθυρα συνεδρίας — ένα παράθυρο τελειώνει μετά από ένα κενό ενός δευτερολέπτου ή σε πέντε δευτερόλεπτα και το χειρότερο παράθυρο κερδίζει — αντί να προσθέτει αφελώς κάθε μετατόπιση μαζί. Το INP είναι το 98ο εκατοστημόριο των καθυστερήσεων της αλληλεπίδρασής σας, το οποίο για μια κανονική επίσκεψη είναι απλώς η πιο αργή αλληλεπίδραση. Το LCP σταματά να αλλάζει με την πρώτη σας αλληλεπίδραση, όπως ακριβώς το κάνει το Chrome.
Το πιο χρήσιμο είναι ότι κάθε αριθμός αποδίδεται. Ο πίνακας ονομάζει το στοιχείο με τη μεγαλύτερη ζωγραφική, τα στοιχεία που μετατοπίστηκαν και τις πιο αργές αλληλεπιδράσεις και ένα κουμπί Εμφάνιση μεταβαίνει σε οποιοδήποτε από αυτά και το περιγράφει στη σελίδα. Αντί να γνωρίζετε ότι το CLS είναι 0,31, βλέπετε το banner που πιέζει το περιεχόμενό σας προς τα κάτω. Η αναφορά αντιγραφής σας δίνει το σύνολο ως κείμενο για ένα εισιτήριο.
Οι τρεις μετρήσεις κατάταξης ενημερώνονται καθώς χρησιμοποιείτε τη σελίδα: η κύλιση μετακινεί το CLS, κάνοντας κλικ και πληκτρολογώντας μετακίνηση INP. Καθένα από αυτά αξιολογείται ως Καλό, Χρειάζεται δουλειά ή Κακή σε σχέση με τα όρια της Google.
Ονομάζει το μεγαλύτερο στοιχείο βαφής, τα στοιχεία που μετατοπίστηκαν και τις πιο αργές αλληλεπιδράσεις. Πατήστε Εμφάνιση για να πραγματοποιήσετε κύλιση σε οποιοδήποτε από αυτά και να το περιγράψετε απευθείας στη σελίδα.
Το CLS χρησιμοποιεί παράθυρα περιόδου σύνδεσης με κενό 1s και όριο 5s, το INP είναι το 98ο εκατοστημόριο των καθυστερήσεων αλληλεπίδρασης και το LCP παγώνει στην πρώτη αλληλεπίδραση — έτσι οι αριθμοί σας ευθυγραμμίζονται με το Search Console.
Το First Contentful Paint και το Time To First Byte βρίσκονται δίπλα στα τρία μεγάλα, ώστε να μπορείτε να ξεχωρίζετε έναν αργό διακομιστή από μια βαριά εικόνα ήρωα προτού αρχίσετε να βελτιστοποιείτε το λάθος πράγμα.
Εμφανίζει τις πιο αργές αλληλεπιδράσεις σας με τον τύπο συμβάντος και το σχετικό στοιχείο, ώστε να μπορείτε να βρείτε ένα αργό αναπτυσσόμενο μενού ή φίλτρο αντί να το μαντέψετε.
Ένα κλικ αντιγράφει κάθε επιλογέα μέτρησης, βαθμολογίας και προσβολής ως απλό κείμενο — έτοιμο να επικολληθεί σε ένα εισιτήριο, ένα αίτημα έλξης ή ένα email πελάτη.
Επιβεβαιώστε ότι το LCP, το CLS και το INP είναι με πράσινο χρώμα σε ένα νέο πρότυπο προτού δημοσιευτεί, αντί να το μάθετε από το Search Console ένα μήνα αργότερα.
Το Search Console σάς ενημερώνει ότι μια ομάδα διευθύνσεων URL αποτυγχάνει στο CLS. ανοίξτε ένα από αυτά με αυτό το εργαλείο και δείτε ποιο ακριβώς στοιχείο κάνει τη μετατόπιση.
Κάντε κύλιση στη σελίδα και παρακολουθήστε την αναρρίχηση του CLS και, στη συνέχεια, πατήστε Εμφάνιση για να περιγράψετε τη διαφήμιση, το banner ή τη γραμματοσειρά ιστού καθυστερημένης φόρτωσης που μετακινεί το περιεχόμενό σας.
Κάντε κλικ στα φίλτρα, τα μενού και τα modals και, στη συνέχεια, διαβάστε τη λίστα με την πιο αργή αλληλεπίδραση για να βρείτε ποιο στοιχείο ελέγχου κοστίζει εκατοντάδες χιλιοστά του δευτερολέπτου.
Καταγράψτε τους αριθμούς, αναπτύξτε την επιδιόρθωση και, στη συνέχεια, μετρήστε ξανά την ίδια σελίδα και συγκρίνετε τις δύο αναφορές δίπλα-δίπλα.
Κάντε κλικ στο εικονίδιο Core Web Vitals στο dock του DevSuite Pro. Τα μετρικά πλακίδια εμφανίζονται αμέσως χρησιμοποιώντας οτιδήποτε έχει ήδη καταγράψει η σελίδα.
Το LCP έχει νόημα μόνο από την αρχή της φόρτωσης μιας σελίδας, επομένως φορτώστε ξανά με ανοιχτό τον πίνακα όταν θέλετε μια ανάγνωση που μπορείτε να εμπιστευτείτε.
Κάντε κύλιση σε ολόκληρη τη σελίδα για να ασκήσετε το CLS και κάντε κλικ, πατήστε και πληκτρολογήστε για να δημιουργήσετε μετρήσεις INP. Τα πλακίδια ενημερώνονται καθώς προχωράτε.
Πατήστε Εμφάνιση δίπλα στο στοιχείο LCP, μια πηγή αλλαγής διάταξης ή μια αργή αλληλεπίδραση. Η σελίδα κάνει κύλιση σε αυτήν και την περιγράφει, ώστε να μην υπάρχει ασάφεια σχετικά με το ποιο στοιχείο είναι υπεύθυνο.
Κάντε κλικ στην Αντιγραφή αναφοράς για μια σύνοψη απλού κειμένου για κάθε μέτρηση, βαθμολογία και επιλογέα. Πατήστε Επαναφορά για να ξεκινήσετε ξανά το CLS και το INP από την αρχή.
Εγκαταστήστε το DevSuite Pro δωρεάν και ξεκλειδώστε 71+ εργαλεία προγραμματιστή για το πρόγραμμα περιήγησής σας.
