25 Φεβρουαρίου 2011



17 Τι είναι το Lazy Load Plugin?

____________________________

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

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

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

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

Για πολλούς όμως bloggers, οι αναρτήσεις τους έχουν όπως και να 'χει να κάνουν με τις εικόνες/φωτογραφίες που βάζουν, και δεν είναι καθόλου πρόθυμοι να τις θυσιάσουν για χάρη της ταχύτερης φόρτωσης του Blog τους. Στην σημερινή λοιπόν ανάρτηση, θα σας παρουσιάσω την καλύτερη ενδιάμεση λύση, που μας προτείνει ο Paul Crowe, το: jQuery Lazy Load Plugin.

Τι είναι το Lazy Load Plugin;

Το Lazy Load Plugin (όπως και κάποια παρεμφερή Plugins) χρησιμοποιείται απο τα πιο διάσημα blogs και websites ως τώρα. Το όλο σκεπτικό είναι απλούστατο.
Όταν κάποιος μπεί στο blog μας, οι εικόνες που ΔΕΝ βλέπει, δεν φορτώνουν, μέχρι να κάνει Scroll πρός τα κάτω πηγαίνοντας σ' αυτές, οπότε και εμφανίζονται. Φορτώνουν δηλαδή αυτόματα οι εικόνες που βρίσκονται ψηλλά, στο ορατό μέρος του blog, ενώ οι άλλες πιο κάτω, και που δεν φαίνονται, μόλις φορτώσει η σελλίδα, δεν έχουν φορτώσει, περιμένοντας να έρθει η κατάλληλη στιγμή να εμφανιστούν.
Με τον τρόπο αυτό, κερδίζουμε αφάνταστα σε ταχύτητα φόρτωσης της σελλίδας μας.
Μπορούμε δε να το τοποθετήσουμε σε δύο απλά βήματα. Δείτε πώς:

Εγκατάσταση του Lazy Load Plugin

Βήμα 1ο. Κάντε click στην "Σχεδίαση" στο 'Επεξεργασία HTML'
Βήμα 2ο. Βρείτε (στην αρχή, επάνω ψηλά) το </head>
Βήμα 3ο. Πρίν απο το </head> (απο πάνω του ακριβώς) αντιγράψτε και επικολήστε τον κώδικα που ακολουθεί:

<script charset='utf-8' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

<script src='http://pwam.googlecode.com/files/jquery.lazyload.js' type='text/javascript'/>

<script charset='utf-8' type='text/javascript'>

$(function() {

$(&quot;img&quot;).lazyload({placeholder : &quot;http://pwam.googlecode.com/files/grey.gif&quot;,threshold : 200});

});

</script>

Βήμα 4ο. Πατήστε "Αποθήκευση" και ανοίξτε το Blog σας. Είναι και τώρα τόσο αργό όπως πρίν; Είστε σίγουροι; :)

Καλή επιτυχία!  good luck


>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>




Print this post



Related Posts :



17 σχόλια:

TwistedTool είπε... Best Blogger Tips

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

Θα το ξαναδοκιμάσω κι αν δε δουλεύει θα έρθω να σε μπινελικώσω, Νικολάκη :) Φιλιά!


TwistedTool είπε... Best Blogger Tips

Μόλις το έβαλα. Νομίζω ότι δε δουλεύει σε μένα..


ΒΑΣΙΛΗΣ (Γ/Γ- ΟΛΠ) είπε... Best Blogger Tips

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


dimitris είπε... Best Blogger Tips

Παντα τετοια.
Να χαιρεσαι τη κορακλα...


Gaurakos είπε... Best Blogger Tips

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

Να σαι καλά Νίκο αυεχαριστούμε.


ΣΟΥΙΤΑ είπε... Best Blogger Tips

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


RIRI είπε... Best Blogger Tips

ΑΠΛΆ..ΤΕΛΕΙΟ!!!τΟ ΕΒΑΛΑ ΚΑΙ ΣΤΑ 2 BLOG , ΜΕΓΑΛΗ ΔΙΑΦΟΡΑ!!!!νασαι καλά Νίκο, ΔΑΣΚΑΛΕ!!!!!!!


DaisyCrazy είπε... Best Blogger Tips

Νίκο μου καλή ιδέα ακούγεται. Θα δοκιμάσω να δω τι γίνεται στην πράξη.
Οι δικές σου φώτος είναι όλες ένας βάτραχος όμως...
Φιλάκια


ΧΡΗΣΤΟΣ/Christos είπε... Best Blogger Tips

