10 τρόποι για να βελτιώσεις την ταχύτητα της ιστοσελίδας σου

10 τρόποι για να βελτιώσεις την ταχύτητα της ιστοσελίδας σου

Ο χρόνος φόρτωσης μιας ιστοσελίδας είναι ένας από τους παράγοντες κατάταξης της Google – η κατανόηση των διαφορετικών μεθόδων για την επιτάχυνση των ιστοτόπων WordPress θα βοηθήσει στη βελτίωση της εν λόγω κατάταξης, του ποσοστού μετατροπών και της συνολικής εμπειρίας χρήστη. Ο μέσος χρόνος φόρτωσης σελίδας  σε επιτραπέζιους υπολογιστές είναι 10,3 δευτερόλεπτα. Ωστόσο, η Google σημειώνει ότι μια βέλτιστη εμπειρία ιστοσελίδας απαιτεί τη φόρτωση ιστοτόπων σε λιγότερο από 2,5 δευτερόλεπτα.

Αυτό το άρθρο θα εξηγήσει τους δέκα πιο αποτελεσματικούς τρόπους για να βελτιστοποιήσετε την ταχύτητα του ιστότοπού σας στο WordPress, συμπεριλαμβανομένων συμβουλών για τη διατήρηση του γρήγορου χρόνου φόρτωσης.

1. Επέλεξε αξιόπιστο hosting

Το website σου πρέπει να φιλοξενείται σε κάποιον server ο οποίος είναι προσβάσιμος σε όλο το διαδίκτυο μέσω ενός ονόματος domain (www.yourdomain.gr). Υπάρχουν χιλιάδες εταιρείες οι οποίες προσφέρουν υπηρεσίες hosting, δηλαδή φιλοξενίας της ιστοσελίδας σου. Τα κόστη της συγκεκριμένης υπηρεσίας ξεκινάνε από 1$/μήνα και μπορεί να φτάσουν μέχρι και μερικές εκατοντάδες ευρώ ανά μήνα. Μια ιστοσελίδα με μικρή-μέση επισκεψιμότητα δεν χρειάζεται σε καμία περίπτωση ακριβό hosting. Όμως καθώς υπάρχουν όπως είπαμε χιλιάδες εταιρείες και χιλιάδες πακέτα hosting είναι σημαντικό να επιλέξουμε μια σοβαρή εταιρεία η οποία θα προσφέρει τα μέγιστα σε σχέση με τα χρήματα που δίνουμε.

Είναι λοιπόν απαραίτητη η αναζήτηση της καλύτερης λύσης για να μην μας περιορίζει το hosting στην απόδοση της ταχύτητας της ιστοσελίδας. Το πρώτο ερώτημα που πρέπει να γίνει είναι εάν το hosting το οποίο θα επιλέξουμε θα είναι από ελληνική εταιρεία ή ξένη. Σίγουρα, η λύση του εξωτερικού θα μας δώσει περισσότερες επιλογές όμως κάποιοι προτιμούν τις ελληνικές εταιρείες για το support που παρέχουν στα ελληνικά και τους τοπικούς server που διαθέτουν ώστε να μην είναι απαραίτητο το CDN για τους επισκέπτες από την Ελλάδα(βλ. συμβουλή 7).

Πριν όμως κατηγορήσουμε το hosting για την ταχύτητα της σελίδας μας, πρέπει να τσεκάρουμε αν τηρούμε τα παρακάτω.

2. Αναβάθμισε την έκδοση της PHP

Η PHP είναι μια γλώσσα προγραμματισμού από στην πλευρά του διακομιστή που χρησιμοποιούν οι προγραμματιστές για να δημιουργήσουν δυναμικούς και διαδραστικούς ιστότοπους. Τα βασικά στοιχεία του WordPress είναι γραμμέμα κυρίως στην PHP. Αυτή η γλώσσα δέσμης ενεργειών ανοιχτού κώδικα έχει μια νέα έκδοση κάθε χρόνο. Η τακτική ενημέρωση της PHP συμβάλλει στη βελτίωση της ασφάλειας και της απόδοσης του ιστότοπού σας.

