Perfeziona il tuo sito con images.tooling.report

Verifica lo stato degli strumenti per le immagini.

Patrick Kettner
Patrick Kettner

Una cosa è mettere un'immagine sul web, ma è difficile farlo bene. Scegliere il formato, la compressione, i punti per pollice (DPI) e centinaia di altre impostazioni corretti potrebbero essere facilmente dimenticati se facciamo tutto questo da soli.

La grande notizia è che oggi disponiamo di moltissimi strumenti e servizi che possono fare tutto questo per noi. La notizia meno bella è che c'è un'abbondanza. Può essere difficile scegliere lo strumento o il servizio più adatto a te. Ecco perché stiamo lanciando images.tooling.report, un sito in cui elenchiamo ciò che riteniamo essere i più importanti per la spedizione delle immagini in produzione e per confrontare alcuni dei software e dei servizi più utilizzati, a pagamento o senza costi, in hosting o self-hosted.

Perché?

Le immagini rappresentano una parte enorme dei byte trasferiti di un sito e questi byte si sommano. Infatti, abbiamo riscontrato che le immagini non ottimizzate rappresentano circa il 75% delle dimensioni totali di una pagina. Tutti questi byte sprecati hanno un costo. Ecco perché, in uno studio su milioni di sessioni di utenti reali, le pagine che hanno generato conversioni avevano il 38% di immagini in meno rispetto a quelle che non hanno generato conversioni. Dovresti eliminare tutte le immagini? Ovviamente no. Tuttavia, devi assicurarti che le immagini inviate siano ottimizzate per tutti gli utenti, indipendentemente dal dispositivo che utilizzano.

Che cos'è?

Pubblicare immagini ottimizzate non significa limitarsi a fare clic su "Salva per il web". Per questo motivo, images.tooling.report verifica un'ampia gamma di funzionalità. Esaminiamo gli aspetti di base, come il livello di compressione offerto dai vari strumenti e servizi e le ottimizzazioni della rete come le intestazioni cache di lunga durata.

Ma non ci fermiamo qui. Abbiamo cercato opzioni più avanzate, come il supporto per Save-Data, ECT e altri suggerimenti client, per cercare analisi psicovisive automatiche che possano utilizzare i modelli di dati per comprimere ripetutamente le immagini, in modo da trovare la versione che richiede il minor numero di byte senza cambiare il modo in cui i nostri occhi le percepiscono. Prima di passare dalla rete, tiri all'ultimo strato non visivo delle tue immagini?

Uno screenshot della pagina di destinazione per images.tooling.report in modalità Buio.

Ovviamente, ogni sito è un fiocco di neve: nessuno strumento o servizio ha fatto assolutamente tutto ciò che stavamo cercando. Si tratta del comportamento previsto. Quindi abbiamo suddiviso ciò che abbiamo testato in diverse categorie. Esaminiamo le reti CDN (Content Delivery Network), i progetti ospitati autonomamente, i plug-in del sistema di gestione dei contenuti (CMS) e gli strumenti per la creazione di siti. Si tratta di definizioni piuttosto generiche che servono a rendere più pertinenti il confronto delle diverse opzioni:

  • I plug-in CMS sono pacchetti che costituiscono un'opzione semplice per lo sviluppo su piattaforme come WordPress.
  • Gli strumenti per la creazione di siti confrontano una serie di servizi diversi che puoi utilizzare per creare il tuo sito web.
  • Ospitato autonomamente è destinato agli sviluppatori che preferiscono clonare un progetto Git o eseguire la propria immagine Docker in produzione.
  • Le CDN sono un po' più complesse. Alcuni di questi sono CDN nel senso tradizionale, ma altri sono servizi che eseguono il proxy o ospitano le tue immagini sul perimetro.

Non puoi essere sempre tutto, ma devi dare un'occhiata ai test e alle funzionalità che vengono valutati e vedere come si posiziona il tuo ottimizzatore delle immagini. E se non ti avvali già di fare qualcosa per l'ottimizzazione delle immagini oggi? Poi è il momento giusto per dare un'occhiata agli strumenti per le immagini e vedere quali vantaggi puoi offrire agli utenti che già utilizzano il tuo sito.

Passaggi successivi

Pensi che ci sia stato perso uno strumento o un servizio per le immagini? Facci sapere. Sia gli strumenti che i servizi, nonché i test stessi, sono qualcosa di vivo e aggiornato. Ogni volta che hai bisogno di verificare rapidamente lo stato dell'arte delle immagini di spedizione, assicurati che la prima tappa sia images.tooling.report.

Immagine hero di Michael Maasen su Unsplash.