Γεια σου Νικο. Εγω δεν το δοκιμασα ακομα, οπως παντα επιφυλακτικος. Πες μας, αν το εγκατστησουμε και μετα θελουμε να το αφαιρεσουμε, τι κανουμε? Που να θυμαμαι υστερα απο καποιον καιρο....Ετσι κι αλλιως, εισαι φοβερος σε ολα σου. Σ' ευχαριστουμε για ολα!!!!


apneagr είπε... Best Blogger Tips

Σε μένα πάντως δεν δουλεύει... :(


TwistedTool είπε... Best Blogger Tips

Χρήστο, απλά πας στο σημείο που πρόσθεσες τον κώδικα (ακριβώς πάνω από το < /head >, δηλαδή) και διαγράφεις το συγκεκριμένο κώδικα!

Ελπίζω να βοήθησα :)


pan de lees είπε... Best Blogger Tips

Νικολα , ειδα πολλα σχολια, και αναρωτηθηκα !!!και ειπα "μπαινω να δω"....μολις ειδα js , καταλαβα, οτι καποιοι εχουν προβλημα !!! δυστυχως, σαν πιο νεος στο blogging και συ σαν ενας παλιος blogger καταλαβες οτι λιγοι θα μπορεσουν να το απολαυσουν, αυτο που αναρτησες...οσο πιο "παρθενο" το blog , τοσο πιο αποτελεσματικα τα js. Παντως η νοοτροπια ειναι σωστη, και χωρις αυτο το gadget...μικρες εικονες, και χαμηλα, για να ανοιγει γρηγορα το blog μας...


AATON είπε... Best Blogger Tips

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

*** Βασίλη, χαίρομαι φίλε μου που έμεινες ικανοποιημένος απο το Script, και σε ευχαριστώ για το σχόλιο, καλώς ήρθες :)

*** Ευχαριστώ Δημήτρη :)

*** Γαυράκο μου, πολύ σωστή η σκέψη, όπως είπα και στον φίλο μας ΤΤ πιο πάνω.

*** Σουίτα, κι εγώ σε ευχαριστώ.

*** Ριρή μου χαίρομαι που σου φάνηκε χρήσιμο, φιλιά :)

*** Ντοράκι μου, σε μένα δείχνουν οι εικόνες κανονικά, άδειασα και το Cache για να σιγουρευτώ. Μήπως πρέπει να το αδειάσεις κι εσυ; απλά απορώ γιατί εγώ να μην βλέπω τα βατραχάκια.. κουάξ??

*** Χρήστο, δεν είναι καθόλου δύσκολο το να το ξαναβγάλεις. Κάνε το εξής: Άφησε ένα κενό ανάμεσα στο head και τον προηγούμενο κώδικα που θα το τοποθετήσεις ανάμεσά τους, ώστε μετά να ξεχωρίζει και να το βγάλεις εύκολα.

*** ΤΤ ευχαριστώ για την προθυμία σου να βοηθάς τους φίλους μας :)

*** Παντελή μου, πάντα ένα "παρθένο" blog δεν αργεί να φορτώσει. Δεν είναι μόνο οι εικόνες που καθυστερούν το φόρτωμά του, είναι και τα videos, τα Flash Banners, τα πολλά JavaSripts και τα λάθη στην δομή του κώδικα κάθε Blog.
Σίγουρα όμως βοηθάει κατά πολύ, τουλάχιστον σε ότι αφορά τις εικόνες :)


AATON είπε... Best Blogger Tips

*** Φίλε μου apneagr, κι αν σου έλεγα πως το Blog σου μου άνοιξε γρηγορώτερα απο άλλες φορές τι θα έλεγες;


EGERSIS είπε... Best Blogger Tips

Το έβαλα και περιμένω αντιδράσεις...
Εμένα πάντως μου φαίνεται ότι δουλεύει.


DaisyCrazy είπε... Best Blogger Tips

Τώρα βλέπω τις εικόνες κανονικά και ούτε άδειασα το cashe ουτε τίποτα. Δεν ξέρω γιατί εβλεπα βατράχια :))))))))))))))))
Καλό απόγευμα!


Asterios Saltzidis είπε... Best Blogger Tips

ΜΑ ΓΑΜΑΤΟ!!!!


Δημοσίευση σχολίου

Πες πως δεν έχεις χρόνο να σχολιάσεις.. να 'χεις πάρει όμως σοβαρό ύφος, καλά;

Σημείωση: Μόνο ένα μέλος αυτού του ιστολογίου μπορεί να αναρτήσει σχόλιο.

Next Next Next