3. Βελτιστοποίησε τις εικόνες σου

Η προσθήκη μεγάλων σε μέγεθος εικόνων σε μία ιστοσελίδα είναι το πιο συχνό λάθος που κάνει κάποιος αρχάριος στο website του. Εάν προσθέτεις εικόνες που βρίσκεις στο Google χωρίς βελτιστοποίηση είναι σχεδόν βέβαιο ότι το website σου θα είναι αργό.

Βεβαιώσου ότι οι εικόνες σου είναι περίπου 50-100 KB για να εξασφαλίσεις ταχύτερους χρόνους φόρτωσης. Απέφυγε τα αρχεία PNG. Τα αρχεία PNG έχουν μεγαλύτερο μέγεθος από τα JPEG και μπορούν να οδηγήσουν σε περισσότερα αιτήματα διακομιστή με αποτέλεσμα έναν πιο αργό ιστότοπο. Πέρα από τα αρχεία JPG, εξαιρετικά είναι τα αρχεία WebP. Το WebP είναι ένα σύγχρονος τύπος αρχείου που παρέχει lossless και lossy συμπίεση και έχει φτιαχτεί εξειδικευμένα για εικόνες στο διαδίκτυο. Επίσης σε αντίθεση με τα JPG, στα WebP αρχεία υπάρχει η δυνατότητα ύπαρξης εικόνας με διαφανές background κάτι το οποίο μέχρι πρόσφατα ήταν μια αποκλειστική δυνατότητα των PNG αρχείων. 

Συνεπώς, προτιμάτε πρώτα τον τύπο WebP, στην συνέχεια τον JPG και αποφεύγουμε το PNG.

Κάποια online εργαλεία τα οποία προτείνουμε και μπορούν να σε βοηθήσουν στο έργο της βελτιστοποίησης των εικόνων είναι το tinyjpg το οποίο μειώνει το μέγεθος των JPG εικόνων χωρίς να χάνεται η ποιότητα των εικόνων και το ezgif για την μετατροπή σε WebP.

Θυμηθείτε λοιπόν παιδιά, κρατήστε αυτές τις εικόνες σας μικρές!

4. Εφάρμοσε τον κανόνα των 10 plugins

Τα πολλά plugins σε ένα website μειώνουν την ταχύτητα της ιστοσελίδας. Κάθε plugin που εγκαθιστούμε στην ιστοσελίδα μας μπορεί να δημιουργήσει προβλήματα ασυμβατότητας με άλλα plugins και θέματα και μπορεί να καθυστερήσει σημαντικά τον ιστότοπο μας. Για αυτό τον λόγο, πρέπει να επιλέγουμε αξιόπιστα plugins για να προσθέσουμε στο website μας.

Πέρα όμως από την ποιότητα των plugin, πρέπει να ελέγξουμε και την ποσότητα των plugins τα οποία εγκαθιστούμε. Σίγουρα, τα plugins είναι απαραίτητα σε κάθε website και μας δίνουν πολύτιμες επιπλέον δυνατότητες όμως όσα περισσότερα βάζουμε στην σελίδα μας, τόσο πιο αργή την κάνουμε. Ένας απλό κανόνας που προτείνουμε είναι να μην ξεφεύγουμε από τα δέκα plugins ανά ιστότοπο ώστε να είμαστε σίγουροι ότι δεν επιβαρύνουμε πάρα πολύ την σελίδα μας.

5. Πρόσθεσε ένα caching plugin

Ένα caching plugin είναι απαραίτητο για να πετύχουμε τα μέγιστα αποτελέσματα ταχύτητας στον ιστότοπο μας. Τί είναι όμως ένα caching plugin;

