Cos'è un sito senza immagini? Dal mio punto di vista, le immagini danno carattere a un sito e invogliano maggiormente gli utenti a navigarlo. Se poi il tuo sito web parla di fotografia le immagini sono la cosa più importante.
Per fare un buon lavoro dovresti capire come ottimizzare le immagini su WordPress, altrimenti la velocità di caricamento del tuo sito può penalizzare i tuoi posizionamenti sui motori di ricerca.
Scopri di più sul argomento del posizionamento visitando la nostra pagina dedicata al argomento SEO per WordPress.
In questo articolo vado a spiegarti perché è importante ottimizzare le immagini del tuo sito WordPress e ti spiegherò come migliorarle in 4 semplici passi, quasi senza perdere qualità.
Come tanti altri visitatori sei arrivato qui perché stai cercando modi per rendere più veloce il tuo sito WordPress, beh sei nel posto giusto.
Ottimizzare le immagini su WordPress e uno dei passi fondamentali se si vuole velocizzare WordPress e ovviamente il tuo sito o blog.
Iniziamo con un bella tabella con i contenuti trattati in questo articolo. Puoi cliccare per andare alla sezione che interessa senza dover
Perché ottimizzare le immagini su WordPress?
Se riduci le dimensioni delle tue immagini riuscirai a diminuire la velocità di caricamento del tuo sito, è naturale. Quello che in molti non sanno è che ridurre i tempi di caricamento di un sito porta tantissimi altri benefici.
Il più importante beneficio è che Google prende in considerazione la velocità con la quale si carica il tuo sito per il posizionamento nelle pagine di ricerca. Le immagini molto spesso sono quelle che pesano di più sul tempo di caricamento del tuo sito web.
Google dice che “le immagini sono le risorse più scaricate su un sito web” e occupano gran parte dello spazio visivo. Se il tuo sito parla di fotografia allora di sicuro avrà più immagini di un sito normale; dovrai fare molta attenzione a come utilizzi le immagini altrimenti la tua velocità di caricamento continuerà a peggiorare.
Quindi?
È proprio qui che entra in gioco un po di ricerca sulla velocità di caricamento. La cosa più importante da sapere è che i tempi lunghi di caricamento danneggiano il tuo sito.
Questa info grafica di KissMetrics spiega perché è importante la velocità di caricamento.
Devi tenere presente che per ogni secondo di ritardo nel caricamento ci sarà una diminuzione del tasso di conversione di circa il 7%.
Prendendo questi numeri come indicativi, ipotizziamo che ogni mese tu abbia un guadagno di 3000 Euro dal tuo sito; quindi ogni mese perdi circa 210 Euro per ogni secondo di ritardo.
Facendo un po’ di conti ogni anno perdi circa 2500 Euro. Questo ovviamente se contiamo solo 1 secondo di ritardo.
Pensa a quante cose potresti fare con 2500 Euro ogni anno. Pensa quanto puoi incrementare i tuoi guadagni migliorando la velocità di caricamento.
La velocità di caricamento è importante anche se non guadagni soldi dal tuo sito ma vuoi semplicemente aumentare il tuo traffico o creare la tua audience.
Per esempio avere un sito web lento porta a meno condivisioni e visite che si ripetono. È un fatto provato che se il tuo sito si carica in più di 3 secondi il 40% delle persone lo abbandonano.
Google ha fatto un esperimento per valutare l'impatto della velocità di caricamento. Dopo che un bel po’ di utenti hanno detto che vogliono 30 risultati per pagina di ricerca e non più 10 come era impostato di solito, Google ha provato a cambiare il numero di risultati su un paio di pagine.
Quello che hanno scoperto è che aggiungendo più risultati aumentava il tempo di caricamento di circa mezzo secondo; quel mezzo secondo in più diminuiva la quantità di traffico del 20%.
Arrivati a questo punto la domanda che viene spontanea è: “Come può evitare un fotografo tutti questi problemi legati alle immagini?”
Ci sono dei semplici passi per ottimizzare le immagini di un sito web senza avere grandi perdite. Il primo passo e quello di ritagliare le immagini.
Perché ritagliare le immagini
Se anche tu in questo momento ti chiedi perché bisogna ritagliare le immagini, basta chiedertelo eccoti due validissimi motivi:
- Le immagini vengono ritagliate per una questione estetica;
- Le immagini ritagliate hanno dimensioni inferiori.
Il primo è abbastanza ovvio e ci sono vari modi in cui puoi ritagliare le immagini per stimolare l'impatto visivo. L'attrazione estetica è solo un bonus.
L'impatto maggiore arriva dalla riduzione dalla dimensione del file. Sia che rimuovi intere sezioni di un'immagine o soltanto qualche pixel sulla destra o sulla sinistra quello che in realtà stai facendo è diminuire la dimensione del file perché hai rimosso una parte dei dati che vengono trasferiti nel caricamento della pagina.
Sai 12kb di qua, 27kb di la e ti rendi conto che soltanto con il ritaglio delle immagini sei riuscito a diminuire la dimensione della tua pagina di qualche centinaio di kilobyte che i tuoi visitatori non devono scaricare. Quindi il tuo sito si caricherà in meno tempo.
Come ritagliare le immagini su WordPress
Quando si caricano le immagini dal telefono o dalla fotocamera, di solito queste risultano troppo grandi per essere pubblicate direttamente sul tuo blog o sito web.
WordPress crea automaticamente immagini di piccole, medie e grandi dimensioni a partire dal tuo caricamento originale. A volte, tuttavia, potrebbe essere necessario ritagliare l’immagine in una dimensione diversa.
WordPress non è paragonabile a Photoshop ma include alcune funzioni basilari di modifica delle immagini per ridimensionare, ritagliare, capovolgere e ruotare le immagini.
Vai su Media »Aggiungi Nuovo e carica la tua immagine. Dopo aver caricato l’immagine, vedrai il tasto modifica accanto all’immagine caricata.
Cliccando su di esso si aprirà la schermata Modifica Media dove troverai il pulsante Modifica Immagine. Questo aprirà l’editor di immagini di WordPress.
Nella schermata dell’editor di immagini, Troverai i pulsanti per eseguire alcune attività basilari di modifica delle immagini come ritaglio, rotazione, ridimensionamento, ecc.
Formati immagini web: quali scegliere
Una volta che hai ritagliato un'immagine, il primo passo per una giusta ottimizzazione è di scegliere il formato giusto (jpg, jpeg, png, svg, gif, etc) per la tua nuova immagine.
Ecco i più importanti formati per le immagini:
Formato immagine JPEG
Questo formato file è stato creato apposta per poter comprimere le immagini, in particolare le immagini con molti dettagli. È la migliore scelta per i fotografi.
Il formato JPEG ha la compressione lossy che significa perdita di un po’ di qualità nel processo di compressione. Per un fotografo comune è più che sufficiente.
Formato immagine GIF
Anche se e uno dei più vecchi formati in uso, il GIF è ancora molto utile.
Sopporta solo 256 colori e non bisogna dunque mai utilizzarlo per illustrazioni, pitture o fotografia. La cosa positiva è che nel formato GIF le immagini possono avere sfondo trasparente. Un'altra cosa positiva è che possono essere animate.
Essendo immagini di dimensioni ridotte ti consiglio di considerare il formato GIF per immagini semplici o con animazioni.
Formato immagine PNG
Come i GIF anche i file PNG sopportano gli sfondi trasparenti ma a differenza dei primi sono completamente “lossless” e possono incorporare un grande numero di colori. Non è consigliato salvare una fotografia in formato PNG e se hai immagini con testi e grosse aree con lo stesso colore devi valutare bene la tua scelta.
Formato immagine SVG
L'acronimo di questo formato sta per Scalable Vector Graphics. Il formato SVG usa linguaggio markup per generare immagini che possono scalare a qualsiasi dimensione. Il formato SVG è fantastico per grafiche in 2 dimensioni e migliorerà di tantissimo la velocità di caricamento del tuo sito web. Questo formato di file è ancora abbastanza nuovo e non tutti i browser lo sopportano.
Strumenti per ottimizzare le immagini
TinyPNG è il mio tool preferito per ottimizzare immagini.
Prendere decisioni per il ritaglio e il tipo di file può essere stancante. Per fortuna uno dei migliori modi in cui puoi diminuire le dimensioni delle immagini richiede pochissime decisioni da parte tua. I programmi per l'ottimizzazione fanno il lavoro sporco al posto tuo. Ecco una piccola lista dei migliori:
- TinyPNG: questo programma è una web-app che diminuisce il numero di colori delle tue PNG così da diminuire la dimensione senza grandi perdite di qualità.
- JPEGmini: dietro questo programma c'è una tecnologia in attesa del patent che riduce il più possibile la dimensione senza grande impatto sulla qualità. Puoi utilizzare la versione trial o pagare per utilizzarlo sempre.
- RIOT: Radical Image Optimization Tool (che puoi scaricare gratuitamente) usa varie tecniche per diminuire le dimensioni delle tue immagini. Il programma è molto bello anche perché ti fa vedere le 2 immagini affiancate, cioè vedi a destra l'immagine originale e a sinistra l'immagine ottimizzata.
- ImageOptin: questa è una app gratuita per Mac che usa varie tecniche per ottimizzare le dimensioni delle immagini preservandone la qualità il più possibile.
Strumenti per ottimizzare immagini su WordPress
WordPress non e da meno quindi sappi che ci sono un sacco di plugin per ottimizzare le immagini direttamente dal'interno del'area di amministrazione di WordPress.
Alcuni di questi ti chiedono di fare alcune configurazioni all'inizio poi ottimizzano le immagini ogni volta che le carichi. Molto molto comodo.
Ecco i migliori plugin per ottimizzare le immagini su WordPress:
Cosa sono le miniature in WordPress
Le miniature sono un ottimo modo per bilanciare il compromesso tra file di piccole o grandi dimensioni e immagini ad alta risoluzione. Come parte delle sue funzionalità predefinite WordPress offre un'opzione per le miniature; genera una piccola (sia in termini di dimensioni fisiche che di dimensione file) anteprima dell'immagine.
Queste miniature possono aiutare a migliorare di tantissimo il tempo di caricamento delle tue pagine. Il problema con le immagini piccole è che non puoi mostrarne i dettagli o i bellissimi colori.
Per fortuna WordPress ci permette di risolvere il problema in maniera facile e veloce. Quando aggiungi una miniatura su una pagina o un articolo puoi aggiungere un link diretto al file media, andando alla sezione dedicata e scegliendo di linkare al file media.
I visitatori potranno fare click sulla miniatura per aprire l'immagine nella sua dimensione originale.
Conclusione
La velocità di caricamento è fondamentale. Per questo uno dei punti più importanti è ottimizzare le immagini prima di caricarle online.
E tu quali programmi e strumenti usi per ottimizzare le tue immagini? Lascia un commento qui sotto e fammi sapere. Inoltre se hai domande a riguardo usa sempre la sezione commenti e io ti risponderemo il prima possibile.
Se hai un sito WordPress e stai cercando di capire come ottimizzare le immagini per migliorare i tempi di caricamento del tuo blog, sito web o negozio online allora ti consiglio di leggere questa guida su come velocizzare WordPress.