Come ottimizzare le immagini sul tuo sito (gratis)

da Figaro Digital | Ago 8, 2023 | Aziende

Come ottimizzare le immagini sul tuo sito (gratis)
prestazioni immagini

Chi controlla spesso le prestazioni del proprio sito, spesso si trova davanti ad una schermata come questa in foto.

L’ottimizzazione delle immagini è ancora uno degli aspetti più importanti quando si parla di prestazioni web. Com’è ovvio che sia, ci sono ormai decine e decine di plugin a pagamento per tentare di risolvere il problema, ma in questo articolo abbiamo pensato di fornirti anche una soluzione gratuita, che a volte abbiamo utilizzato anche noi, ma che richiede qualche piccolo sforzo in più!

Step 1. Controllare le dimensioni

dimensioni immagini

Per prima cosa bisogna sincerarsi che le dimensioni delle immagini siano quelle corrette, per evitare di avere un tempo di caricamento troppo lungo.

Il nostro consiglio è quello di usare l’estensione Chrome “Image size info”, che, in una piccola schermata simile a questa (foto su), permette di conoscere le dimensioni originarie e quelle visualizzate. Quando queste non corrispondono, bisogna intervenire. Basta andare sul tuo sito, cliccare con il tasto destro sull’immagine e selezionare “View Info”.

Mi raccomando tieni sempre in mente i numeri “displayed”, perché saranno quelli a fare da guida.

Step 2. Controllare il formato

Tra le proprietà del file o tramite il link abbinato si può risalire al formato dell’immagine caricata.

Spesso, per avere immagini di massima qualità, si tende a tenerle in PNG, senza contare l’impatto che hanno sulla velocità. In questi casi è sempre meglio usare sempre JPEG, o meglio ancora WEbP (se supportato). Non sarà della stessa qualità, ma il beneficio in termini di prestazioni sarà molto positivo.

Se non hai un programma per effettuare la conversione, si può usare lo strumento gratuito online-convert.com. Unica eccezione sono le immagini senza sfondo, quelle si possono utilizzare solo in PNG, vedremo come ottimizzare anche quelle!

N.B.

Google consiglia sempre di inserire immagini nei formati più recenti (JPEG2000, WEBP ecc.), tuttavia alcuni temi non supportano questi tipi di file, quindi se riesci ad utilizzarli ben vengano, altrimenti non è un grosso problema.

Step 3. Ritagliare o ridimensionare

 

ritagliare immagini

[Se tramite i primi 2 step hai scoperto che le immagini erano già delle dimensioni e del formato giusto, puoi saltare direttamente all’ultimo passaggio!]

Prendiamo il caso, molto diffuso, che le immagini originarie siano troppo grandi rispetto al riquadro di visualizzazione.

Si può procedere in due modi:

  • Ritagliare: se ti puoi permettere di perdere “un pezzo” dell’immagine, allora si può effettuare un ritaglio, inserendo come dimensioni quelle famose “displayed” che hai incontrato precedentemente.
  • Ridimensionare: Inserisci le dimensioni desiderate nel riquadro preposto, il resto lo farà il tool per te. Attenzione solo a controllare che l’immagine non risulti troppo sfocata.

 

Step 4. Croppare

Cosa significa croppare? Italianizzando il verbo inglese to crop, si può tradurre come “comprimere”.

Questo è un passaggio fondamentale per tutte le immagini, cerca di non saltarlo mai.

Sempre con lo strumento che abbiamo menzionato in foto sopra, carica l’immagine e clicca su “Comprimi”, avrai così una sensibile riduzione del peso, di solito almeno di un 70–80% rispetto all’originale, che non è per nulla poco!

Pro Tip:

 

alt text immagini

Dopo aver effettuato tutti gli step necessari ed aver caricato nuovamente le immagini più performanti, se non l’hai già fatto, non dimenticare di inserire l’ALT text, non aiuterà in termini prestazioni ma è utilissimo per l’ottimizzazione SEO.

Lista dei tool

Tasso di conversione ecommerce: 20 consigli utili

Tasso di conversione eCommerce: 20 consigli utili