To caching plugin δημιουργεί μια στατική έκδοση HTML των σελίδων σας από τον ιστότοπο και τον αποθηκεύει στον server. Κάθε φορά που κάποιος επισκέπτεται τον ιστότοπο σας, παρουσιάζεται μια προσωρινά αποθηκευμένη σελίδα HTML αντί να γίνεται επεξεργασία των σχετικά βαρύτερων σεναρίων PHP του WordPress. 

Με λίγα λόγια, δημιουργεί αντίγραφα των ιστοτόπων σας ώστε να μην χρειάζεται να φορτώνει και να εκτελεί όλα τα αιτήματα της ιστοσελίδας σας. Μόνο η ενεργοποίηση του caching από μόνη της μπορεί να βοηθήσει τον χρόνο φόρτωσης των σελίδων ενώ ταυτόχρονα τα συγκεκριμένα plugins προσφέρουν πολλές επιλογές οι οποίες με κάποιον πειραματισμό μπορούν να επιφέρουν ακόμα καλύτερα αποτελέσματα.

Κάποια από τα plugin που προτείνουμε είναι το litespeed cache το οποίο διατίθενται δωρεάν για server που χρησιμοποιούν την τεχνολογία litespeed (τσέκαρε το hosting σου) και το wp-rocket το οποίο είναι διαθέσιμο επί πληρωμής.

6. Αφαίρεσε τα αχρησιμοποίητα και ξεπερασμένα plugins

Τα αχρησιμοποίητα plugins μπορούν να δημιουργήσουν διάφορα προβλήματα στην λειτουργία του ιστότοπου μας. Ένα από τα σημαντικότερα είναι να προκαλέσουν κενά ασφαλείας τα οποία μπορούν να τα εκμεταλλευτούν hackers ώστε να παραβιάσουν ή να καταστρέψουν το website σου. Τα συχνά update των plugins πέρα από όλες τις βελτιώσεις που παρέχουν κλείνουν οποιοδήποτε κίνδυνο υπάρχει για τον ιστότοπο.

Επιπλέον, όπως είπαμε και παραπάνω τα πολλά plugin κάνουν τον ιστότοπο μας πιο αργό. Οπότε το να κρατάμε εγκατεστημένα plugins τα οποία δεν χρησιμοποιούμε προσθέτουμε πρόσθετο αχρείαστο βάρος στην σελίδα μας.

7. Μείωσε τον όγκο της javascript

Κάποιες ενέργειες τις οποίες κάνουμε κυρίως όταν είμαστε αρχάριοι είναι να προσθέτουμε πολλά εντυπωσιακά κινούμενα σχέδια τα οποία αν και φαίνονται υπέροχα πρέπει να εφαρμόζονται με μέτρο καθώς μειώνουν σημαντικά την ταχύτητα του website μας.

Η ύπαρξη υπερβολικά πολλών JavaScript και CSS στον ιστότοπό σου αυξάνει τον όγκο των αιτημάτων διακομιστή με αποτέλεσμα τους πιο αργούς χρόνους φόρτωσης. Όταν ένας χρήστης επισκέπτεται την ιστοσελίδα σου, το πρόγραμμα περιήγησης εκτελεί πολλά αιτήματα για τη φόρτωση javascript, css και εικόνων. Εν ολίγοις, τα αυξημένα αιτήματα διακομιστή μπορούν να αυξήσουν σημαντικά την ταχύτητα φόρτωσης της σελίδας με αποτέλεσμα ο ιστότοπός σας να είναι αργός.

Θυμηθείτε λοιπόν, όσο πιο φανταχτερός ο ιστότοπός σας, τόσο πιο αργός μπορεί να γίνει!

8. Χρησιμοποίησε Lazy Load

