Πώς να αναβάλλετε εικόνες εκτός οθόνης στο WordPress

Όλοι γνωρίζουμε ότι η ταχύτητα είναι πολύ σημαντική για το SEO και τη μετατροπή. Η γρήγορη δημιουργία ενός ιστότοπου μπορεί να βοηθήσει αυτόν τον ιστότοπο να καταταχθεί υψηλότερα στο Google. Και μπορεί επίσης να κάνει τους αναγνώστες σας χαρούμενους. Σε ποιον δεν αρέσει μια γρήγορη ιστοσελίδα;

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

Εάν έχετε ελέγξει τον ιστότοπό σας μέσω εργαλεία δοκιμής ταχύτητας όπως το Google PageSpeed ​​Insight ή το Web.dev, μία από τις προειδοποιήσεις που μπορεί να λάβετε είναι να "αναβάλετε τις εικόνες εκτός οθόνης".

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

Ωστόσο, θα πρέπει να γνωρίζετε ότι γιατί η αναβολή εικόνων εκτός οθόνης μπορεί να ενισχύσει την ταχύτητα του κινητού σας, οι πιο σημαντικοί παράγοντες που επηρεάζουν την ταχύτητά σας είναι η φιλοξενία και το θέμα σας. Εδώ στο BloggingTools, χρησιμοποιούμε Συννεφιά γιατί είναι η ταχύτερη φιλοξενία WordPress. Εάν δεν μπορείτε να αντέξετε οικονομικά το Cloudways, τότε το Bluehost ή το Hostinger είναι καλές επιλογές. Για το Θέμα, χρησιμοποιούμε το πιο γρήγορο θέμα WordPress που είναι γνωστό ως Δημιουργία Τύπου.

Τι σημαίνει αναβολή εικόνων εκτός οθόνης;

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

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

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

Λάβετε υπόψη ότι δεν μπορείτε να αναβάλλετε μόνο τις εικόνες, αλλά τα περισσότερα από τα στοιχεία του ιστότοπού σας μπορούν επίσης να αναβληθούν μέχρι να χρειαστούν.

Πώς να αναβάλλετε εικόνες εκτός οθόνης στο WordPress

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

Μόλις μπορέσετε να φορτώσετε αργά τις εικόνες και άλλα στοιχεία που εμποδίζουν τη γρήγορη φόρτωση της σελίδας σας. Η "αναβολή εικόνων εκτός οθόνης" από το Google PageSpeed ​​Insight και άλλα εργαλεία δοκιμών θα εξαφανιστεί.

Ακολουθήστε αυτά τα βήματα για να αναβάλετε τις εικόνες εκτός οθόνης στο WordPress:

1. Εγκαταστήστε ένα πρόσθετο φόρτωσης Lazy

Υπάρχουν πολλά lazy loading plugins που είναι διαθέσιμα δωρεάν στον κατάλογο προσθηκών WordPress. Μπορείτε να μεταβείτε στο Plugin, να προσθέσετε νέα και να πληκτρολογήσετε Lazy loading. Εγκαταστήστε οποιονδήποτε έχει καλές κριτικές.

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

Επίσης, εάν χρησιμοποιείτε το Jetpack και το autoptimize, έχουν χαλαρές επιλογές φόρτωσης.

2. Ενεργοποιήστε τις επιλογές lazy loading

Μόλις εγκαταστήσετε το πρόσθετο, βεβαιωθείτε ότι έχετε ενεργοποιήσει την επιλογή lazy loading. Εάν έχετε μια προσθήκη προσωρινής μνήμης με λειτουργία τεμπέλης φόρτωσης, βεβαιωθείτε ότι έχετε ενεργοποιήσει αυτήν την επιλογή.

3. Εκκαθαρίστε την προσωρινή μνήμη.

Μόλις ενεργοποιηθεί το lazy loading, διαγράψτε την προσωρινή μνήμη και αυτό είναι όλο!

Μπορείτε να δοκιμάσετε ξανά τον ιστότοπό σας, η προειδοποίηση θα πρέπει να φύγει!

Αναβολή εικόνων εκτός οθόνης Προσθήκη WordPress

Τα πρόσθετα Defer offsreen images είναι ίδια με τα πρόσθετα lazy loading. Εδώ είναι μερικά παρακάτω:

1. jetpack

jetpack είναι ένα από τα πιο δημοφιλή πρόσθετα WordPress με πάνω από 5 εκατομμύρια ενεργές εγκαταστάσεις. Εάν έχετε ήδη εγκαταστήσει το Jetpack, δεν χρειάζεται να εγκαταστήσετε πρόσθετο πρόσθετο για τεμπέλικο φόρτωμα.

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

2. Αυτόματη βελτιστοποίηση

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

Μεταβείτε στις ρυθμίσεις Autoptimize και, στη συνέχεια, κάντε κλικ στην καρτέλα εικόνων και ενεργοποιήστε τη Lazy loading.

3. WP Rocket

WP Rocket είναι το πιο δημοφιλές πρόσθετο κρυφής μνήμης WordPress premium. Εάν χρησιμοποιείτε το WP Rocket, δεν χρειάζεστε άλλο πρόσθετο, έχουν ενεργοποιημένη την τεμπέλικη φόρτωση.

Μεταβείτε στις ρυθμίσεις WP Rocket και, στη συνέχεια, κάντε κλικ στο μέσο, ​​από εκεί μπορείτε να ενεργοποιήσετε την τεμπέλικη φόρτωση.

4. LiteSpeed ​​Cache

Εάν χρησιμοποιείτε το Προσθήκη LiteSpeed ​​Cache, Έχει μια χαλαρή λειτουργία φόρτωσης. Για ενεργοποίηση, απλώς μεταβείτε στην ενότητα πολυμέσων και εκεί μπορείτε να ενεργοποιήσετε την τεμπέλικη φόρτωση.

5. a3 Lazy Load

Αν χρειάζεστε απλώς ένα πρόσθετο για Lazy φόρτωση μόνο τότε a3 Lazy Load είναι ένα καλό πρόσθετο για αυτό. Απλώς μεταβείτε στην προσθήκη > προσθήκη νέου. Αναζήτηση για a3 Lazy Load. Εγκαταστήστε και ενεργοποιήστε. Στη συνέχεια, μεταβείτε στις ρυθμίσεις των προσθηκών και ενεργοποιήστε το lazy loading.

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

Συχνές Ερωτήσεις (FAQs)