WebP, η μορφή εικόνας για ιστοσελίδες Google

Σχετικά με το Webp

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

Το WebP είναι μια σχετικά νέα μορφή εικόνας που προσφέρει εξαιρετικά απώλεια και απώλεια συμπίεσης για εικόνες στον ιστό. Αυτή η μορφή ήταν σχεδιάστηκε από την google. Για να το χρησιμοποιήσετε, θα πρέπει να κάνετε λήψη προεγκατεστημένων βοηθητικών προγραμμάτων για Gnu / Linux, Windows και Mac OS X.

Το WebP είναι μια νέα μορφή εικόνας που παρέχει συμπίεση χωρίς απώλειες και απώλεια για αρχεία PNG και JPEG. Με αυτήν τη μορφή θα επιτύχουμε μέγεθος εικόνας έως και 34% μικρότερο. Είναι συμβατό με το Google Chrome και το Opera. Μπορούμε να χρησιμοποιήσουμε το Nginx και το Apache για να προσδιορίσουμε εάν αυτή η μορφή υποστηρίζεται από το πρόγραμμα περιήγησης και μετά να προβάλλουμε την εικόνα σε μια νέα μορφή αντί για την αρχική εικόνα. Αυτή η μορφή αρχείου υποστηρίζει επίσης κινούμενες εικόνες, οι οποίες μπορούν να οδηγήσουν σε μεγάλες μειώσεις στα μεγέθη των εικόνων.

Με τη μορφή WebP, οι webmaster και οι προγραμματιστές μπορούν δημιουργήστε μικρότερες, πλουσιότερες εικόνες που κάνουν τον ιστό πιο γρήγορο.

Εγκαταστήστε το εργαλείο WebP στο Ubuntu

Ευτυχώς, το πακέτο ιστοσελίδας είναι υπάρχει στα επίσημα αποθετήρια του Ubuntu. Μπορούμε να το εγκαταστήσουμε χρησιμοποιώντας τον διαχειριστή πακέτων APT. Θα πρέπει να ανοίξουμε μόνο ένα τερματικό (Ctrl + Alt + T) και να γράψουμε σε αυτό:

sudo apt install webp

Μπορούμε επίσης να επιλέξουμε το Ubuntu και άλλες διανομές Gnu / Linux για λήψη πακέτου ιστοσελίδων από το αποθετήριο google. Για αυτό θα χρησιμοποιήσουμε την εντολή wget ανοίγοντας ένα τερματικό (Ctrl + Alt + T) και πληκτρολογώντας:

wget -c https://storage.googleapis.com/downloads.webmproject.org/releases/webp/libwebp-0.6.1-linux-x86-32.tar.gz

Το επόμενο πράγμα που θα κάνουμε είναι να εξαγάγετε το αρχείο και να μετακινηθείτε στον κατάλογο του εξαγόμενου πακέτου ως εξής:

tar -xvf libwebp-0.6.1-linux-x86-32.tar.gz
cd libwebp-0.6.1-linux-x86-32/
cd bin/
ls

εργαλεία ιστοσελίδας

Ενσωματωμένα εργαλεία

Όπως μπορείτε να δείτε από το παραπάνω στιγμιότυπο οθόνης, το πακέτο περιέχει μια προκατασκευασμένη βιβλιοθήκη (libwebp) για να προσθέσετε διάφορα βοηθητικά προγράμματα ιστού που αναφέρονται παρακάτω:

  • anim_diff → Είναι ένα εργαλείο για δείξτε τη διαφορά μεταξύ των εικόνων κινουμένων σχεδίων.
  • anim_dump → Αυτό είναι ένα εργαλείο για απορρίψτε τη διαφορά μεταξύ των εικόνων κινουμένων σχεδίων.
  • cwebp → Είναι ένα εργαλείο για κωδικοποίηση ιστοσελίδας.
  • dwebp → Αυτό είναι ένα εργαλείο για αποκωδικοποίηση webp.
  • gif2webp → Ένα εργαλείο για μετατροπή εικόνων GIF σε ιστοσελίδα.
  • img2webp → Εργαλεία για μετατρέψτε μια ακολουθία εικόνας σε ένα κινούμενο αρχείο web.
  • vwebp → Αυτό είναι ένα πρόγραμμα προβολής αρχείων webp.
  • webpinfo → Αυτό το εργαλείο χρησιμοποιείται για προβολή πληροφορίες για ένα αρχείο webp εικόνα.
  • webpmux → Ένα εργαλείο mux από την ιστοσελίδα.

Θα είμαστε σε θέση να δούμε όλες τις επιλογές για οποιοδήποτε από τα προηγούμενα εργαλεία εκτελώντας τα χωρίς κανένα επιχείρημα ή χρησιμοποιώντας το -μεγάλη σημαία. Για παράδειγμα:

cwebp -longhelp

Τέλος, εάν θέλουμε να εκτελέσουμε τα προηγούμενα προγράμματα χωρίς να γράψουμε τις απόλυτες διαδρομές τους, θα πρέπει να προσθέσουμε μόνο τον κατάλογο ~ / libwebp-0.6.1-linux-x86-32 / bin στο δικό μας Μεταβλητή περιβάλλοντος PATH στο αρχείο ~ / .bashrc. Για να το κάνουμε αυτό θα εκτελέσουμε στο τερματικό (Ctrl + Alt + T):

vi ~/.bashrc

Στο τελευταίο του αρχείου θα προσθέσουμε:

συμπεριλάβετε webp στο bashrc

export PATH=$PATH:~/libwebp-0.6.1-linux-x86-32/bin

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

Μετατροπή εικόνας σε ιστοσελίδα

Για να μετατρέψουμε μια εικόνα σε ιστοσελίδα, μπορούμε χρησιμοποιήστε το εργαλείο cwebp. Σε αυτήν η παράμετρος -q καθορίζει την ποιότητα εξόδου και -o καθορίζει το αρχείο εξόδου. Ακολουθεί ένα παράδειγμα:

Η εικόνα δημιουργήθηκε με Webp

cwebp -q 80 ubunlog.jpeg -o ubunlog.webp

Δείτε μια εικόνα που έχει μετατραπεί

Προβολή εικόνων Webp

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

vwebp ubunlog.webp

Το WebP είναι ένα από τα πολλά προϊόντα που προέρχονται από τις συνεχείς προσπάθειες της Google να κάνει τον ιστό πιο γρήγορο. Αν θέλουμε να μάθουμε περισσότερα για αυτήν τη μορφή εικόνας, μπορούμε Επισκέψου το Ιστοσελίδα έργου WebP.


Αφήστε το σχόλιό σας

Η διεύθυνση email σας δεν θα δημοσιευθεί. Τα υποχρεωτικά πεδία σημειώνονται με *

*

*

  1. Υπεύθυνος για τα δεδομένα: Miguel Ángel Gatón
  2. Σκοπός των δεδομένων: Έλεγχος SPAM, διαχείριση σχολίων.
  3. Νομιμοποίηση: Η συγκατάθεσή σας
  4. Κοινοποίηση των δεδομένων: Τα δεδομένα δεν θα κοινοποιούνται σε τρίτους, εκτός από νομική υποχρέωση.
  5. Αποθήκευση δεδομένων: Βάση δεδομένων που φιλοξενείται από τα δίκτυα Occentus (ΕΕ)
  6. Δικαιώματα: Ανά πάσα στιγμή μπορείτε να περιορίσετε, να ανακτήσετε και να διαγράψετε τις πληροφορίες σας.