Το Lazy Load είναι μια τεχνική αναμονής για τη φόρτωση ορισμένων τμημάτων μιας ιστοσελίδας – ειδικά εικόνων – μέχρι να χρειαστούν. Με το Lazy Load, ένα ιστότοπος φορτώνει αρχικά μόνο τις φωτογραφίες που βρίσκονται στο πάνω μέρος της σελίδας και όταν ο χρήστης κάνει scroll down αρχίζει να φορτώνει και τις υπόλοιπες που χρειάζονται. Όταν το Lazy Load δεν είναι ενεργοποιημένο, το πρόγραμμα περιήγησης φορτώνει όλες τις φωτογραφίες της σελίδας με το άνοιγμα της σελίδας. Αυτό έχει σαν αποτέλεσμα να χρειάζεται περισσότερος χρόνος για να φορτώσει η ιστοσελίδα.

Για παράδειγμα, μια ανάρτηση ιστολογίου μπορεί να έχει μια εικόνα στο πάνω μέρος της σελίδας και ένα διάγραμμα κοντά στο κάτω μέρος. Κάποιος που διαβάζει την ανάρτηση ιστολογίου ενδέχεται να μην φτάσει στο κάτω μέρος του κειμένου για αρκετά λεπτά, επομένως το πρόγραμμα περιήγησης περιμένει να φορτώσει το διάγραμμα έως ότου ο αναγνώστης πραγματοποιήσει κύλιση σε αυτήν την ενότητα. Με αυτόν τον τρόπο, η σελίδα φορτώνει πιο γρήγορα στην αρχή, επειδή το πρόγραμμα περιήγησης φορτώνει μία εικόνα αντί για δύο.

Συνήθως, τα caching plugins δίνουν την δυνατότητα ενεργοποίησης του Lazy Load. Επίσης, πολλά θέματα στο WordPress δίνουν την συγκεκριμένη δυνατότητα. Προσοχή: ενεργοποίησε το lazy load μόνο με έναν τρόπο καθώς η ενεργοποίηση του lazy load στο θέμα και στο caching plugin ταυτόχρονα είναι πολύ πιθανό να δημιουργήσει προβλήματα.

9. Χρησιμοποίησε CDN

Ένα CDN επιτρέπει τη γρήγορη μεταφορά των στοιχείων που απαιτούνται για τη φόρτωση περιεχομένου στο Διαδίκτυο, συμπεριλαμβανομένων σελίδων HTML, αρχείων javascript, CSS, εικόνων και βίντεο. Η δημοτικότητα των υπηρεσιών CDN αυξάνεται συνεχώς ενώ σήμερα η πλειονότητα της επισκεψιμότητας ιστού εξυπηρετείται μέσω CDN, συμπεριλαμβανομένης της επισκεψιμότητας από σημαντικούς ιστότοπους όπως το Facebook, το Netflix και το Amazon.

Στον πυρήνα του, ένα CDN είναι ένα δίκτυο διακομιστών που συνδέονται μεταξύ τους με στόχο την παράδοση περιεχομένου όσο το δυνατόν πιο γρήγορα, φθηνά, αξιόπιστα και με ασφάλεια. Προκειμένου να βελτιωθεί η ταχύτητα και η συνδεσιμότητα, ένα CDN θα τοποθετήσει διακομιστές στα σημεία ανταλλαγής μεταξύ διαφορετικών δικτύων.

cloudflare

Με λίγα λόγια, στιγμιότυπα του ιστότοπου αποθηκεύονται σε διάφορα σημείο του κόσμου ώστε ο χρήστης που επισκέπτεται την ιστοσελίδα σου να συνδέεται με τον κοντινότερο δυνατό server. Η χρήση του CDN είναι ιδιαίτερα σημαντική όταν ο ιστότοπος δέχεται επισκέπτες από διάφορα σημεία του κόσμου. Επίσης, είναι σημαντικό όταν έχουμε επιλέξει κάποια υπηρεσία hosting που φιλοξενεί τους server της στο εξωτερικό, ενώ εμείς δεχόμαστε χρήστες κυρίως από την Ελλάδα και για αυτό τον λόγο χρειαζόμαστε ένα στιγμιότυπο κάπου στην Ελλάδα. 

