Web Systems :: Το Blog μας :: Καινούργια Σχεδίαση ! Καινούργιες υπηρεσίες !

close
Πώς να φορτώνει γρηγορότερα η ιστοσελίδα σας

Πώς να φορτώνει γρηγορότερα η ιστοσελίδα σας


Ένα από τα πιο σημαντικά χαρακτηριστικά μας επιτυχημένης ιστοσελίδας είναι η ταχύτητα ολοκληρωμένης φόρτωσης των στοιχείων της.

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

Έτσι, θα ήταν σοφό εκ μέρους ενός web developer να εστιάσει την προσοχή του στο να φορτώνεται το περιεχόμενο της ιστοσελίδας όσο πιο γρήγορα γίνεται. Η βελτιστοποίηση του site στην ταχύτητα μπορεί να γίνει με διάφορους τρόπους:

Εικόνες

Φορμάτ εικόνων

Τα JPEG χρησιμοποιούνται για φωτογραφίες, τα GIF για χαμηλής ποιότητας εικόνων ή κουμπιά, και τα PNG για οτιδήποτε άλλο. Συνηθίζεται πολλοί web developers να χρησιμοποιούν επί τον πλείστον PNG, σε γενικές γραμμές όμως για φωτογραφίες πρέπει να αποφεύγεται.

Κώδικας εικόνων

Ένας κακός τρόπος προγραμματισμού είναι οι ενσωμάτωση μεγεθών width=’50px’ height=’30px’στον κώδικα κατά την ενσωμάτωση μιας εικόνας. Είναι κάτι που δεν χρειάζεται και πρέπει να αναλαμβάνει ο developer να ορίζει τα σωστά μεγέθη μιας εικόνας οπότε δεν χρειάζεται να το αναφέρει στον κώδικα.

Image optimization tools

Υπάρχουν κάποια σημαντικά εργαλεία που μας βοηθάνε στο να μικρύνουμε το μέγεθος σε kb μιας εικόνας χωρίς να χάνεται τόσο η ποιότητά της. Πολύ χρήσιμο εργαλείο είναι το ImageOptim για Mac, και το Riot για Windows.

Βελτιστοποίηση CSS και JavaScript

Συμπίεση αρχείων

Το CSS και το Javascript είναι δύο πολύ σημαντικές γλώσσες στην δημιουργία μιας ιστοσελίδας. Οτιδήποτε μπορεί να γίνει με CSS… είναι προτιμότερο να γίνεται με CSS. Επίσης είναι πολύ καλό να συμπιέζουμε το τελικό προϊόν ενός αρχείου CSS και javascript γιατί έτσι μειώνουμε αρκετά το μέγεθος των αρχείων μας. Γνωστά εργαλεία συμπίεσης είναι το Code Minifier για Mac, το Minify για Windows και το JSCompress/CSSCompressor τα οποίο παρέχονται μέσα από ιστοσελίδα.

Κεντρική Ενσωμάτωση

Στο προγραμματισμό θεωρείται κακή υλοποίηση να ενσωματώνεται κώδικας CSS ή Javascipt μέσα στο <body> μια ιστοσελίδας, δηλαδή στο κεντρικό HTML της ιστοσελίδας. Δημιουργεί πρόσθετο βάρος κατά την φόρτωση και ορισμένες φορές στην περίπτωση κακής ενσωμάτωσης Javascript την μη σωστή λειτουργία της ιστοσελίδας.

Όλα στο τέλος

Ένας πολύ απλός τρόπος βελτίωσης μια ιστοσελίδας είναι η πρόσθεση όλων των <script> δηλαδή των εντολών Javascript στο τέλος της ιστοσελίδας πριν του </body>. Αυτό λειτουργικά είναι σαφώς καλύτερο διότι πρώτα φορτώνονται τα σημαντικά κομμάτια της σελίδας μας, και μετά οι πρόσθετες javascript εντολές. Εάν μια εντολή δεν λειτουργεί σωστά, δεν θα αποβεί τόσα μοιραία όσο αυτή που έχουμε βάλει στην αρχή με αποτέλεσμα να μην φορτώνεται καθόλου η σελίδα μέχρι να διορθωθεί το πρόβλημα της εντολής javascript.

Γενικές Βελτιστοποιήσεις

Οι διασυνδέσεις σε μια ιστοσελίδα πρέπει πάντα να τελειώνουν με slash (κάθετο).
Ενσωματώστε το Favicon.ico της ιστοσελίδας στο κώδικα.
Εκμεταλλευτείτε το Cache των περιηγητών.

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


Leave a Reply