Ottimizza immagini per il sito
Scegli le foto. Lo strumento crea versioni in più larghezze, in WebP, e prepara l'HTML responsive: il browser scarica solo la dimensione di cui lo schermo ha bisogno.
Come si usaImmagini leggere e responsive
Disponibile in: 
Ottimizza immagini per il sito: a cosa serve
Scegli una o più foto e imposta le larghezze (480, 800, 1200 e 1600 px di default), il formato (WebP o JPG) e la qualità. Lo strumento crea ogni versione senza ingrandire la foto oltre la dimensione originale, mostra il peso di ciascuna e prepara l'HTML responsive con srcset, sizes, width e height e loading=lazy o fetchpriority=high per l'immagine in cima.
Come si usa
- Scegli le immagini del sito.
- Regola larghezze, formato, qualità e cartella.
- Scarica lo .zip e copia l'HTML nella pagina.
Quando usarlo
- Rendere il sito più veloce su smartphone.
- Migliorare LCP e CLS dei Core Web Vitals.
- Preparare foto di prodotti e gallerie.
Domande frequenti
Perché generare più larghezze?
Uno smartphone non ha bisogno di scaricare la foto da 1600 px pensata per i monitor grandi. Con srcset il browser sceglie la versione più piccola che resta comunque nitida sullo schermo, e la pagina si carica più in fretta, il che aiuta anche i Core Web Vitals (LCP).
WebP funziona in tutti i browser?
Sì, in tutti i browser attuali (Chrome, Safari dalla versione 14, Firefox ed Edge). Se ti serve compatibilità con dispositivi molto vecchi, scegli JPG.
A cosa servono width, height e loading=lazy?
Width e height riservano lo spazio dell'immagine prima che si carichi, evitando che la pagina salti (CLS). Loading=lazy rimanda il caricamento delle immagini fuori schermo. Non usare lazy sull'immagine principale in cima alla pagina.
È davvero gratis?
Sì, 100% gratis. Senza registrazione, senza abbonamento e senza limiti d’uso. Tutti gli strumenti di Tools123 sono gratuiti.