Η πιο δημοφιλής εταιρεία που προσφέρει υπηρεσίες CDN είναι η Cloudflare η οποία προσφέρει και δωρεάν πλάνο. Συνεπώς, δεν χάνουμε τίποτα να το χρησιμοποιήσουμε στον ιστότοπο μας.

Free Plan Overview | Cloudflare

Από την άλλη, μια καλύτερη επιλογή είναι το bunny cdn το οποίο χρησιμοποιούμε στην Webble είναι το Bunny CDN. Η συγκεκριμένη εταιρεία προσφέρει πλάνα επί πληρωμής με πολύ χαμηλές χρεώσεις με βάση το bandwidth που απαιτεί κάθε ιστοσελίδα και προσφέρει 14 ημέρες δωρεάν δοκιμής.

Bunny.net – The content delivery platform that truly hops

10. Κάνε μετρήσεις και τσέκαρε τα αποτελέσματα

Υπάρχει πληθώρα εργαλείων με τα οποία μπορούμε να ελέγξουμε την ταχύτητα του ιστότοπου μας. Τα συγκεκριμένα εργαλεία μας βοηθούν ώστε να εξετάσουμε τα αποτελέσματα που έχουν οι ενέργειες μας στην βελτιστοποίηση της ταχύτητας.

Ένα από αυτά είναι το google page speed το οποίο ξεχωρίζει καθώς μας δίνει δωρεάν δεδομένα για την ταχύτητα των κινητών συσκευών, ένα στοιχείο το οποίο εξετάζει η Google για την κατάταξη των αποτελεσμάτων της μηχανής αναζήτησης.

Ένα επίσης δημοφιλές εργαλείο είναι το GTmatrix το οποίο βαθμολογεί την σελίδα μας δίνοντας μας ταυτόχρονα κάποιες συμβουλές.

Τέλος, το pingdom είναι ένα εργαλείο το οποίο πέρα από βαθμολογία μας υπολογίζει το μέγεθος της σελίδας μας (η οποία προτείνουμε να είναι κάτω από 3mb) και τα server request μειώνουν την ταχύτητα μας. Τα server request προκαλούνται συνήθως από τα plugins, τις πολλές φωτογραφίες και τον όγκο της javascript.

Η ύπαρξη προβλημάτων ταχύτητας μπορεί να είναι απογοητευτική για ένα website το οποίο έχουμε αφιερώσει πολύ χρόνο για να κατασκευάσουμε. Ελπίζουμε με τις παραπάνω συμβουλές να σε έχουμε βοηθήσει να απαντήσεις στο ερώτημα πώς να βελτιώσεις την ταχύτητα του ιστότοπου σου και με κάποια απλά βήματα όπως την βελτιστοποίηση των εικόνα να καταφέρεις να δεις άμεσα αποτελέσματα! 

 

 

Φώτης Λαμβάκης
Φώτης Λαμβάκης
Ιδρυτής

Ο Φώτης είναι ο ιδρυτής της Webble, μιας εταιρείας που παρέχει καινοτόμες λύσεις στον ψηφιακό κόσμο. Ως ειδικός στo ψηφιακό μάρκετινγκ και στις ψηφιακές τεχνολογίες, ο Φώτης έχει αναπτύξει μια επιχείρηση που βοηθά τους πελάτες να αναπτυχθούν στο διαδίκτυο.Ως συντάκτης του blog, ο Φώτης διαμορφώνει το περιεχόμενο και την κατεύθυνση του blog της εταιρείας μας. Με τη βοήθειά του, δημοσιεύουμε συνεχώς ποιοτικό και ενημερωτικό περιεχόμενο σχετικά με τις τάσεις και τα θέματα του ψηφιακού κόσμου.

Άφησε ένα σχόλιο

To email σου δεν θα κοινοποιηθεί.Υποχρεωτικά πεδία *