Πόσο σημαντική είναι η ταχύτητα "φόρτωσης" του site μου;
Από Λάζαρος Γεωργούλας
Χρήσιμες πληροφορίες 😁 για τον χρόνο "φόρτωσης" μιας ιστοσελίδας και πως να τον μειώσεις. "Κατέβασε" εντελώς δωρεάν 3 ηλεκτρονικά βιβλία (PDF ebooks)!
1. Δωρεάν στρατηγική κέρδους
2. Οδηγός για νέες ιστοσελίδες
3. Βγάλε λεφτά με το bitcoin
Απλά βάλε το email σου στη παρακάτω φόρμα και θα λάβεις άμεσα τα 3 ebooks!
Μισώ το SPAM! Η διεύθυνση email σου είναι ασφαλής και δεν θα γνωστοποιηθεί ποτέ σε τρίτους! Αν ενδιαφέρεσαι, Μάθε περισσότερα για τα 3 ebooks...
Όπως έχω αναφέρει και στο άρθρο μου για το πως να διατηρείς τους επισκέπτες στο site σου και να τους κάνεις να ξανάρθουν, ο χρόνος που έχεις για να "κερδίσεις" έναν επισκέπτη που μπαίνει στο site σου είναι πολύ μικρός.
Οι έρευνες δείχνουν ότι ο μέσος χρήστης περιμένει 3 με 4 δευτερόλεπτα για να "φορτώσει" ένα site και από εκεί και πέρα μένει κατά μέσο όρο για 15 δευτερόλεπτα μέχρι να βρει αυτό που αναζητά. Αν δεν βρει αυτό που θέλει θα φύγει για κάποιον άλλον ιστότοπο.
Σε αυτό το άρθρο θα μιλήσω κυρίως για τον χρόνο "φόρτωσης" μιας ιστοσελίδας (Website Load Time) και θα προτείνω τρόπους να μειωθεί αυτός ο χρόνος έτσι ώστε η απόδοση του ιστότοπου σου να είναι η βέλτιστη και η διατήρηση των χρηστών η ιδανική. Το άρθρο έχει αρκετούς τεχνικούς όρους που μπορεί να είναι άγνωστοι σε μερικούς χρήστες αλλά η κεντρική ιδέα θα γίνει σίγουρα κατανοητή.-
Αν η ιστοσελίδα σου δεν "φορτώσει" γρήγορα (μέσα στα πρώτα 3-4 δευτερόλεπτα) τότε κινδυνεύεις να χάσεις ένα μεγάλο μέρος χρηστών που είτε είναι ανυπόμονοι είτε ακολοθούν τις επιταγές της εποχής και θέλουν την πληροφορία έτοιμη στο πιάτο τους σε όσο το δυνατόν μικρότερο χρονικό διάστημα.
Αυτό είναι ιδιαίτερα αληθές σε eshop (οι χρήστες ανυπομονούν να ολοκληρώσουν μια αγορά) όπου αν ο χρόνος φόρτωσης δεν είναι μικρός τότε οι χρήστες αναζητούν κάποιο άλλο καλύτερο eshop παρατώντας το καλάθι τους (cart abandonement). Αν ένας δυνητικός πελάτης εγκαταλείψει το καλάθι του χωρίς να ολοκληρώσει την αγορά τότε θα έχει βιώσει μια κακή online εμπειρία και θα είναι απίθανο να προτείνει το eshop σε φίλους, γνωστούς και followers (κάτι που πιθανόν να έκανε αν έμενε ευχαριστημένος). Να ακόμα ένας λόγος για να δώσει κανείς βάση στον χρόνο "φόρτωσης" μιας σελίδας.
Πως λοιπόν να μειώσω το website load time;
1. Ελαχιστοποίησε τα http αιτήματα (http requests)
Τα http (Hyper Text Transfer Protocol) requests συμβαίνουν όταν ο περιηγητής (browser) "σερβίρει" μια σελίδα, μια εικόνα ή ένα αρχείο. Σύμφωνα με έρευνες τα αιτήματα αυτά αποτελούν περίπου το 80% του χρόνου "φόρτωσης" μιας σελίδας. Όσο περισσότερα τα http αιτήματα τόσο περισσότερος χρόνος χρειάζεται μια σελίδα για να "φορτώσει" πλήρως.
Πως να μειώσω τα http αιτήματα;
Μερικές συμβουλές είναι να έχεις ένα απλό design στις σελίδες σου και να διατηρείς ένα και μόνο ένα αρχείο για τα CSS (Cascading Style Sheets) και όχι περισσότερα. Αν και αυτό μπορεί να σε περιορίσει σχεδιαστικά γιατί κάποιες σελίδες μπορεί να έχουν διαφορετικά styles, το να μαζέψεις όλο τον κώδικα CSS σε ένα αρχείο θα μειώσει τον χρόνο "φόρτωσης" μιας σελίδας.
Το ίδιο ισχύει και για τη Javascript. Προτείνεται όσο είναι εφικτό να περιορίσεις τον αριθμό των αρχείων JS για καλύτερη απόδοση. Βέβαια είναι αυτονόητο ότι δεν πρέπει να υπάρχει κώδικας CSS ή scripts που να μην χρησιμοποιούνται καθόλου ή ελάχιστα από τις σελίδες.
Μια άλλη συμβουλή είναι να μειώσεις τον αριθμό των εικόνων που χρησιμοποιείς στον ιστότοπο σου ιδιαίτερα αν πρόκειται για εικόνες που είναι μεγάλες σε μέγεθος (MB) ή εικόνες που δεν προσδίδουν μεγάλη αξία στην εμπειρία περιήγησης των χρηστών π.χ. εικόνες που δεν ανταποκρίνονται στα κείμενα μιας σελίδας.
Μια τακτική που χρησιμοποιούν πολλοί web designers είναι να χρησιμοποιούν κώδικα CSS για να τοποθετήσουν συγκεκριμένες εικόνες στις σελίδες (CSS background) όταν π.χ. μια εικόνα είναι κοινή για πολλές σελίδες...
2. Χρησιμοποίησε την τεχνολογία CDN (Content Delivery Network)
Αν έχεις μια ιστοσελίδα διεθνούς χαρακτήρα (π.χ. αν είναι στα Αγγλικά) τότε το πιο πιθανό είναι οι χρήστες σου να είναι από διάφορες χώρες και ηπείρους. Αλλά ακόμα και αν το site σου ειναι στα Ελληνικά υπάρχουν πολλοί ομογενείς που περιηγούνται σε ελληνικές ιστοσελίδες και τις αναζητούν.
Σε μια τέτοια περίπτωση θα μπορούσες να επωφεληθείς σημαντικά από την χρήση ενός δικτύου CDN που θα διασπείρει το περιεχόμενο του ιστότοπου σου σε μια σειρά από διακομιστές (servers) που βρίσκονται σε διαφορετικά σημεία-κλειδιά του πλανήτη (έχω γράψει και μια σύντομη εισαγωγή στο δίκτυο CDN με περισσότερες πληροφορίες, σου προτείνω να το διαβάσεις).
Έπειτα όταν κάποιος χρήστης από μια άλλη χώρα ή ήπειρο μπει στο site σου θα αναζητηθεί ο CDN server που είναι πιο κοντά και αυτός θα σερβίρει ένα τμήμα ή ολόκληρο το περιεχόμενο των σελίδων σου.
Το CDN προτείνεται για μεγάλα sites ή εταιρίες και όχι για τον μέσο χρήστη καθώς το επιπλέον κόστος του μπορεί να είναι απαγορευτικό αλλά το πλεονέκτημα είναι ότι η απόδοση μιας ιστοσελίδας μπορεί να αυξηθεί στο μέγιστο. Επίσης ο ανταγωνισμός έχει ωφελήσει έτσι ώστε να υπάρχουν και αρκετά φθηνά CDN (συνήθως η χρέωση γίνεται για κάθε MB που χρησιμοποιείται).
3. Ενεργοποίηση της μνήμης cache των περιηγητών
Η μνήμη cache των περιηγητών (browsers) επιτρέπει κάποια στοιχεία ενός site να αποθηκεύονται στους Η/Υ των χρηστών καθώς αυτοί περιηγούνται στο διαδίκτυο. Αυτό γίνεται συνήθως σε προσωρινή βάση και μικραίνει τον χρόνο "φόρτωσης" μιας σελίδας αφού κάποια στοιχεία δεν χρειάζεται να "κατεβούν" από τον server αλλά από τους Η/Υ των χρηστών (π.χ. το λογότυπο μιας εταιρίας).
Έρευνες δείχνουν ότι το 50%-60% των χρηστών θα έρθουν στην ιστοσελίδα σου με άδεια μνημη cache δηλαδή χωρίς κάποια στοιχεία αποθηκευμένα από πριν (πιθανόν να μην έχουν επισκεφθεί ξανά τον ιστότοπο σου αλλά έτσι κι αλλιώς η μνήμη cache είναι προσωρινή).
Για τον λόγο αυτό θα πρέπει να φροντίσεις η σελίδα από την οποία εισέρχονται οι περισσότεροι χρήστες (πιθανόν η κεντρική σου σελίδα) να "φορτώνει" γρήγορα ώστε οι χρήστες να μην δυσανασχετήσουν και να συνεχίσουν την περιήγηση στις υπόλοιπες σελίδες σου.
Η ενεργοποίηση της μνήμης cache στον server σου απαιτεί εξειδικευμένες τεχνικές γνώσεις και έναν dedicated server ή root access (διάβασε και αυτό το άρθρο για το ποιές επιλογές έχεις όταν επιλέγεις hosting για το site σου). Αν δεν έχεις dedicated server ή αν ανήκεις στη κατηγορία του μέσου χρήστη και δεν είσαι server administrator τότε καλύτερα να συμβουλευτείς τον παροχέα σου web hosting για να βεβαιωθείς ότι έχει ενεργοποιήσει το browser caching (συνήθως είναι ενεργοποιημένο)...
4. Επεξεργασία εικόνων για το διαδίκτυο
Σύμφωνα με έρευνες οι εικόνες καταλαμβάνουν το 50%-60% των bytes (υπομονάδα των MegaBytes, 1 MB = 1000 KiloBytes, 1 KB = 1000 bytes) μιας σελίδας...
Κατά μέσο όρο οι εικόνες καταλαμβάνουν ~1500 ΚΒ, τα διάφορα scripts ~400KB, τα CSS 45KB και τα βίντεο ~300KB.
Οι εικόνες λοιπόν αποτελούν το μεγαλύτερο μέρος των αιτημάτων http (μιλήσαμε για αυτά παραπάνω) που αποστέλλονται προς τον server του site σου. Επίσης ειπώθηκε ότι για να μειωσεις τον χρόνο "φόρτωσης" των σελίδων σου θα πρέπει να αφαιρέσεις παραπανίσιες εικόνες. Δεν φτάνει όμως μόνο αυτό. Θα πρέπει να επεξεργαστείς με κάποιο τρόπο τις εικόνες που θα χρησιμοποιήσεις στο internet...
Πολλοί ιδιοκτήτες site αναζητούν εικόνες σε διάφορα sites (δες κι αυτό το άρθρο για τα πνευματικά δικαιώματα και πως να βρεις εικόνες για το site σου), τις "κατεβάζουν" και έπειτα τις "ανεβάζουν" όπως είναι στον server τους. Συνήθως (τι συνήθως δηλαδή... σχεδόν πάντα!) αυτές οι εικόνες είναι υψηλής ανάλυσης, είναι μεγάλες σε διαστάσεις και έχουν μεγάλο μέγεθος (σε MB ή KB).
Αυτό δεν είναι και η καλύτερη πρακτική αν ο στόχος σου είναι να βελτιώσεις την απόδοση των σελίδων σου.
Θα πρέπει λοιπόν να επεξεργαστείς τις εικόνες για το διαδίκτυο πριν τις "ανεβάσεις" στον server σου. Αν έχεις Photoshop τότε θα βρεις την επιλογή "Save for web" ή "Save for web & devices" πολύ χρήσιμη. Το ίδιο αποτέλεσμα μπορείς να πετύχεις και με άλλα προγράμματα επεξεργασίας εικόνων.
Αν όμως δεν γνωρίζεις από Photoshop τότε μπορείς να κάνεις μια αναζητηση στο διαδίκτυο για "image optimizer online" ή "compress images online" ή "free image optimizer" ή κάτι αντίστοιχο και με μερικά κλικ να μειώσεις το μέγεθος των εικόνων σου καθώς υπάρχουν πολλά sites που κάνουν αυτή τη δουλειά...
Σε γενικές γραμμές (για βέλτιστη απόδοση και για όσους γνωρίζουν κάποια πράγματα από εικόνες) μια εικόνα δεν πρέπει να ξεπερνά τα 150-170KB. Επίσης δεν πρέπει να ξεπερνά σε διαστάσεις τα 1920 pixels και σε ανάλυση (resolution) τα 72 dpi. Σε διαφορετική περίπτωση η εικόνα δεν θα "φορτώνει" γρήγορα ή άμεσα που είναι και το ιδανικό.
Αυτές ήταν λοιπόν μερικές απλές συμβουλές για να μειώσεις τον χρόνο "φόρτωσης" του ιστότοπου σου και να προσφέρεις στους χρήστες μια ιδανική εμπειρία περιήγησης αλλά και να διατηρήσεις το ενδιαφέρον τους. Ελπίζω το άρθρο να ήταν αρκετά βοηθητικό. Αν έχεις απορίες μη διστάσεις να επικοινωνήσεις μαζί μου και θα απαντήσω το συντομότερο.
Αν χρειάζεσαι συμβουλές πάνω σε θέματα διαδικτύου ή κάποιον ειδικό να συζητήσεις για την προώθηση του ιστότοπου σου τότε μπορείς να νοικιάσεις όσο από τον χρόνο μου επιθυμείς και θα κάτσω με σοβαρότητα και επαγγελματισμό να μοιραστώ όλα όσα έχω μάθει τα τελευταία 15 χρόνια για το internet, το marketing, το SEO και γενικά το διαδίκτυο. Κλείσε μια συνεδρία μαζί μου μέσω της υπηρεσίας "Διαδικτυακός Σύμβουλος" και θα δώσω τον καλύτερο μου εαυτό για να σε βοηθήσω.-
Αν βρήκες το άρθρο ενδιαφέρον τότε σίγουρα θα σου αρέσουν τα 3 ηλεκτρονικά βιβλία (ebooks) μου που προσφέρω εντελώς δωρεάν αν πραγματοποιήσεις εγγραφή στις ενημερώσεις nextnet.gr. Η εγγραφή είναι κι αυτή 100% δωρεάν και με την ολοκλήρωση της θα λάβεις αμέσως τους συνδέσμους (download links) για τα 3 βιβλία μου (μάθε περισσότερα για τα δωρεάν 3 ebooks)! Απλά βάλε το καλύτερο email σου στη παρακάτω φόρμα και κάνε κλικ στο "Εγγραφή"...:
- Μισώ το SPAM!
- Η διεύθυνση email σου είναι ασφαλής.
- Μπορείς ανά πάσα στιγμή να διαγραφείς από τις ενημερώσεις.
Πιο πρόσφατο άρθρο:
ΔΩΡΕΆΝ εγγραφή στις ενημερώσεις NEXTNET
