Image optimization σε WebP για ταχύτερο site.

Θέλεις το site σου να φορτώνει γρηγορότερα και παράλληλα να βελτιώσεις το score σου στα Core Web Vitals της Google; Τότε ήρθε η ώρα να μετατρέψεις όλα τα images σου (png, jpg, jpeg κτλ) στο format WebP και να βοηθήσεις στην άνοδο της κατάταξης του site σου στις μηχανές αναζήτησης.

Tα WebP images προσφέρουν καλύτερη συμπίεση των εικόνων, χωρίς απώλειες σε ποιότητα, και έτσι το site σου θα μπορέσει να φορτώνει ταχύτερα σε όλους τους browsers. Επίσης, η μετατροπή των images του site σου σε WebP είναι ένας από τους παράγοντες που εξετάζει η Google για να αποφασίσει σχετικά με την κατάταξή σου στα αποτελέσματα αναζήτησης.

Βήμα 1

Κατέβασε όλα τα images που χρησιμοποιείς στο site σου σε ένα φάκελο είτε από το πίνακα ελέγχου του web hosting πακέτου σου είτε ζητώντας από τον developer σου να σου στείλει σε zip τα σχετικά αρχεία. Πριν ξεκινήσεις τη βελτιστοποίηση έλεγξε πια images πραγματικά χρειάζονται στο site σου και διέγραψε όσα δε χρησιμοποιείς ή επιβαρύνουν το server σου με περιττά requests.

Εναλλακτικά μπορείς να δεις τα images που χρειάζονται βελτιστοποίηση σε κάθε σελίδα του site σου χρησιμοποιώντας το εργαλείο Page Speed Insights. Απλά γράψε το URL κάθε σελίδας και στα αποτελέσματα του Desktop Audit αναζήτησε το Serve Images in next-gen formats. Κατέβασε όλα τα images που βλέπεις στο πεδίο για να ξεκινήσεις τη βελτιστοποίηση.

Page speed insights results για WebP images.

Βήμα 2

Άνοιξε το εργαλείο AnyWebP  στο browser σου, επέλεξε ή σύρε με drag & drop όλα τα images σου  και ρύθμισε το Quality στο 1.

Στη συνέχεια πάτησε το button Convert All Images για να κατεβάσεις αυτόματα το zip με όλα τα WebP βελτιστοποιημένα αρχεία των εικόνων σου.
Αν έχεις μεγάλο αριθμό images στο site σου επέλεξε να μετατρέψεις πακέτα των 30 images ταυτόχρονα για να μην έχεις μεγάλους χρόνους αναμονής.

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

Μετατροπή image format σε webp για ταχύτερη φόρτωση website.

Βήμα 3

Άνοιξε το εργαλείο Tiny PNG  στο browser σου, επέλεξε ή σύρε με drag & drop τα WebP images σου.

Στη συνέχεια πάτησε το button Download All για να κατεβάσεις αυτόματα το zip με όλα τα WebP βελτιστοποιημένα αρχεία των εικόνων σου.
Επειδή το εργαλείο είναι δωρεάν σου προτείνουμε να ανεβάζεις τα images σε δεκάδες ώστε να μη φτάσεις το όριο των free πόρων του και χρειαστεί να περιμένεις ώστε να συμπιέσει τα WebP αρχεία σου.

Βελτιστοποίηση WebP images με το εργαλείο Tiny PNG.

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

Ασφαλώς υπάρχουν και άλλοι τρόποι, όπως plugins στο WordPress (LSCache Plugin), για να αυτοματοποιήσεις τα παραπάνω βήματα. Όμως σε κάθε περίπτωση θα έχεις τα ίδια αποτελέσματα, ταχύτερο website και βελτίωση του score σου στα Core Web Vitals.

Αν σου άρεσε αυτό το άρθρο και θέλεις να βελτιώσεις τα Core Web Vitals του Website σου πες μας ποιο θα ήταν το επόμενο θέμα που θα σε ενδιέφερε;
Δοκίμασε σήμερα να μετατρέψεις τα images σου σε WebP και στείλε μας comment με τις απορίες σου και τα αποτελέσματα που είδες στο δικό σου site.

Author

Είμαι Digital Marketing Project Manager στην DNHOST και απολαμβάνω να μοιράζομαι μαζί σου τις τελευταίες εξελίξεις στο χώρο του digital καθώς και άρθρα που θα βοηθήσουν το site και το e-shop σου.

Write A Comment