Προοδευτική Lazy Loading για το Joomla

Η δημιουργία εξαιρετικού περιεχομένου στο Joomla! είναι ένα πράγμα, το να το κάνετε προσβάσιμο είναι άλλο. Το Lazy loading είναι μια λύση που συνδυάζει τα δύο χωρίς να αλλάζει τη ροή εργασίας σας. Με προοδευτική φόρτωση lazy loading, οι εικόνες φορτώνονται μόνο εάν και όταν χρειάζονται. Εάν ο αναγνώστης δεν φτάσει ποτέ σε μια εικόνα στη σελίδα, δεν γίνεται ποτέ λήψη. Τώρα, το lazy loading είναι επίσης διαθέσιμο στο Joomla!

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

Ενεργοποίηση Lazy Loading στο Joomla!

Η Φόρτωση σε Joomla! είναι μέρος της επέκτασης Speed Cache. Η ενεργοποίηση της Φόρτωσης είναι τόσο απλή όσο το άναμμα ενός διακόπτη. Ωστόσο, το Joomla! Speed Cache περιλαμβάνει επίσης άλλα χαρακτηριστικά που σας βοηθούν να αξιοποιήσετε στο έπακρο τη Φόρτωση.

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

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

Εξαίρεση εικόνων από το Joomla! Lazy Loading

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

Σε ορισμένες περιπτώσεις, ωστόσο, μπορεί να θέλετε να εξαιρέσετε (ή να συμπεριλάβετε) ολόκληρα σύνολα αναρτήσεων ή σελίδων του Joomla! από το lazy loading. Οι λόγοι για τους οποίους θα το κάνετε αυτό ποικίλλουν πολύ και είναι λογικοί—ίσως τα μέσα που περιλαμβάνουν είναι αναπόσπαστο μέρος του περιεχομένου. Τα ακόλουθα δύο πεδία χρησιμοποιούνται για το σκοπό αυτό.

Με το πρώτο πεδίο μπορείτε να ενεργοποιήσετε το lazy loading μόνο για συγκεκριμένες σελίδες και με το δεύτερο πεδίο μπορείτε να απενεργοποιήσετε το lazy loading μόνο για μια επιλογή περιεχομένου. Και στις δύο περιπτώσεις, επιτρέπονται και οι μπαλαντέρ. χρησιμοποιήστε το σύμβολο αστερίσκου για να εφαρμόσετε το lazy loading σε σύνολα ομοιόμορφων αναρτήσεων ή σελίδων Joomla! Αποθηκεύστε τις αλλαγές για να ενεργοποιήσετε το lazy loading: το lazy loading ενεργοποιείται αυτόματα στο Joomla! blog σας.

Πώς λειτουργεί το Progressive Lazy Loading στο Joomla!

Το Lazy loading εξυπηρετεί περιεχόμενο μόλις απαιτείται. Συνήθως, οι σελίδες αποτελούνται από συνδυασμό κειμένου και εικόνων. Η λήψη πολυμέσων διαρκεί περισσότερο από τη λήψη κειμένου, ειδικά σε κινητά χαμηλού επιπέδου ή αργή πρόσβαση στο διαδίκτυο. Ενώ το ιστολόγιό σας στο Joomla! δεν μπορεί μαγικά να επιταχύνει τα κινητά ή την πρόσβαση στο διαδίκτυο, μπορεί να κάνει το επόμενο καλύτερο πράγμα: να βελτιώσει την εμπειρία του χρήστη.

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

Στην πραγματικότητα, μπορεί να χρειαστεί ακόμη κάποιος χρόνος για να φορτώσει μια εικόνα. Ως εκ τούτου, η προοδευτική καθυστερημένη φόρτωση εικόνας δημιουργεί αυτόματα μια μικρή έκδοση εικόνων — πλάτος 20px, με 4 χρώματα και μέγεθος μερικών μόνο KB — τις μεγεθύνει στο αρχικό μέγεθος και στη συνέχεια τις θολώνει. Το αποτέλεσμα είναι μια θολή έκδοση της εικόνας πλήρους μεγέθους που υποδεικνύει ότι η εικόνα εξακολουθεί να γίνεται λήψη. Όταν η lazy loading ολοκληρώσει τη λήψη της εικόνας, το Joomla! αντικαθιστά τη θολή εικόνα με την πλήρη εικόνα.

Η προοδευτική lazy loading ενεργοποιείται αυτόματα με το lazy loading, που σημαίνει ότι δεν χρειάζεται να κάνετε πρόσθετες αλλαγές. Το καλύτερο από όλα, χρησιμοποιώντας μόνο μικρές εκδόσεις της εικόνας, η προοδευτική lazy loading προσθέτει πολύ μικρό επιπλέον κόστος στον αποθηκευτικό χώρο της Joomla!.

Lazy Loading στις Joomla! Γκαλερί

Το Lazy loading δεν κάνει διακρίσεις. Το Speed Cache’s lazy loading λειτουργεί για οποιαδήποτε εικόνα, συμπεριλαμβανομένων των γκαλερί, όπως οι γκαλερί Droppics . Ομοίως με τις κανονικές εικόνες, το Speed Cache μεγεθύνει μια μικρή έκδοση των εικόνων στη γκαλερί και τις θολώνει. Όταν οι χρήστες μετακινούνται προς τα κάτω, το lazy loading κατεβάζει τις εικόνες πλήρους μεγέθους.

Το καλύτερο από όλα, το Speed Cache's lazy loading δεν εμποδίζει τη ροή εργασίας σας. Αντίθετα, εισάγει το lazy loading στη διαδικασία σας: απλώς εισάγετε μια εικόνα ή μια γκαλερί οπουδήποτε στο Joomla! blog σας και το Speed Cache φορτώνει αυτόματα τις εικόνες με καθυστέρηση χρησιμοποιώντας AJAX μία προς μία μετά το κύριο περιεχόμενο —κυρίως το κείμενο και οι μικρές εικόνες εξαιρούνται από τις προτιμήσεις σας— έχει φορτωθεί.

Έξυπνο Lazy Loading βασισμένο στο ύψος οθόνης

Lazy loading αφορά την κύλιση και το ύψος της οθόνης. Το Speed Cache’s lazy loading είναι πολύ έξυπνο με τρόπο που εφαρμόζεται μόνο στο τρέχον ύψος οθόνης (με βάση το viewport) και προφορτώνει το επόμενο. Έτσι, αν έχετε μια γρήγορη σύνδεση ή αν κάνετε κύλιση αργά, δεν θα παρατηρήσετε καν ότι το lazy loading είναι ενεργοποιημένο στην ιστοσελίδα σας στο Joomla.

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

Joomla SEO και Φόρτωση

Η καθυστερημένη φόρτωση που χρησιμοποιείται στην εφαρμογή Speed Cache δεν επηρεάζει το SEO. Στην πραγματικότητα, οι μηχανές αναζήτησης που ανιχνεύουν το περιεχόμενό σας, όπως το Google bot, θα δουν μόνο πλεονεκτήματα:

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

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

Φυσικά, μπορούμε επίσης να έχουμε κατά νου ότι το Speed Cache προσφέρει επίσης πολλά άλλα φοβερά εργαλεία όπως μια πολύ ωραία μονάδα cache που θα μας επιτρέψει να επιταχύνουμε τις ιστοσελίδες μας και να τις πάμε στο επόμενο επίπεδο!

Ελέγξτε το Speed Cache για Joomla:  https://www.joomunited.com/products/speed-cache