• SANTORINI

    SANTORINI

  • SANTORINI

    SANTORINI

  • ZAKYNTHOS

    ZAKYNTHOS

  • LEYKADA

    LEYKADA

  • KEFALLONIA

    KEFALLONIA

  • KERKYRA

    KERKYRA

  • RODOS

    RODOS

GADGETS FOR BLOGS

YouTube GITHUB glitch.com JSBIN Start.me JSFIDDLE CODEPLY PASTEBIN.COM Repl.it CODEPEN CODEPEN

ΠΩΣ ΝΑ ΦΟΡΤΩΝΕΙ ΓΡΗΓΟΡΑ ΤΟ BLOG ΜΟΥ

xronos-fortosis
ΠΩΣ ΝΑ ΦΟΡΤΩΝΕΙ ΓΡΗΓΟΡΑ ΤΟ BLOG ΜΟΥ
Μετρήστε την ταχύτητα του blog σας με το εργαλείο pingdom tools.
Εντοπίστε τι καθυστερεί το blog σας με το εργαλείο pingdom tools. Είναι το πιο αξιόπιστο εργαλείο μέτρησης ταχύτητας ιστοτόπων. Υπάρχουν βέβαια και άλλα πολλά τα οποία θα βρείτε στην ανάρτηση που έχω κάνει με τίτλο ► ΜΕΤΡΗΣΤΕ ΤΗΝ ΤΑΧΥΤΗΤΑ ΦΟΡΤΩΣΗΣ ΤΟΥ BLOG ΣΑΣ

Μην βάζετε μεγάλες εικόνες στις αναρτήσεις σας πρίν το read more.
Οι εικόνες που βρίσκονται στις αναρτήσεις σας πρίν το read more πρέπει να είναι διαστάσεων 450Χ300 ή 400Χ300 και μεγέθους από 5ΚΒ εώς 20ΚΒ. Μετά το read more της ανάρτησης μπορείτε να βάλετε μεγαλύτερες εικόνες ή και βίντεο.

Περιορίστε τις πολλές και μεγάλες εικόνες στις πλαινές μπάρες.
Οι πολλές και μεγάλες εικόνες μπορούν να επιβραδύνουν πάρα πολύ το blog σας. Αποφασίστε εάν όλες οι εικόνες αυτές σας χρειάζονται πραγματικά και αφαιρέστε ένα μέρος από αυτές ή μειώστε το μέγεθός τους με το πρόγραμμα ifran view το οποίο είναι πολύ απλό και μπορεί να συμπιέσει χωρίς σοβαρές απώλειες ποιότητας τις εικόνες σας. Δείτε το βίντεο πώς κόβω μία εικόνα στα μέτρα μου που είναι μέσα σε αυτήν την ανάρτηση ► ΠΩΣ ΚΟΒΩ ΜΙΑ ΕΙΚΟΝΑ ΣΤΑ ΜΕΤΡΑ ΜΟΥ

Αποφύγετε τις δημοφιλείς αναρτήσεις του Blogger.
Οι δημοφιλείς αναρτήσεις του Blogger χρησιμοποιούν τις ήδη υπάρχουσες εικόνες των αναρτήσεων που έχετε κάνει αλλάζοντάς τες σε μία άλλη δισανάλογη τετράγωνη διάσταση εικονιδίων και χωρίς φυσικά να μειώσουν το μέγεθός τους σε ΚΒ. Τα εικονίδια αυτά πρέπει να έχουν μέγεθος από 1ΚΒ εώς 5ΚΒ το πολύ και οι διαστάσεις τους να είναι ανάλογες των εικόνων που έχετε βάλει στην αρχή της ανάρτησής σας. Για να το πετύχετε αυτό βάλτε δικές σας δημοφιλείς αναρτήσεις με νέα εικονίδια μειωμένα σε μέγεθος και σε διαστάσεις αναλογικές με τις πρωτότυπες εικόνες των αναρτήσεών σας. Για να το κάνετε αυτό διαβάστε το άρθρο ► ΠΩΣ ΒΑΖΩ ΚΕΙΜΕΝΟ ΜΕ CLICKABLE ΕΙΚΟΝΑ ΣΤΗΝ ΠΛΑΪΝΗ ΜΠΑΡΑ

