Πάρε δύο ιστοσελίδες που πουλούν το ίδιο πράγμα. Άνοιξέ τες δίπλα δίπλα. Η μία φορτώνει πριν σηκώσεις το δάχτυλο από το trackpad. Η άλλη χρειάζεται τέσσερα δευτερόλεπτα πριν εμφανιστεί έστω και ένα στοιχείο. Η διαφορά που μόλις βίωσες έχει όνομα: χρόνος φόρτωσης σελίδας. Ο αριθμός που βλέπεις σε ένα εργαλείο δοκιμής ταχύτητας είναι όμως μόνο μέρος της εικόνας. Ο χρόνος φόρτωσης σελίδας δεν είναι μία μέτρηση. Είναι μια συλλογή μετρήσεων, καθεμία από τις οποίες καταγράφει διαφορετική στιγμή της φόρτωσης και σου λέει κάτι διαφορετικό για το τι βιώνει πραγματικά ένας επισκέπτης. Αυτό το άρθρο εξηγεί τι μετράει ο χρόνος φόρτωσης σελίδας, ποιοι δείκτες μετράνε και τι σου λένε, γιατί διαφέρουν το κινητό και ο υπολογιστής και πώς να διαβάζεις τα δεδομένα απόδοσης της ιστοσελίδας σου χωρίς να χρειάζεσαι προγραμματιστή να στα μεταφράσει.
Ο χρόνος φόρτωσης σελίδας είναι ο χρόνος ανάμεσα στο αίτημα του επισκέπτη για μια σελίδα και στη στιγμή που η σελίδα γίνεται πλήρως χρηστική στον browser του. Ο λόγος που μετριέται με πολλούς τρόπους είναι ότι το «φορτώθηκε» σημαίνει διαφορετικά πράγματα ανάλογα με το τι προσπαθείς να καταλάβεις. Μια σελίδα μπορεί να δείχνει περιεχόμενο πριν τελειώσει τη φόρτωση κάθε στοιχείου. Μπορεί να φαίνεται διαδραστική πριν πραγματικά ανταποκριθεί στα κλικ. Όταν καταλαβαίνεις ποιο κομμάτι της φόρτωσης είναι αργό, τα δεδομένα ταχύτητας γίνονται χρήσιμα αντί απλώς ανησυχητικά. Για το γιατί αυτό μετράει για την επιχείρησή σου και την κατάταξή σου στην αναζήτηση, δες το άρθρο για το γιατί έχει σημασία η ταχύτητα της ιστοσελίδας.
Τι μετράει στην πραγματικότητα ο χρόνος φόρτωσης σελίδας;
Η φράση «χρόνος φόρτωσης σελίδας» χρησιμοποιείται χαλαρά για έναν μόνο αριθμό, αλλά στην πράξη αναφέρεται σε μια χρονογραμμή με πολλά ενδιάμεσα σημεία. Κάθε σημείο απαντά σε διαφορετική ερώτηση για το τι βιώνει ο επισκέπτης καθώς φορτώνει η σελίδα.
Η ακολουθία φόρτωσης
- Ο browser στέλνει αίτημα στον διακομιστή σου
- Ο διακομιστής επεξεργάζεται το αίτημα και στέλνει πίσω απάντηση
- Ο browser αρχίζει να λαμβάνει και να αποδίδει τη σελίδα
- Κείμενο και εικόνες εμφανίζονται σταδιακά καθώς κατεβαίνουν
- Τα scripts εκτελούνται και κάνουν τη σελίδα διαδραστική
- Το τελευταίο στοιχείο ολοκληρώνει τη φόρτωση
Διαφορετικοί δείκτες καταγράφουν διαφορετικά σημεία αυτής της ακολουθίας. Μια καλή βαθμολογία χρόνου φόρτωσης σελίδας εξαρτάται από το ποια σημεία μετράς και όχι μόνο από έναν συνολικό χρόνο.
Ποιοι είναι οι συγκεκριμένοι δείκτες που μετρούν τον χρόνο φόρτωσης σελίδας;
Time to First Byte (TTFB)
- Τι μετράει: πόση ώρα περιμένει ο browser πριν λάβει το πρώτο byte δεδομένων από τον διακομιστή σου
- Καλή βαθμολογία: κάτω από 800 χιλιοστά του δευτερολέπτου
- Γιατί μετράει: ένα αργό TTFB καθυστερεί ό,τι ακολουθεί. Ο browser δεν μπορεί να αρχίσει να αποδίδει τίποτα μέχρι να φτάσουν δεδομένα. Το αργό TTFB δείχνει συνήθως απόδοση διακομιστή, ποιότητα φιλοξενίας ή αβελτιστοποίητα ερωτήματα βάσης δεδομένων
First Contentful Paint (FCP)
- Τι μετράει: τη στιγμή που ο browser αποδίδει το πρώτο κομμάτι περιεχομένου, είτε κείμενο, είτε εικόνα, είτε φόντο
- Καλή βαθμολογία: κάτω από 1,8 δευτερόλεπτα
- Γιατί μετράει: τότε βλέπει πρώτη φορά ο επισκέπτης ότι κάτι γίνεται. Ένα γρήγορο FCP δείχνει ότι η σελίδα ανταποκρίνεται, ακόμη κι αν δεν έχει τελειώσει τη φόρτωση
Largest Contentful Paint (LCP)
- Τι μετράει: πότε φορτώνει πλήρως το μεγαλύτερο ορατό στοιχείο (συνήθως εικόνα hero ή μεγάλη επικεφαλίδα)
- Καλή βαθμολογία: 2,5 δευτερόλεπτα ή γρηγορότερα
- Γιατί μετράει: το LCP είναι ένα από τα τρία Core Web Vitals που χρησιμοποιούνται στην κατάταξη στην αναζήτηση. Είναι ο πιο κοντινός δείκτης για το «πότε η σελίδα φαίνεται χρηστική», γιατί το μεγαλύτερο στοιχείο είναι συνήθως το πιο σημαντικό οπτικό στη σελίδα
Time to Interactive (TTI)
- Τι μετράει: πότε η σελίδα είναι πλήρως διαδραστική και ανταποκρίνεται αξιόπιστα σε κλικ και είσοδο από το πληκτρολόγιο
- Καλή βαθμολογία: κάτω από 3,8 δευτερόλεπτα
- Γιατί μετράει: μια σελίδα μπορεί να φαίνεται φορτωμένη ενώ η JavaScript εξακολουθεί να εκτελείται στο παρασκήνιο. Το TTI καταγράφει το κενό ανάμεσα στο να φαίνεται έτοιμη μια σελίδα και στο να είναι πραγματικά έτοιμη
Total Blocking Time (TBT)
- Τι μετράει: τον συνολικό χρόνο που το κύριο νήμα είναι μπλοκαρισμένο και αδυνατεί να απαντήσει σε είσοδο, ανάμεσα στο FCP και στο TTI
- Καλή βαθμολογία: κάτω από 200 χιλιοστά του δευτερολέπτου
- Γιατί μετράει: το TBT δείχνει πόση βαριά επεξεργασία JavaScript καθυστερεί τη διαδραστικότητα. Ένα υψηλό TBT σημαίνει ότι οι επισκέπτες πατούν κουμπιά και δεν συμβαίνει τίποτα, κάτι που βλάπτει την εμπιστοσύνη ακόμη κι όταν η σελίδα φαίνεται οπτικά φορτωμένη
Πλήρης φόρτωση σελίδας
- Τι μετράει: πότε έχει φορτώσει πλήρως κάθε πόρος της σελίδας, μαζί με εικόνες, scripts, γραμματοσειρές και ενσωματώσεις τρίτων
- Καλή βαθμολογία: κάτω από 5 δευτερόλεπτα στο κινητό
- Γιατί μετράει: είναι ο δείκτης που έχουν οι περισσότεροι στο μυαλό τους όταν λένε «χρόνος φόρτωσης σελίδας». Είναι χρήσιμος για να καταλάβεις το συνολικό βάρος της σελίδας σου, αλλά μετράει λιγότερο για την εμπειρία του επισκέπτη από το LCP και το TTI, αφού οι επισκέπτες συνήθως αρχίζουν να αλληλεπιδρούν με μια σελίδα πολύ πριν ολοκληρώσει τη φόρτωση κάθε στοιχείο
Γιατί διαφέρει ο χρόνος φόρτωσης στο κινητό από τον υπολογιστή;
Το κινητό και ο υπολογιστής δίνουν διαφορετικές βαθμολογίες χρόνου φόρτωσης για την ίδια σελίδα, ακόμη κι όταν το περιεχόμενο είναι ίδιο.
Οι λόγοι που το κινητό είναι σταθερά πιο αργό
- Οι κινητές συνδέσεις είναι κατά μέσο όρο πιο αργές από τη σταθερή ευρυζωνική, ακόμη και σε δίκτυα 4G και 5G
- Οι επεξεργαστές κινητών είναι λιγότερο ισχυροί από τους επεξεργαστές υπολογιστών, που σημαίνει ότι η JavaScript εκτελείται πιο αργά
- Οι browser κινητών έχουν λιγότερη διαθέσιμη μνήμη, κάτι που περιορίζει πόσα μπορούν να αποθηκεύσουν ανάμεσα στις σελίδες
- Οι συνθήκες δικτύου διακυμαίνονται περισσότερο στο κινητό, προκαλώντας ασυνεπή απόδοση ανάμεσα στις επισκέψεις
Γιατί οι βαθμολογίες κινητού έχουν μεγαλύτερο βάρος
- Οι μηχανές αναζήτησης χρησιμοποιούν mobile-first indexing, δηλαδή σαρώνουν και κατατάσσουν τις σελίδες με βάση την έκδοση για κινητό
- Οι βαθμολογίες Core Web Vitals στο κινητό έχουν μεγαλύτερο βάρος κατάταξης από αυτές του υπολογιστή
- Το κινητό αντιπροσωπεύει την πλειονότητα της κίνησης στο διαδίκτυο παγκοσμίως, οπότε η απόδοση στο κινητό επηρεάζει το μεγαλύτερο μερίδιο των επισκεπτών σου
Τρέχε πάντα ξεχωριστά τεστ για κινητό και υπολογιστή. Μια σελίδα που βαθμολογείται καλά σε υπολογιστή μπορεί να έχει σημαντικά προβλήματα στο κινητό και το κινητό είναι εκεί όπου η επίδραση στην κατάταξη είναι μεγαλύτερη.
Τι προκαλεί αργούς χρόνους φόρτωσης σελίδας;
Μεγάλες ασυμπίεστες εικόνες
- Η πιο συνηθισμένη αιτία υψηλού βάρους σελίδας και αργών χρόνων φόρτωσης
- Μια φωτογραφία που ανεβαίνει απευθείας από κινητό μπορεί να είναι 4 έως 8 megabyte
- Η ίδια εικόνα, σωστά συμπιεσμένη, μπορεί να είναι κάτω από 100 kilobyte χωρίς ορατή διαφορά ποιότητας
- Κάθε ασυμπίεστη εικόνα προσθέτει δευτερόλεπτα στο FCP και στο LCP
Scripts και stylesheets που μπλοκάρουν την απόδοση
- Οι browser σταματούν την απόδοση όταν συναντούν αρχεία JavaScript ή CSS που πρέπει να επεξεργαστούν πριν συνεχίσουν
- Τα scripts που φορτώνονται στην κεφαλίδα του εγγράφου μπλοκάρουν τη σελίδα από το να εμφανίσει οτιδήποτε μέχρι να τελειώσουν
- Η αναβολή των μη κρίσιμων scripts τα βγάζει από την κρίσιμη διαδρομή και επιταχύνει το FCP και το LCP
Αργή απόκριση διακομιστή (υψηλό TTFB)
- Κάθε φόρτωση σελίδας ξεκινά με αίτημα προς τον διακομιστή. Αν ο διακομιστής είναι αργός, καθυστερούν όλα τα επόμενα
- Τα περιβάλλοντα κοινόχρηστης φιλοξενίας μοιράζουν CPU και μνήμη σε πολλές ιστοσελίδες, προκαλώντας απρόβλεπτους χρόνους απόκρισης
- Οι αβελτιστοποίητες βάσεις δεδομένων και η απόδοση από την πλευρά του διακομιστή χωρίς caching είναι συνηθισμένοι παράγοντες
Πάρα πολλά scripts τρίτων
- Τα widget συνομιλίας, τα pixel παρακολούθησης και τα εργαλεία analytics προσθέτουν το καθένα εξωτερικά αιτήματα σύνδεσης
- Αν κάποιος εξωτερικός διακομιστής απαντά αργά, η σελίδα σου περιμένει
- Τα scripts τρίτων μπορούν να συμβάλλουν σημαντικά στο TBT προσθέτοντας χρόνο εκτέλεσης JavaScript
Δεν υπάρχει caching
- Χωρίς caching, κάθε επίσκεψη προκαλεί πλήρη ανακατασκευή της σελίδας στον διακομιστή
- Με caching, οι επισκέπτες που επιστρέφουν φορτώνουν μια αποθηκευμένη έκδοση, μειώνοντας σημαντικά τον χρόνο απόκρισης του διακομιστή
- Το caching του browser επιτρέπει επίσης στους επισκέπτες που επιστρέφουν να μην κατεβάζουν πόρους που έχουν ήδη φορτώσει
Πώς μετράς τον δικό σου χρόνο φόρτωσης σελίδας;
Τι μετρούν τα εργαλεία δοκιμής ταχύτητας
- Τα εργαλεία δοκιμής ταχύτητας προσομοιώνουν μια φόρτωση σελίδας από σταθερή τοποθεσία και σύνδεση και βαθμολογούν κάθε δείκτη με βάση τυπικά όρια
- Λέγονται αποτελέσματα εργαστηρίου: ελεγχόμενες δοκιμές που τρέχουν υπό σταθερές συνθήκες
- Τα αποτελέσματα εργαστηρίου είναι χρήσιμα για τη διάγνωση συγκεκριμένων προβλημάτων, αλλά δεν καταγράφουν πώς βιώνουν πραγματικά τη σελίδα σου οι πραγματικοί επισκέπτες με διαφορετικές συνδέσεις και συσκευές
Δεδομένα εργαστηρίου και δεδομένα πεδίου
- Δεδομένα εργαστηρίου: προσομοιωμένες δοκιμές σε ελεγχόμενο περιβάλλον. Γρήγορες στην εκτέλεση και καλές για την απομόνωση συγκεκριμένων προβλημάτων
- Δεδομένα πεδίου: πραγματικές μετρήσεις από πραγματικούς επισκέπτες της ιστοσελίδας σου, συγκεντρωμένες με τον καιρό. Αυτά χρησιμοποιούν οι μηχανές αναζήτησης για τη βαθμολόγηση των Core Web Vitals
- Μια σελίδα μπορεί να βαθμολογείται καλά σε τεστ εργαστηρίου αλλά κακώς στα δεδομένα πεδίου, αν οι συνθήκες του πραγματικού κόσμου, οι πιο αργές συσκευές, οι πιο αδύναμες συνδέσεις ή η γεωγραφική απόσταση από τον διακομιστή σου δίνουν διαφορετικά αποτελέσματα στους πραγματικούς επισκέπτες
Τι να κοιτάς όταν διαβάζεις μια αναφορά ταχύτητας
- Έλεγξε πρώτα το LCP: είναι ο πιο σημαντικός δείκτης και για την εμπειρία των επισκεπτών και για την κατάταξη στην αναζήτηση
- Δες το TTFB για να εντοπίσεις αν το πρόβλημα είναι στην πλευρά του διακομιστή ή στο front-end
- Έλεγξε το TBT για να βρεις αν η JavaScript μπλοκάρει τη διαδραστικότητα
- Τρέξε ξεχωριστά τεστ για κινητό και υπολογιστή
- Σύγκρινε τις βαθμολογίες σου με τις σελίδες που κατατάσσονται πάνω από εσένα για τις λέξεις-κλειδιά-στόχους σου και όχι μόνο με αφηρημένα σημεία αναφοράς
Για μια ανάλυση των ορίων των Core Web Vitals και του πώς βαθμολογούν οι μηχανές αναζήτησης τις σελίδες με βάση αυτά, δες το άρθρο για το τι είναι τα Core Web Vitals.
Πώς το WEMASY χειρίζεται τον χρόνο φόρτωσης σελίδας
Ο δημιουργός ιστοσελίδων του WEMASY είναι φτιαγμένος να κρατά τους χρόνους φόρτωσης γρήγορους χωρίς τεχνική ρύθμιση. Οι εικόνες που ανεβαίνουν μέσω της πλατφόρμας συμπιέζονται και αλλάζουν μέγεθος αυτόματα πριν σερβιριστούν. Η υποδομή φιλοξενίας περιλαμβάνεται σε κάθε πακέτο, οπότε οι ιστοσελίδες δεν τοποθετούνται σε κοινόχρηστα περιβάλλοντα με απρόβλεπτους χρόνους απόκρισης. Το caching είναι ενεργοποιημένο από προεπιλογή και οι σελίδες που φτιάχνονται στο WEMASY δομούνται ώστε να κρατούν ελάχιστους πόρους που μπλοκάρουν την απόδοση.
Οι βαθμολογίες Core Web Vitals, μαζί με LCP, INP και CLS, φαίνονται απευθείας στο ταμπλό του WEMASY με δεδομένα πεδίου από πραγματικούς επισκέπτες. Έτσι μπορείς να δεις πώς αποδίδουν οι σελίδες σου σε σχέση με τα όρια που μετράνε για την κατάταξη στην αναζήτηση, χωρίς να τρέξεις εξωτερικά τεστ.
Δες τι περιλαμβάνεται στον δημιουργό ιστοσελίδων του WEMASY ή δες τις επιλογές πακέτων στη σελίδα τιμών.
Συχνές ερωτήσεις
Ποιος είναι ένας καλός χρόνος φόρτωσης σελίδας;
Για τα Core Web Vitals, το βασικό όριο είναι Largest Contentful Paint κάτω από 2,5 δευτερόλεπτα. Πρακτικά, ο στόχος της πλήρους διαδραστικότητας μέσα σε τρία δευτερόλεπτα σε κινητή σύνδεση καλύπτει την πλειονότητα των πραγματικών περιπτώσεων. Πλήρης φόρτωση σελίδας κάτω από πέντε δευτερόλεπτα στο κινητό είναι λογικό σημείο αναφοράς για τις περισσότερες ιστοσελίδες μικρών επιχειρήσεων. Με τον δημιουργό ιστοσελίδων του WEMASY, μπορείς να το ρυθμίσεις απευθείας στην ιστοσελίδα σου.
Ποια είναι η διαφορά ανάμεσα στον χρόνο φόρτωσης σελίδας και στα Core Web Vitals;
Ο χρόνος φόρτωσης σελίδας αναφέρεται σε ολόκληρη την ακολουθία μετρήσεων από το πρώτο αίτημα προς τον διακομιστή μέχρι τη φόρτωση του τελευταίου στοιχείου. Τα Core Web Vitals είναι τρεις συγκεκριμένοι δείκτες μέσα σε αυτή την ακολουθία, το Largest Contentful Paint, το Interaction to Next Paint και το Cumulative Layout Shift, που χρησιμοποιούν οι μηχανές αναζήτησης ως σήματα κατάταξης. Τα Core Web Vitals είναι υποσύνολο των μετρήσεων χρόνου φόρτωσης, εστιασμένο ειδικά στα κομμάτια της εμπειρίας φόρτωσης που επηρεάζουν περισσότερο τους επισκέπτες.
Γιατί ο χρόνος φόρτωσης της σελίδας μου διαφέρει στο κινητό και στον υπολογιστή;
Το κινητό και ο υπολογιστής δίνουν διαφορετικές βαθμολογίες, επειδή οι κινητές συσκευές έχουν πιο αργούς επεξεργαστές, δουλεύουν σε μεταβλητές συνδέσεις δικτύου και έχουν λιγότερη μνήμη από τους υπολογιστές. Μια σελίδα που φορτώνει σε δύο δευτερόλεπτα σε ευρυζωνική σύνδεση υπολογιστή μπορεί να χρειάζεται τέσσερα ή περισσότερα σε κινητό με μέσο κινητό δίκτυο. Οι μηχανές αναζήτησης βαθμολογούν χωριστά την απόδοση στο κινητό και της δίνουν μεγαλύτερο βάρος, επειδή η πλειονότητα της κίνησης στο διαδίκτυο προέρχεται από κινητές συσκευές.
Ποια είναι η διαφορά ανάμεσα στα δεδομένα εργαστηρίου και στα δεδομένα πεδίου στα τεστ ταχύτητας;
Τα δεδομένα εργαστηρίου προέρχονται από προσομοιωμένο τεστ που τρέχει υπό ελεγχόμενες συνθήκες από σταθερή τοποθεσία και συσκευή. Τα δεδομένα πεδίου προέρχονται από πραγματικούς επισκέπτες της ιστοσελίδας σου, μετρημένα στις πραγματικές τους συσκευές, τοποθεσίες και συνδέσεις. Οι μηχανές αναζήτησης χρησιμοποιούν δεδομένα πεδίου για τη βαθμολόγηση των Core Web Vitals και όχι αποτελέσματα εργαστηρίου. Μια ιστοσελίδα μπορεί να φαίνεται γρήγορη σε τεστ εργαστηρίου αλλά να βαθμολογείται κακώς στα δεδομένα πεδίου, αν οι πραγματικοί επισκέπτες έχουν πιο αργές συνδέσεις ή συσκευές ή βρίσκονται γεωγραφικά μακριά από τον διακομιστή σου.
Τι σημαίνει Time to First Byte;
Το Time to First Byte (TTFB) είναι ο χρόνος ανάμεσα στην αποστολή ενός αιτήματος από τον browser προς τον διακομιστή σου και στη λήψη του πρώτου byte δεδομένων πίσω. Είναι μέτρο της ταχύτητας απόκρισης του διακομιστή. Ένα αργό TTFB καθυστερεί κάθε επόμενο βήμα της φόρτωσης, γιατί ο browser δεν μπορεί να αρχίσει να αποδίδει τίποτα μέχρι να αρχίσει να λαμβάνει δεδομένα. Ένα TTFB πάνω από 800 χιλιοστά του δευτερολέπτου δείχνει συνήθως προβλήματα απόδοσης διακομιστή, αργά περιβάλλοντα φιλοξενίας ή αβελτιστοποίητη επεξεργασία στο backend.
Επηρεάζει ο χρόνος φόρτωσης σελίδας την κατάταξη στο SEO;
Ναι. Οι μηχανές αναζήτησης χρησιμοποιούν τα Core Web Vitals, που προέρχονται από μετρήσεις χρόνου φόρτωσης σελίδας, ως σήματα κατάταξης. Το Largest Contentful Paint, το Interaction to Next Paint και το Cumulative Layout Shift βαθμολογούνται με βάση δεδομένα πραγματικών επισκεπτών και χρησιμοποιούνται για να αξιολογηθεί η εμπειρία σελίδας. Οι σελίδες που βαθμολογούνται στο καλό εύρος έχουν πλεονέκτημα κατάταξης έναντι σελίδων με κακή βαθμολογία, ιδιαίτερα όταν οι ανταγωνιστικές σελίδες έχουν παρόμοια ποιότητα περιεχομένου.