Σύγκριση φορμά

AVIF ή WebP: ποιο φορμά εικόνας νέας γενιάς να χρησιμοποιήσετε;

Τόσο το AVIF όσο και το WebP νικούν το JPEG και το PNG με σημαντικό περιθώριο, αλλά διαφέρουν στην αντιστάθμιση συμπίεσης έναντι ταχύτητας. Το AVIF συμπιέζει έως και 50 τοις εκατό καλύτερα από το JPEG, το WebP κυμαίνεται γύρω στο 25 έως 35 τοις εκατό καλύτερα και κωδικοποιεί πολύ πιο γρήγορα. Για μια ιστοσελίδα που ελέγχετε, το AVIF αξίζει την αναμονή κωδικοποίησης, για οτιδήποτε όπου η ταχύτητα παράδοσης μετράει περισσότερο από κάθε kilobyte, το WebP είναι η πρακτική επιλογή.

Σε τι υπερέχει το WebP

Το WebP σχεδιάστηκε από την Google ως άμεση βελτίωση του JPEG και του PNG για το web. Παράγει αρχεία περίπου 25 έως 35 τοις εκατό μικρότερα από το JPEG στην ίδια οπτική ποιότητα, υποστηρίζει διαφάνεια και κίνηση, και υποστηρίζεται από κάθε μεγάλο browser από το 2020. Η κωδικοποίηση είναι γρήγορη: μια παρτίδα φωτογραφιών μετατρέπεται σε WebP μέσα σε δευτερόλεπτα. Αυτός ο συνδυασμός στέρεας συμπίεσης, ευρείας υποστήριξης και γρήγορης κωδικοποίησης καθιστά το WebP την ασφαλή προεπιλογή για εικόνες σε ιστοσελίδα σήμερα.

Σε τι υπερέχει το AVIF

Το AVIF βασίζεται στο codec βίντεο AV1 και επιτυγχάνει συμπίεση που είναι συνήθως 50 τοις εκατό καλύτερη από το JPEG και αισθητά καλύτερη από το WebP στην ίδια οπτική ποιότητα. Διαχειρίζεται επίσης τις ομαλές διαβαθμίσεις και τις λεπτές λεπτομέρειες πιο καθαρά από το WebP, με λιγότερα από τα τεχνουργήματα ringing που εμφανίζονται γύρω από ακμές υψηλής αντίθεσης στα φορμά με απώλειες. Η υποστήριξη από browser έφτασε σε όλους τους μεγάλους browser από τα τέλη του 2023. Το πραγματικό κόστος είναι ο χρόνος κωδικοποίησης: το AVIF παίρνει λεπτά εκεί που το WebP παίρνει δευτερόλεπτα, οπότε ταιριάζει καλύτερα σε εικόνες που συμπιέζονται μία φορά και σερβίρονται πολλές, όπως εικόνες hero και φωτογραφίες προϊόντων.

Πώς να επιλέξετε και να δοκιμάσετε και τα δύο στον browser σας

Η πρακτική προσέγγιση είναι να δοκιμάσετε και τα δύο στη δική σας εικόνα και να συγκρίνετε τα αποτελέσματα. Σύρετε την ίδια φωτογραφία στον συμπιεστή εικόνων, εξάγετέ την μία φορά ως WebP και μία ως AVIF, και συγκρίνετε το μέγεθος αρχείου και την οπτική ποιότητα δίπλα-δίπλα. Ο συμπιεστής τρέχει εξ ολοκλήρου στον browser σας: το αρχείο σας δεν φεύγει ποτέ από τη συσκευή σας. Για μια εικόνα hero ιστότοπου ή μια γκαλερί προϊόντων όπου κάθε kilobyte επηρεάζει τις βαθμολογίες ταχύτητας, το AVIF αξίζει τον επιπλέον χρόνο κωδικοποίησης. Για περιεχόμενο που ανεβάζουν οι χρήστες όπου πρέπει να επεξεργαστείτε γρήγορα πολλές εικόνες, το WebP είναι η σωστή αντιστάθμιση.

Ο συμπιεστής εικόνων με μια φωτογραφία φορτωμένη και επιλεγμένο το AVIF ως φορμά εξόδου

Η έξοδος AVIF σε σύγκριση με το WebP, που δείχνει τη διαφορά μεγέθους αρχείου σε ίση ποιότητα

Τα εργαλεία που χρησιμοποιούνται σε αυτόν τον οδηγό

Συχνές ερωτήσεις

Μπορώ να χρησιμοποιήσω AVIF χωρίς εφεδρεία WebP;

Για νέες ιστοσελίδες που στοχεύουν σε σύγχρονους browser, ναι. Το AVIF υποστηρίζεται σε Chrome, Firefox, Safari και Edge από τα τέλη του 2023, κάτι που καλύπτει τη συντριπτική πλειονότητα της κίνησης στο web. Αν το κοινό σας περιλαμβάνει παλαιότερους browser ή κάποια mobile webview που δεν μπορείτε να επαληθεύσετε, το να παρέχετε μια εφεδρεία WebP σε ένα στοιχείο picture είναι η ασφαλής προσέγγιση: οι browser επιλέγουν το πρώτο φορμά που υποστηρίζουν και αγνοούν τα υπόλοιπα.

Ποιο φορμά να χρησιμοποιήσω για διαφανείς εικόνες;

Και τα δύο υποστηρίζουν διαφάνεια. Το AVIF τη διαχειρίζεται με ελαφρώς καλύτερη συμπίεση από το WebP στην ίδια ποιότητα. Αν η διαφανής εικόνα είναι ένα λογότυπο ή στοιχείο διεπαφής που εμφανίζεται σε πολλές σελίδες, το AVIF εξοικονομεί έναν αξιόλογο αριθμό byte. Αν η ταχύτητα κωδικοποίησης είναι περιορισμός, το διαφανές WebP δίνει εξαιρετικό αποτέλεσμα και είναι η πρακτική επιλογή για μαζική επεξεργασία.