Βάλτε height και width σε κάθε σας εικόνα.
Όταν βάζετε εικόνες με κώδικα πρέπει να βάλετε μέσα στον κώδικά τους και τα απαραίτητα tags height, width και alt. Ο κώδικας μίας εικόνας που μπαίνει με κώδικα θα πρέπει να είναι όπως ο παρακάτω.
<img src ="image-link.jpg" border = "0" alt = "Η περιγραφή μου"  width = "120" height = "80"/>
Αν προσθέσετε πλάτος, ύψος και ετικέτες στις εικόνες σας θα έχετε τεράστια διαφορά όταν φορτώνει ένας περιηγητής την σελίδα σας, διότι εάν το πρόγραμμα περιήγησης γνωρίζει το πλάτος και το ύψος, μπορεί να προχωρήσει στις υπόλοιπες αιτήσεις φόρτωσης και την εικόνα αυτή την αφήνει να φορτώσει στο παρασκήνιο ενώ φορτώνει τα υπόλοιπα gadgets της σελίδας.
Εάν μια εικόνα δεν έχει αυτα τα tags, το πρόγραμμα περιήγησης θα πρέπει να περιμένει μέχρι να φορτώσει η εικόνα, για να μπορέσει να συνεχίσει τη φόρτωση της υπόλοιπης σελίδας.

Αποφεύγετε την χρήση Flash περιεχομένου.
Το Flash περιεχόμενο αυξάνει σημαντικά το χρόνο φόρτωσης του blog σας. Αποφεύγοντας το Flash μπορείτε να συμβάλλετε στην ταχύτερη φόρτωση του ιστολογίου σας. Το Flash είναι επίσης γνωστό ότι είναι κακό για το SEO γενικά.

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

Αντιγράψτε σωστά χωρίς περιττούς κώδικες.
Όταν κάνετε αντιγραφή και επικόλληση κάποιου άρθρου από κάποιο άλλο blog ή site στο δικό σας, τότε να ξέρετε ότι δεν αντιγράφετε μόνο το άρθρο αυτό. Μαζί με το άρθρο αυτό αντιγράφετε και το στυλ της σελίδας αυτής, γεμίζοντας το blog σας με άχρηστους κωδικούς.
Για αυτό το λόγο αντιγράψτε όλο το περιεχόμενο του άρθρου και επικολλήστε μόνο το κείμενο σε ένα άδειο έγγραφο word και εκεί μέσα κάντε τη αλλάγή της γραμματοσειράς, του μεγέθους της, των χρωμάτων της και γενικώς την δική σας μορφοποίηση κειμένου και μετά αντιγράψτε το αποτέλεσμα αυτό στον editor του blogger και δημοσιεύτε την ανάρτηση. Τότε θα είστε σίγουροι ότι δεν έχετε πάρει περιττό κώδικα από την σελίδα που αντιγράψατε το άρθρο.
Η εξάλειψη του περιττού κώδικα δεν θα επιταχύνει μόνο τον χρόνο φόρτωσης της σελίδας σας, αλλά θα βοηθήσει σημαντικά στην επικύρωση του HTML σας, το οποίο φροντίσατε να μην είναι όμοιο με αυτό της σελίδας που αντιγράψατε.

Μειώστε τον αριθμό των αναρτήσεων που εμφανίζονται στην αρχική σας σελίδα.
Οι αναρτήσεις που εμφανίζονται στην αρχική σας σελίδα φορτώνουν μαζί με το blog σας και αν είναι πολλές και με μεγάλες εικόνες θα καθυστερήσουν την φορτώση του blog σας.
Αν μειωσετε τον αριθμό των αναρτήσεων στην αρχική σας σελίδα, τότε ο χρόνος φόρτωσης θα βελτιωθεί σημαντικά. Εμφανίστε 5 με 10 αναρτήσεις στην αρχική σελίδα, με περίπου 500 λέξεις κείμενο πρίν το read more για κάθε ανάρτηση. Μπορείτε να εμφανίσετε και περισσότερες αν έχετε φροντίσει να μειώσετε το μέγεθος των εικόνων τους.

Αφαιρέστε τα περίττα κενά  "Whitespaces".
Τα whitespaces είναι τα διαστήματα μεταξύ των κωδικών. Η εξάλειψη των περιττών κενών και κενών γραμμών από τον κώδικά σας μπορεί να βοηθήσει την ταχύτητα φόρτωσης του blog σας. Καθαρίζοντας τον κωδικό σας από αυτά, μειώνετε κατά πολύ τις γραμμές κώδικα HTML του blog σας από 3000 στις 2300 περίπου και κατ’ επέκτασιν και τα επιπλέον bytes από το συνολικό μέγεθος της σελίδας σας και έτσι επιταχύνετε αρκετά το χρόνο φόρτωσης του blog σας.

