Υπάρχουν πολλοί λόγοι για να βελτιώσεις το πόσο γρήγορα φορτώνουν οι σελίδες στο site σου, με τον κυριότερο από αυτούς να είναι το Cart Abandonment.
Αν οι σελίδες στο site σου αργούν να φορτώσουν και οι δυνητικοί πελάτες αποχωρούν πριν δουν τις υπηρεσίες ή τα προϊόντα σου, πώς θα γνωρίσει ανάπτυξη η επιχείρησή σου χωρίς μια σταθερή ροή εσόδων;
Πρόσφατες μελέτες της Google έδειξαν ότι το 53% των χρηστών που επισκέπτονται ένα site μέσω mobile συσκευών, θα εγκαταλείψουν το site αν αυτό χρειαστεί περισσότερα από τρία δευτερόλεπτα για να φορτώσει.
Οι περισσότεροι SEO Specialists γνωρίζουν πολύ καλά ότι το page speed είναι ένας βασικός παράγοντας κατάταξης στις μηχανές αναζήτησης, τόσο για αναζητήσεις από desktop όσο και από mobile.
Στην πλειοψηφία τους, τα λάθη εκείνα όπου επηρεάζουν αρνητικά το page speed μιας ιστοσελίδας, είναι λίγο πολύ κοινά μεταξύ τους.
Για καλή μας (και σας) τύχη, τα περισσότερα από αυτά τα λάθη μπορούν να διορθωθούν -αν όχι στο 100%, σε ένα πολύ καλό ποσοστό- γρήγορα και εύκολα, αφού κάθε μικρή βελτίωση συνεισφέρει θετικά στη συνολική απόδοση της σελίδας.
Ας ρίξουμε μια ματιά στα τρία πιο συνηθισμένα λάθη που επηρεάζουν το page speed μιας σελίδας, αλλά στο πώς μπορούμε να τα διορθώσουμε.
#1 Image File Size
Το image file size, ή αλλιώς το μέγεθος του αρχείου εικόνας, μπορεί να είναι το πιο συνηθισμένο λάθος που παρατηρείται όταν αναφερόμαστε σε slow-loading σελίδες.
Συχνά, οι webmasters μεταφορτώνουν περιεχόμενο στα websites τους που ενδέχεται να μην είναι βελτιστοποιημένο, και αυτό γίνεται κυρίως σε αρχεία εικόνων.
Το αποτέλεσμα μπορεί να είναι μεγάλα αρχεία εικόνας, ενώ θα μπορούσαν να χρησιμοποιηθούν οι ίδιες εικόνες αλλά σε συμπιεσμένο μέγεθος, με το ίδιο οπτικό αποτέλεσμα.
Ας δούμε ένα παράδειγμα,
Η εικόνα αυτή προέρχεται από ένα blog με προιόντα barbecue. Η επάνω εικόνα αντιπροσωπεύει το μέγεθος της εικόνας όπως αυτή εμφανίζεται στο blog post.
Η κάτω εικόνα είναι το πραγματικό μέγεθος της φωτογραφίας που χρησιμοποιείται. Παρατήρησε πόσο μεγαλύτερη είναι η πηγαία εικόνα από αυτήν που εμφανίζεται πιο πάνω.
Όσο μεγαλύτερη είναι η εικόνα, τόσα περισσότερα pixels πρέπει να φορτώσει. Για να εξοικονομήσεις load time, δοκίμασε να κάνεις resize την εικόνα σου στο μέγεθος που αυτή θα εμφανιστεί στο site σου, πριν την μεταφορτώσεις.
Για παράδειγμα, αν η εμφανιζόμενη εικόνα ενός προϊόντος στο site σου είναι 800×800, είναι λάθος να ανεβάσεις μια εικόνα 1900×1900, καθώς έτσι επιβαρύνεις κατά πολύ το χρόνο φόρτωσής της.
Εάν χρησιμοποιείς CMS (Content Management System), υπάρχουν επίσης πολλά plugins που μπορείς να χρησιμοποιήσεις για αλλάξεις το μέγεθος των εικόνων καθώς τις κάνεις upload στη σελίδα σου.
Αν κάνεις μια αναζήτηση “WordPress plugins to resize images” θα βρεις πολλά plugins και εργαλεία να επιλέξεις, όπως το Compressor που είναι δωρεάν. Το Compressor.io θα συμπιέσει την εικόνα σου χωρίς αυτή να χάσει την ποιότητά της.
#2 Αχρησιμοποίητα Αρχεία JavaScript
Είναι σύνηθες για τα websites να χρησιμοποιούν ένα header file και ένα footer file για να σετάρουν τα heading/navigation menu και footer area αντίστοιχα.
Δεδομένου ότι οι περιοχές αυτές μένουν σταθερές σε ένα website, μπορείς να τις σχεδιάσεις μια φορά και να τις χρησιμοποιείς σε κάθε σελίδα.
Αυτή η τακτική είναι αρκετά αποτελεσματική, ειδικά όταν κάνεις συχνά updates. Για παράδειγμα, αν έχεις κάποια αλλαγή για το navigation menu του site σου, κάνεις την αλλαγή αυτή μια φορά στο header file, και αυτόματα ενημερώνεται κάθε σελίδα που περιλαμβάνει αυτό το navigation menu.
Το πρόβλημα ξεκινάει όταν έχουμε αρχεία JavaScript. Υπάρχουν σίγουρα JavaScript αρχεία που χρειάζεσαι σε κάθε σελίδα του site σου, όπως είναι ο κώδικας Google Analytics. Ωστόσο, άλλα αρχεία JavaScript ενδέχεται να απαιτούνται μόνο σε ορισμένες σελίδες του site.
Για παράδειγμα, ας υποθέσουμε ότι έχουμε ένα site μιας ιδιωτικής κλινικής, όπου εκεί υπάρχει μια σελίδα όπου μπορούν οι χρήστες να κάνουν αίτηση για θεραπείες ρεφλεξολογίας.
Στη σελίδα αυτή, υπάρχει και ένα feature το οποίο προσθέτει την ημερομηνία της θεραπείας στο Google calendar του χρήστη, ενεργοποιώντας ένα JavaScript αρχείο που βρίσκεται στο header file. Αυτό είναι ένα πολύ χρήσιμο feature, και χρήσιμο για όσους κάνουν κράτηση για θεραπεία ρεφλεξολογίας, αλλά το υπόλοιπο site δεν χρησιμοποιεί ή δεν χρειάζεται αυτό το JavaScript αρχείο.
Στη συγκεκριμένη κλινική όμως, το αρχείο αυτό φορτώνει σε κάθε σελίδα του site, είτε χρειάζεται είτε όχι. Οι σελίδες που δεν χρησιμοποιούν αυτό το αρχείο JavaScript, αναγκάζονται να το φορτώσουν, αυξάνοντας το page load time εξαιτίας ενός αρχείου που δεν χρειάζεται καν στη σελίδα.
Τι πρέπει να κάνεις; Αξιολόγησε όλα τα αρχεία JavaScript που βρίσκονται στο header file του site σου. Είναι απαραίτητο να είναι εκεί; Αν όχι, μπορούν να μεταφερθούν στο «body area» έτσι ώστε τα scripts αυτά να φορτώνουν μόνο σε μια σελίδα και όχι σε όλες. Δεν είναι εύκολο, είναι όμως κρίσιμο να το κάνεις..
#3 Φόρτωση Αρχείων από Third-Party Websites
Αν χρειάζεται να φορτώσεις στοιχεία όπως social sharing buttons, embeded videos, trackers και ads από 3rd party websites, προσπάθησε να τα ελαχιστοποιήσεις όσο είναι δυνατόν.
Γιατί;
Δεν είσαι σε θέση να ελέγξεις πόσο γρήγορα θα φορτώσει ένας 3rd party server, καθώς και τα στοιχεία/files που βρίσκονται σε αυτόν. Εάν συμβεί να φορτώσεις αρχεία από 3rd party τα οποία φορτώνονται αργά λόγω κακής απόδοσης του server, αυτό ενδέχεται να επηρεάσει και το χρόνο φόρτωσης της δικής σου σελίδες.
Δες τι αναφέρει η Google σχετικά:
Τα 3rd party scripts παρέχουν ένα ευρύ φάσμα χρήσιμων λειτουργιών, καθιστώντας το web πιο δυναμικό, διαδραστικό και ενοποιημένο. Αυτά τα scripts μπορεί να είναι ζωτικής σημασίας για τη λειτουργικότητα του site σου ή για τη ροή εσόδων. Ωστόσο, τα 3rd party scripts έρχονται επίσης με πολλούς κινδύνους που πρέπει να ληφθούν υπόψη για να ελαχιστοποιηθεί ο αντίκτυπός τους και ταυτόχρονα να προσφέρουν την αξία που πρέπει.
Γιατί πρέπει να είσαι προσεκτικός με 3rd party scripts;
- Μπορεί να επηρεάσουν αρνητικά το performance
- Μπορεί να αποτελούν πρόβλημα privacy/security
- Μπορούν να είναι απρόβλεπτα και να αλλάζουν χωρίς να το γνωρίζεις
- Μπορούν να έχουν απρόβλεπτες συνέπειες
- Χρησιμοποίησε 3rd party scripts αν χρειαστεί, αλλά φρόντισε να το κάνεις μόνο όταν είναι απαραίτητο.
Κλείνοντας
Αν μπορείς να αντιμετωπίσεις αυτά τα τρία κοινά ζητήματα, πιθανότατα θα έχεις βελτιώσει και τους χρόνους φόρτωσης της σελίδας σου, βοηθώντας παράλληλα και το κομμάτι του SEO. Μερικές φορές, ακόμα και οι μικρές αλλαγές, μπορούν να αποφέρουν μεγάλη διαφορά στην συνολική απόδοση.