Tasso di conversione eCommerce: 20 consigli utilida Figaro Digital | 13 Giugno, 2023 | AziendeLa metrica che più di tutte fa diventare matti proprietari ed eCommerce manager è sicuramente il tasso di conversione, il perché è piuttosto semplice da intuire: più...
Canva: Trucchetti e segreti per conoscerlo meglio

Canva: 10 segreti e 10 trucchetti per conoscerlo meglio

Canva: Trucchetti e segreti per conoscerlo meglioda Figaro Digital | Giu 1, 2022 | Guide 10 Segreti 10 Trucchetti Non c'è bisogno di particolari presentazioni, Canva ormai è diventato uno strumento imprescindibile per tutti coloro che creano contenuti (soprattutto nel...
Crea il tuo podcast in 5 mosse

CREA IL TUO PODCAST IN 5 MOSSE

CREA IL TUO PODCAST IN 5 MOSSEda Figaro Digital | Dec 10, 2023 | Guide Creazione account e settaggio Configurazione podcast Registrazione primo episodio Descrizioni e grafiche Pubblicazione Bonus - Strumenti utili Che i podcast stiano crescendo a dismisura negli...
Il potere dei sensi- come il Neuromarketing può stimolare le vendite

Il potere dei sensi: come il Neuromarketing può stimolare le vendite

Il potere dei sensi: come il Neuromarketing può stimolare le venditeda Giovanna Fusco | 14 Ottobre, 2022 | AziendeScommetto sia capitato anche a te, almeno una volta nella vita, di svegliarti con il desiderio di gustare un bel cornetto caldo al cioccolato e di...
Ottimizzare il tuo profilo LinkedIn

Ottimizzare il tuo profilo LinkedIn

Ottimizzare il tuo profilo LinkedInda Figaro Digital | Dec 18, 2023 | Guide Perché usare LinkedIn Foto profilo Headline Sommario Esperienze Competenze Segnalazioni Trucchetti da sfruttare È arrivato il momento di parlare di un social su cui si sentono giudizi...
Il Marketing al supermercato - le migliori strategie

Il Marketing al supermercato: le migliori strategie

Il Marketing al supermercato: le migliori strategieda Figaro Digital | 14 Ottobre, 2022 | AziendeNon è un segreto come nei supermarket sia tutto studiato nei minimi particolari, ogni prodotto, ogni scaffale, è posizionato in quel modo per incrementare la spesa di noi...
Lo script dei video brevi

Tik Tok e Reel: Come creare lo script

Tik Tok e reel: come creare uno script efficaceda Figaro Digital | Mar 19, 2024 | Guide Tik Tok vs Reel: Le differenze Il gancio Corpo dello script La Call To Action Prima di iniziare ufficialmente, siccome abbiamo due piattaforme comunque molto diverse, è bene fare...
Facebook Ads: 34 termini che devi conoscere

Facebook Ads: 34 termini che devi conoscere

Facebook Ads: 34 termini che devi conoscereda Figaro Digital | Dec 10, 2023 | Guide Le Facebook ADS sono sicuramente tra le cose che ogni marketer dovrebbe saper maneggiare. Benché siano uno strumento abbastanza intuitivo, più si va nello specifico più si incontrano...
Guida al preventivo perfetto in 6 step

Guida al preventivo perfetto

GUIDA AL PREVENTIVO PERFETTO IN 6 STEPda Figaro Digital | Dec 12, 2023 | Guide Copertina Chi sei e come puoi essere utile Obiettivi Portfolio e Testimonianze Proposte economiche Prossimi passi Facciamo tutti lo stesso errore: non curare il preventivo, inviarne...
AUMENTARE LA COMPETITIVITÀ- LE AGEVOLAZIONI PER LA DIGITALIZZAZIONE

Aumentare la competitività: le agevolazioni per la digitalizzazione

Aumentare la competitività: le agevolazioni per la digitalizzazioneda Giulio Curcio Terremoto | 13 Aprile 2023 | AziendeLa digitalizzazione delle imprese è un processo in continua crescita e sempre più importante per la competitività delle aziende. La pandemia ha...
Non è finita qui!

C’è un posto, che forse ancora non conosci, dove puoi approfondire un argomento diverso ogni mese, attraverso dei veri e propri mini-corsi. Questo è “Deep in Marketing”, la newsletter targata Figaro Digital.