logo

Image Optimization στο WordPress

Image Optimization στο WordPress

Ετικέτες:

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

Προσοχή στα μεγέθη

Το πρώτο πράγμα είναι να κοιτάμε να μην ανεβαίνουν εικόνες με μεγάλα μεγέθη εξ αρχής. Δεν υπάρχει κανέναν λόγος να ανεβαίνει εικόνα πάνω από 900ΚΒ ότι διαστάσεις και να έχει. Εξάλλου οι μεγάλες διαστάσεις (τύπου 5000 px που βγάζουν οι DCLR κάμερες) δεν έχουν κανέναν νόημα στην ιστοσελίδα μας. Οπότε πρέπει οι διαχειριστές/χρήστες των ιστοσελίδων μας να εκπαιδευτούν σε αυτό. Πέρα από το να μικρύνουν τις διαστάσεις στο photoshop υπάρχει ένα πολύ ωραίο εργαλειάκι, το TinyPNG που μειώνει το μέγεθος της εικόνας χωρίς να χαλάει την ανάλυση. Υπάρχει και σε plugin για WP αλλά όχι δωρεάν.

After Upload Optimization

Υπάρχουν πολλά Plugins που κάνουμε Image Optimization στο WP όπως το Smush , εμείς προς το παρόν εχουμε καταλήξει στο EWWW Image Optimizer. Σου δίνει την δυνατότητα για bulk optimization μέσα από το wp-admin αλλά μπορεί να το κάνει και μέσα από το wp-cli με τις δικές του συγκεκριμένες εντολές.. Το wp-cli είναι έντόλες για command line με ssh access κατευθείαν στον σέρβερ. Είναι γενικά πολύ χρήσιμο και σας προτείνουμε να το βάλετε στον server σας και να το χρησιμοποιείται καθώς τα κάνει όλα πολύ πιο γρήγορα. Συγκεκριμένα για να κάνουμε πχ optimize τις εικόνες μας στο media μπορούμε να χρησιμοποιοήσουμε την ακόλουθη εντολή με το force για να κάνουμε optimize και εικόνες που βρίσκονταν πριν στο Gallery

wp ewwwio optimize media 1 --force

Μα τόσα πολλά thumbnails;;

Ένα άλλο ζήτημα που απαιτεί την προσοχή μας είναι τα thumbnails. Τα thumbnails είναι παράγωγα των εικόνων που ανεβάσουμε σε διαφορετικά μεγέθη ώστε να ταιριάζουν σε διάφορα σημεία που εμφανίζονται στην ιστοσελίδα μας. Το WordPress από μόνο του παράγει 3 thumbnails για κάθε εικόνα που ανεβάζουμε ενώ plugins και κυρίως templates παράγουν κι αυτά με τη σειρά τους thumbnails. Αυτό έχει σαν αποτέλεσμα να γεμίζουμε template που δεν χρησιμοποιούμε. Η καλή πρακτική είναι να βλέπουμε πια thumbnails χρησιμοποιούνται όντως στον front end και όσα δεν χρησιμοποιούνται μπορούμε να τα απενεργοποιήσουμε από το EWWW Image Optimizer. Στη συνέχεια θα πρέπει να κάνουμε regenerate τα thumbnails ώστε επί της ουσίας να σβηστούν και να επαναδημιουργηθούν μόνο όσα χρησιμοποιούμε. Ο πιο εύκολος τρόπος να το κάνουμε αυτό είναι πάλι από το wp-cli

wp media regenerate

 

0 found this helpful