Βελτίωση ταχύτητας στο site με αυτά τα 8 tips. Δείτε πως

Βελτίωση ταχύτητας στο site

Βελτίωση ταχύτητας στο site με αυτά τα 8 tips. Δείτε πως

Χρησιμοποιώντας αυτά τα 8 χρήσιμα  tips η βελτίωση ταχύτητας στο site σου θα είναι θεαματική και οι επιδόσεις της θα απογειωθούν

1. Όρισε τις διαστάσεις στις εικόνες σου

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

Για να ορίσεις τις διαστάσεις κάθε εικόνας, δεν έχεις παρά να προσθέσεις width=”xxxx” και height=”xxxx” μέσα στο <img>.

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

2. Χρησιμοποίησε CSS Sprites

Τα CSS Sprites χρησιμοποιούνται για να μειωθεί το μέγεθος, ο χώρος που θα χρειαστούν αλλά και η ταχύτητα με την οποία θα φορτώσουν οι εικόνες στο site σου. Αφού επιλέξεις τις εικόνες που θέλεις να ανεβάσεις σε μια σελίδα, αρκεί να τις εισάγεις σε έναν css sprite generator. Ο generator θα σου παράξει τόσο ένα συνολικό αρχείο, το οποίο θα περιέχει τις εικόνες που θέλεις να προσθέσεις, όσο και τον κώδικα που θα χρειαστείς για να τις διαχειριστείς μέσα στο sprite.

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

3. Κάνε cache του περιεχομένου του website

Μια μνήμη cache είναι μια περιοχή στη μνήμη του υπολογιστή που αποθηκεύει τις πρόσφατα χρησιμοποιούμενες πληροφορίες. Όταν αποθηκεύεται ένας ιστότοπο, σημαίνει ότι οι σελίδες, οι εικόνες, τα αρχεία και τα αντικείμενα του ιστότοπου αποθηκεύονται στον τοπικό σκληρό δίσκο του χρήστη. Αυτό με τη σειρά του σημαίνει ότι όταν ένας χρήστης ανοίγει ένα αρχείο που έχει πρόσβαση συχνά, το πρόγραμμα περιήγησης θα έχει αποθηκευμένα τα περισσότερα (αν όχι όλα) αρχεία του.

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

Στην WEBONE χρησιμοποιούμε το wpCache® ένα από τα κορυφαία caching εργαλεία.

4. Διόρθωσε τα broken links του site σου

Τα broken links εκτός από το SEO του site σου, μπορούν να επηρεάσουν αρνητικά το traffic, ενώ είναι πολύ πιθανό να προτρέψουν το χρήστη να εγκαταλείψει το site σου. Καλό θα ήταν, λοιπόν, να κάνεις περιοδικούς ελέγχους για να τα εντοπίζεις και να τα διορθώνεις ή να προσθέτεις 301 redirects όπου είναι απαραίτητο.

5. Εφάρμοσε το Lazy Load για τις εικόνες σου

Η λογική πίσω από το Lazy Load είναι η σταδιακή φόρτωση των εικόνων στο site σου, ανάλογα με το ποιες από αυτές είναι ορατές στον χρήστη. Αν, δηλαδή, υπάρχουν εικόνες προς το τέλος της σελίδας, δεν θα φορτώσουν μέχρι να κάνει scroll down ο επισκέπτης.

Έτσι, μειώνεται ο όγκος των αρχείων που πρέπει να εμφανιστούν άμεσα και αυξάνεται η συνολική ταχύτητα φόρτωσης. Ανάλογα με το ποια CMS πλατφόρμα χρησιμοποιείς, υπάρχουν και τα ανάλογα plugins ή extensions που μπορείς να εγκαταστήσεις, γι’ αυτήν τη διαδικασία. Ενδεικτικά, για το WordPress μπορείς να εγκαταστήσεις το Lazy Load και για το Drupal το Image Lazyloader.

6. Φρόντισε για την ταχύτητα της home page

Κατά πάσα πιθανότητα, οι περισσότεροι επισκέπτες του site σου θα φτάσουν πρώτα στην αρχική σου σελίδα. Για να τους κρατήσεις και να εξασφαλίσεις ένα χαμηλό bounce rate, είναι απαραίτητο να τη βελτιστοποιήσεις, ώστε να φορτώνει όσο γίνεται πιο γρήγορα. Πώς θα το καταφέρεις αυτό;

Φρόντισε να διατηρήσεις ένα minimal σχεδιασμό. Είναι περισσότερο καλαίσθητο ως επιλογή και παράλληλα δεν επιβαρύνει την ταχύτητα φόρτωσης.

Χρησιμοποίησε CSS για τα μονόχρωμα backgrounds, καθώς φορτώνει πολύ πιο γρήγορα από μία εικόνα.

Αν διατηρείς blog, εμφάνισε λίγα posts στην αρχική σου σελίδα.

7. Μείωσε τα HTTP requests

Ήδη με αρκετές από τις παραπάνω ενέργειες, έχεις μειώσει χωρίς πολύ κόπο τα HTTP requests που αποστέλλει ο browser στον web server. Κάτι ακόμα που μπορείς να κάνεις προς αυτήν την κατεύθυνση, είναι να εκμεταλλευτείς το νέο πρωτόκολλο επικοινωνίας HTTP/2.

Αφού βεβαιωθείς ότι ο server στον οποίον φιλοξενείται το site σου υποστηρίζει το HTTP/2 και ενεργοποιήσεις ένα SSL πιστοποιητικό, μπορείς να επωφεληθείς από τις ταχύτητες που προσφέρει το πρωτόκολλο, βασικό χαρακτηριστικό του οποίου είναι τα μειωμένα HTTP requests.

8. Προτίμησε σελίδες μικρές σε έκταση

Το να διατηρείς στο site σου σελίδες μεγάλες σε έκταση μπορεί να επηρεάσει δύο σημαντικά σημεία: την ταχύτητα φόρτωσης, καθώς θα χρειαστεί να εμφανιστεί μεγάλος όγκος πληροφορίας στον τελικό χρήστη, την εμπειρία του ίδιου του χρήστη, ο οποίος είναι πιθανό να αποθαρρυνθεί κάνοντας ατελείωτο scroll down. Κρατώντας τις σελίδες σου μικρές σε έκταση, συμβάλλεις αποτελεσματικά στην μείωση του χρόνου φόρτωσης, και παράλληλα παρέχεις στον επισκέπτη σου την πληροφορία που πραγματικά χρειάζεται. Εφάρμοσε τις παραπάνω πρακτικές στο site σου και δες την επισκεψιμότητα και τα conversions να ανεβαίνουν! Και, βέβαια, φρόντισε να προσθέσεις στα σχόλια τα δικά σου tips για γρήγορες ταχύτητες!

Share this post