Vai al contenuto principale

Dimensioni e risoluzione ottimali per le immagini del tuo sito web

Differenza tra dimensioni e risoluzione di un'immagine e come prepararla in 96 ppp e 2000 px per il web.

Scritto da Félix Mezcua

Innanzitutto, una premessa importante: nei siti web per fotografi di Arcadina tutte le immagini vengono ottimizzate automaticamente quando le carichi. Così si vedono sempre ottimizzate, si caricano molto velocemente e l'esperienza del visitatore è ottimale.

Quando si inizia a pubblicare immagini su Internet, molti di voi ci chiedono quali siano la risoluzione e le dimensioni ideali, con domande come queste:

«Se do alla foto x pixel, quanti centimetri misura?»

«Se ha 96 ppp, qual è la dimensione finale dell'immagine?»

Sono concetti diversi. Qui sotto ti spieghiamo i termini da tenere presenti perché le immagini del tuo sito siano ottimali. Ricorda: dimensioni e risoluzione sono due cose diverse, e insieme determinano il peso del file.

Dimensioni e risoluzione di un'immagine

Puoi dare a un'immagine delle dimensioni in pixel o in centimetri (o in altre unità). Se lavori per la stampa, l'ideale è che l'immagine abbia esattamente i centimetri del volantino, della stampa su tela, ecc. Se invece la foto è per Internet, le dimensioni vanno indicate in pixel.

Anche la risoluzione dipende dall'uso: per Internet bastano 96 ppp, per la stampa servono più di 150 ppp.

Sul web si parla di ppp (punti per pollice) e ci si dimentica dei centimetri. 96 ppp è la risoluzione perfetta per vedere un'immagine su uno schermo: non serve di più. Tutto ciò che va oltre è peso in eccesso, che rallenta il sito e fa andare via i visitatori. 300 ppp, per esempio, è una risoluzione da tipografia.

Se carichi una foto a 300 ppp, caricherai un file inutilmente grande, che non si vedrà affatto meglio. Una foto enorme può impiegare moltissimo a scaricarsi, occupa spazio inutile sul server e probabilmente i visitatori non aspetteranno che finisca di caricarsi.

Per questo ti serve un programma di fotoritocco con cui regolare dimensioni e risoluzione. Ce ne sono di gratuiti, come XnView, e di più conosciuti a pagamento, come Adobe Photoshop.

Esempio pratico: 2000 pixel di larghezza e 96 ppp

Vediamo passo per passo come dare a un'immagine dimensioni di 2000 pixel di larghezza e una risoluzione di 96 ppp. Nell'esempio usiamo Photoshop, ma il procedimento è simile in qualsiasi programma.

Nota: le schermate di Photoshop di questo articolo sono in spagnolo; nella versione italiana trovi le stesse opzioni in Immagine / Dimensione immagine.

Passo 1: fai una copia dell'immagine originale, così potrai recuperarla in qualsiasi momento.

Passo 2: apri la copia nel tuo programma di fotoritocco.

Passo 3: nella barra superiore di Photoshop vai su Immagine / Dimensione immagine. Si apre una finestra in cui devi guardare questi dati:

  • Larghezza (in pixel).

  • Altezza (in pixel).

  • Risoluzione (in pixel/pollice).

Nel nostro esempio l'immagine di partenza ha questi valori:

  • Larghezza: 11218 pixel.

  • Altezza: 7482 pixel.

  • Risoluzione: 100 pixel/pollice.

Come abbiamo visto, i valori ottimali per il web sono 2000 pixel sul lato lungo e 96 ppp. Se carichi questa immagine così com'è, caricherai una foto eccessivamente grande che alla fine si vedrà come una di dimensioni e risoluzione minori.

Passo 4: cambia il valore più grande (la larghezza) in 2000. L'altezza si adatta automaticamente:

  • Larghezza: 2000 pixel.

  • Altezza: 1334 pixel.

  • Risoluzione: 100 pixel/pollice.

Ora le dimensioni sono corrette, ma la risoluzione è ancora la stessa. Clicca su OK per salvare le modifiche.

Passo 5: torna su Immagine / Dimensione immagine, cambia la risoluzione in 96 ppp e clicca su OK.

Prima di chiudere il programma, ricordati di salvare le modifiche.

Altri articoli utili

Hai ricevuto la risposta alla tua domanda?