Quando ho iniziato a fare il fotografo professionista, una delle prime cose che ho fatto è stata quella di costruirmi un sito web. Avevo già una certa dimestichezza con WordPress, quindi fu abbastanza facile.
Dopo aver terminato il mio lavoro e aver messo il sito online, mi accorsi subito che le foto ci mettevano tantissimo tempo a caricare.
Anche i miei amici a cui avevo fatto vedere il sito me lo fecero notare. La cosa era abbastanza antipatica, visto che il portfolio fotografico doveva essere il pezzo forte del sito.
Un fotografo avrebbe bisogno di mostrare al meglio le proprie foto, alla massima qualità, però nessuno ha voglia di aspettare 10/15 secondi per vedere apparire ogni singola foto. Non ne hanno voglia i tuoi amici, né tantomeno un potenziale cliente.
Purtroppo, uno degli elementi che più rallenta un sito web sono proprio le immagini. Spesso, sbagliando, si caricano immagini alla massima risoluzione. Questo, oltre che controproducente, è fondamentalmente inutile. E i motivi te li spiego più avanti.
Il segreto per avere un sito veloce e con foto di qualità è quello di ottimizzare le tue immagini per il web.
Non è affatto una cosa complessa. Anzi, ti accorgerai che bastano pochi minuti per avere enormi vantaggi dal punto di vista della navigazione del sito.
Per raggiungere il risultato migliore esistono diversi metodi. In questo articolo ti spiegherò come farlo con Photoshop e Lightroom.
Per velocizzare ulteriormente le operazioni, ti mostrerò anche come ottimizzare più foto contemporaneamente.
Se sei un fotografo, devi avere un sito internet
Mi auguro tu conosca l’importanza di avere un sito web. Il sito personale, infatti, rimane ancora un formidabile biglietto da visita per chiunque. Soprattutto per un fotografo, che ha la necessità di mostrare i suoi scatti al pubblico più vasto possibile.
I vantaggi di avere un sito, per un fotografo, sono molteplici:
· puoi organizzare al meglio il tuo portfolio, magari con uno slideshow
· puoi parlare di te e dei tuoi progetti
· puoi facilmente veicolare i visitatori verso ciò che ti è più utile
Facebook e Instagram, al contrario, sono molto più dispersivi. Soprattutto, sui social non hai nessun controllo. Cosa puoi mostrare e a chi mostrarlo dipende dalle regole degli algoritmi.
Oggi è piuttosto semplice gestire un sito in autonomia. Con piattaforme come WordPress, per esempio, è possibile creare e gestire un sito senza conoscere un rigo di codice html.
I visitatori (e Google) apprezzano i siti veloci
Come ti ho accennato all’inizio, le tue foto alla massima risoluzione non vanno bene per essere caricate su uno spazio web.
Scattare immagini ad una risoluzione altissima è ottimo se vuoi stampare poster giganteschi. Su internet, invece, è tutta un’altra storia.
Immagini da 10 Mbyte e oltre, impiegherebbero un tempo interminabile per essere caricate (e visualizzate) su una pagina web. Questo provocherebbe un tempo di navigazione lentissimo.
Il visitatore medio non ha pazienza. Se una pagina impiega più di 3 secondi per caricarsi, viene immediatamente abbandonata. Ogni secondo di ritardo riduce la soddisfazione del visitatore del 16%.
Inoltre anche Google apprezza i siti veloci. Un sito veloce, infatti, verrà indicizzato meglio. Al contrario, un sito molto lento, verrà penalizzato. Tradotto: se hai un sito ottimizzato, ti posizionerai più in alto nelle ricerche su Google.
Siccome il testo pesa pochi kbyte, ciò che può rallentare il tuo sito sono proprio le foto pesanti. Prima di caricarle sul server, quindi, è necessario che ottimizzi i tuoi file.
Per farlo, devi trovare il giusto compromesso tra peso e qualità dell’immagine. Più avanti ti spiego come fare.
Qual è la risoluzione migliore?
Ottimizzare le foto per il web significa, sostanzialmente, ridurne il peso senza perdere visibilmente qualità.
Se sei spaventato dall’idea di ridurre la qualità delle tue foto, leggi più avanti. Capirai che non è poi così terribile.
Una foto scattata con una reflex ha solitamente una risoluzione di 300 ppi (pixel per pollice) e dimensioni medie che si aggirano sui 6000 x 4000 pixel.
Una risoluzione così alta può essere apprezzata solo per la stampa (e negli ingrandimenti). Un monitor, anche in formato full HD, ha dimensioni massime di 1920 x 1080 pixel e una risoluzione massima di 96 dpi. Come vedi, tutto il resto è superfluo.
Quindi caricare sul web immagini con dimensioni e risoluzioni maggiori rispetto alle possibilità massime di un monitor, non farà apparire le tue foto migliori. Al contrario, appesantirai inutilmente le pagine del tuo sito, “indispettendo” sia i visitatori che i motori di ricerca.
Tieni presente, infine, che il formato full HD misura 1920 x 1080 pixel a tutto schermo. In un sito difficilmente un’immagine verrà caricata con queste dimensioni. Per questo motivo, è possibile ridimensionare le tue foto ad un formato ancora inferiore (ad esempio 1200 pixel sul lato lungo, ma anche meno).
Cosa devi fare per ottimizzare le tue foto per il web
Ottimizzare le tue foto per il web è molto semplice, ti basta un normale software di elaborazione delle immagini. Qui ti mostrerò come farlo con Photoshop e Lightroom.
Ottimizzare foto per il web con Photoshop
Su Photoshop esiste una procedura dedicata appositamente all’ottimizzazione delle immagini per il web.
Se non hai particolare dimestichezza con Photoshop, questo è il corso che ti consigliamo: “Photoshop CC 2018: la recensione del videocorso”.
Una volta aperto il file attraverso il software, vai su File/Esporta/Salva per web:
A questo punto ti si aprirà una finestra dove puoi settare i vari parametri:
Imposta “JPEG” dal menù a tendina, (ma puoi scegliere anche tra GIF e PNG), poi qualità “Massima” dal menù.
Lascia spuntata la casella “Converti in sRGB”.
Qui è doveroso aprire una parentesi. Questa casella è dedicata al profilo colore del tuo file e “sRGB” è il profilo colore utilizzato nella stragrande maggioranza dei monitor in commercio.
“Adobe RGB” è un profilo colore con una gamma cromatica più ampia, utilizzato anche dalle macchine fotografiche. Non essendo, però, utilizzato dai monitor dei computer, ti conviene convertire sempre in sRGB.
In “Anteprima” lascia su “Colore monitor”, mentre in “Metadati” se selezioni “Tutto” conserverai i dati di scatto. Per alleggerire ulteriormente il file, è consigliabile non aggiungere i metadati.
“Dimensione immagine” è la sezione più importante: qui puoi scegliere le dimensioni finali in pixel del tuo file. In questo caso ho scelto 1200 x 800, ma puoi arrivare anche a dimensioni più ridotte. Dipenderà da quanto grandi dovranno apparire le tue foto all’interno del sito.
I due parametri sono vincolati, quindi se ne modifichi uno, l’altro si modifica di conseguenza, conservando le proporzioni della foto. Come riferimento, quindi, prendi esclusivamente le dimensioni del lato più lungo (orizzontale se la foto è orizzontale, verticale se la foto è verticale). Premi su “Salva” e avrai il tuo file ridimensionato per il web.
Photoshop ti dà anche la possibilità di ridimensionare più foto contemporaneamente, ma con una procedura diversa.
Innanzitutto devi raccogliere tutte le tue foto in un’unica cartella. Dopo questa operazione, vai su File/Script/Elaboratore immagini. Ti si aprirà una finestra come questa:
Nella sezione 1 cerca la cartella con le tue immagini da ridimensionare, nella sezione 2 scegli la cartella di destinazione.
Nella sezione 3 spunta “Salva come JPEG” e “Ridimensiona”. Metti la qualità a 10 e scegli le dimensioni finali che dovranno avere le tue foto. Cliccando su “Esegui”, Photoshop ti ridimensionerà tutte le foto, salvandole nella cartella di destinazione scelta.
Ottimizzare foto per il web con Lightroom
Qui il discorso si fa anche più semplice perchè diventa più intuitivo, rispetto a Photoshop, ridimensionare più foto contemporaneamente.
Carica la cartella dei tuoi file nel modulo “Libreria” di Lightroom. Se hai dubbi su come lavorare in Lightroom, allora devi leggere qui: ”Ti presento Lightroom, il miglior programma per organizzare ed elaborare le tue foto”.
Dopo aver fatto le tue correzioni ai file, clicca su “Esporta”. Ti si aprirà una nuova finestra di dialogo, con una serie di parametri da settare. In questa fase puoi ridimensionare i tuoi file per il web.
Innanzitutto devi scegliere il percorso di esportazione dei tuoi file. Più sotto potrai settare i parametri utili per il ridimensionamento dei file.
In “Impostazione file” scegli il formato immagine e lo spazio colore (sRGB). Lascia la qualità a 100.
Ridimensiona il bordo lungo a 1200. Il bordo corto dell’immagine si ridimensionerà di conseguenza, conservando le proporzioni originarie. Fissa la risoluzione a 96 pixel per pollice.
Nel campo “nitidezza output” puoi impostare una “nitidezza per schermo”. In questo modo Lightroom ti aggiungerà un fattore di nitidezza che migliorerà la visualizzazione del file. Se, invece, vuoi avere totale controllo, ti consiglio di migliorare la nitidezza successivamente, lavorando in Photoshop.
Alla fine delle operazioni, clicca su Esporta. Ti ritroverai i file, ridotti e ridimensionati, nella cartella di destinazione scelta.
Conclusioni
Ridimensionare le immagini per il tuo sito web è un’operazione che devi fare assolutamente. In realtà la maggior parte delle piattaforme permettono di ridimensionare le immagini anche online.
È un processo sicuramente più veloce ed immediato: ti basta caricare la tua foto alla sua massima risoluzione e scegliere tra i vari ridimensionamenti proposti.
In questo modo, però, non hai nessun controllo sul ridimensionamento. Non puoi scegliere la risoluzione, nè eventualmente migliorarne la nitidezza.
Per te che sei un fotografo, invece, l’obiettivo principale deve essere quello di mostrare ai visitatori del tuo sito la migliore qualità possibile.
Se seguirai le operazioni che ti ho mostrato in questa guida, avrai un sito veloce e di qualità. Anche Google apprezzerà, premiandoti con un risultato migliore nelle ricerche.