Συμπιέστε τα Javascript και CSS αρχεία.
Μπορείτε να συμπιέσετε τους Javascript και Stylesheet κώδικες που χρησιμοποιούνται στο blog σας. Για να συμπιέσετε Javascript μπορείτε να χρησιμοποιήσετε το jszip. Για τα αρχεία CSS, χρησιμοποιήστε το CSS Compressor, ή το CSS Optimizer.
Μετά την χρήση αυτών των προγραμμάτων, θα αφαιρεθούν οι περιττοί κωδικοί, οι κενές ετικέτες τα περιττά κενά και οι κενές γραμμές και έτσι θα καθαρίσει ο κωδικας και η σελίδα σας θα φορτώνει πολύ πιο γρήγορα.

Μειώστε τον αριθμό των διακομιστών (http requests).
Για να μειωθεί ο αριθμός των διακομιστών που απαιτεί να συνδεθεί ένα ιστολόγιο πρέπει να μειώσουμε τις εξωτερικές συνδέσεις για εικόνες, stylesheets, και javascript.
α. Αποθηκεύτε όλες τις εικόνες μέσα στο blogger.
Μην αποθηκεύετε τις εικόνες σε υπηρεσίες όπως Image shack, TinyPic ή Photobucket. Όταν φορτώνει το blog σας, το πρόγραμμα περιήγησης πρέπει να συνδεθεί με τους διακομιστές που είναι αποθηκευμένες οι εικόνες σας και αυτό έχει ως αποτέλεσμα την καθυστερηση της φόρτωσης του blog σας. Καλό θα ήταν να αποθηκεύσετε τις εικόνες σας μέσα στον blogger. Έτσι το πρόγραμμα περιήγησης θα πρέπει να συνδεθεί μόνο με τον διακομιστή του blogger κατά τη φόρτωση εικόνων σας και έτσι θα κερδίσετε περισσότερο χρόνο.
β. Αποθηκεύτε όλα τα css και JavaScript αρχεία πέσα στο πρότυπο του Blogger.
Καλό είναι να μην συνδέεστε με εξωτερικούς χώρους για την αποθήκευση των css και JavaScript αρχείων σας, γιατί αυτό καθυστερεί το blog σας. Μπορείτε να τα αποθηκεύσετε μέσα στο πρότυπο του Blogger. Οι css κώδικες μπαίνουν πρίν από την ετικέτα ]]></b:skin>  ενώ οι JavaScript κωδικες μπαίνουν ακριβώς πρίν από την ετικέτα </head>.
γ. Αποφύγετε τα χρονοβόρα widgets ή μετακινήστε τα στο τέλος του blog.
Το Facebook like box, το google followers, οι αναγνώστες του ιστολογίου, ο καιρός, το chat και άλλα τέτοια widgets επηρεάζουν την ταχύτητα φόρτωσης.
Επειδή το κάθε widget θα πρέπει να συνδεθεί με διάφορα servers για να λειτουργήσει έτσι, αν σε περίπτωση κάποιο από αυτά έχει προβλήματα downtime θα επηρεάσει άμεσα και την ιστοσελίδα σας. Για αυτό καλά θα κάνετε να εντοπίσετε ποιά widgets καθυστερούν την σελίδα σας με το εργαλείο pingdom toolls και να τα αφαιρέστε ή αν θέλετε να τα κρατήσετε οποιοδήποτε, να τα μετακινήσετε στο κάτω μέρος της σελίδας. Έτσι θα φορτώσει πρώτα χωρίς πρόβλημα το κύριο μέρος του ιστολογίου σας για να πλοηγούνται ήδη σε αυτό οι αναγνώστες σας και μετά θα φορτώσουν και τα χρονοβόρα widgets.

Ένας καλός χρόνος φόρτωσης του blog σας είναι κάτω από 3 δευτερόλεπτα. Αλλά αν δεν θέλετε να θυσιάσετε την εμφάνιση προσπαθήστε να είστε τουλάχιστον κάτω από 5 δευτερόλεπτα. Ένα καλό score στο pingdom tools είναι πάνω από 85%.

Δεν υπάρχουν σχόλια:

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

► Γράψτε το σχόλιό σας στο λευκό κουτί και αν θέλετε να ειδοποιηθήτε για την απάντηση τσεκάρετε το κουτάκι "Να λαμβάνω ειδοποιήσεις".

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