Come esportare foto per un portfolio web

Un portfolio deve caricarsi bene e mostrare perché il lavoro merita attenzione. Le texture dei tessuti, le foglie, i cieli uniformi e le sfumature della pelle possono contare più che in una piccola illustrazione. Una miniatura accettabile può deludere in grande.

L’obiettivo sono file che preservano dettagli utili alle reali dimensioni di visione. La guida spiega come scegliere e testare gli export, anche dopo l’elaborazione della piattaforma.

Pianifica per la galleria, non solo per la miniatura

Elenca griglia, progetto, visualizzatore ingrandito e immagine iniziale a piena larghezza. La stessa foto può apparire quadrata in griglia e completa una volta aperta. Una miniatura non fornisce dettagli aggiuntivi per la vista grande.

Leggi le istruzioni prima dei preset. Alcune piattaforme generano più dimensioni; altre mostrano il file originale. Adobe Portfolio conserva la piena risoluzione e genera versioni ridotte. Fonte caricata e file ricevuto dal visitatore vanno controllati separatamente.

Verifica se si può scaricare l’originale. Non caricare un master di stampa perché normalmente viene mostrata una versione ridotta. Il file web deve essere adatto a diventare accessibile tramite il sito.

Trova le dimensioni della vista aperta

1. Parti dal costruttore del sito. Controlla guida gallerie e impostazioni del layout. Cerca larghezza o altezza massima di visualizzazione: il limite di caricamento è diverso.
2. Apri una galleria di prova pubblicata. Usa la finestra più ampia prevista e apri la foto come un visitatore, incluso il visualizzatore. Prova un ritratto, che può essere limitato dall’altezza.
3. Misura solo senza indicazioni utili della piattaforma. Sul computer, clic destro e Ispeziona. Evidenziazione o riquadro layout mostrano i pixel CSS. Misura la foto, non la cornice. Aprire la sorgente in un’altra scheda mostra invece i pixel del file.

Se la misura resta incerta, usa la raccomandazione attuale della piattaforma e prova la vista aperta prima di un preset generale. Serve una base motivata, non una deduzione dalla risoluzione della fotocamera.

Scegli i pixel dal layout

Parti dalle dimensioni maggiori e valuta l’utilità dei pixel extra. Per 1.200 pixel CSS di larghezza, una fonte da 2.400 offre 2× se il sito la serve davvero. Non è una regola di 2.400 pixel per ogni foto.

6.000 × 4.000 ridotto proporzionalmente a 2.400 di larghezza diventa 2.400 × 1.600. A 1.200 × 800 CSS dà due pixel per direzione per ogni pixel CSS. Un ritratto 4.000 × 6.000 con lato lungo 2.400 diventa invece 1.600 × 2.400. Lo stesso lato lungo non dà la stessa larghezza.

Raddoppiare entrambi i lati quadruplica i pixel: 960.000 in 1.200 × 800 contro 3.840.000 in 2.400 × 1.600. Il peso non quadruplica necessariamente, ma trasferimento e decodifica costano di più. Confronta piccolo e 2× nella galleria. Mantieni il dettaglio utile e fornisci versioni ridotte alle viste piccole.

Usa Ridimensiona immagine con proporzioni bloccate per ridurre un export esistente. Ritaglia prima se cambia la composizione. Non deformare un ritratto per riempire uno spazio orizzontale.

Il telefono non dovrebbe scaricare il file massimo per ogni miniatura. Può gestirlo il costruttore; un sito personalizzato può richiedere markup responsive. La guida alle immagini responsive spiega fonte e visualizzazione.

A schermo i pixel contano più dell’etichetta PPI. Un’immagine di 2.400 pixel resta tale cambiando solo i metadati di risoluzione. Per la stampa il rapporto è diverso: vedi DPI, PPI e pixel.

Scegli consapevolmente formato e colori

Parti dal formato supportato

JPG è pratico per foto normali. PNG serve per trasparenza o grafica, ma è spesso troppo pesante per fotografia. WebP e AVIF aiutano con piattaforme compatibili o gestione diretta della distribuzione. La guida MDN ai formati descrive caratteristiche e supporto.

Non convertire tutta la raccolta prima di verificare la pubblicazione. La piattaforma può rifiutare o ricodificare. Confronta il file fornito dalla galleria finale, non solo quello caricato.

Esporta con gestione del colore

Per un portfolio tradizionale a gamma dinamica standard, SDR, sRGB è un punto di partenza pratico. Esporta con un editor che gestisce il colore e incorpora il profilo quando possibile. Convertire i colori in sRGB è diverso dal limitarsi ad assegnare un profilo sRGB a valori preparati in un altro spazio colore. Le FAQ di Adobe sul colore spiegano la gestione del colore in Lightroom.

Gamut ampio e HDR richiedono export e pubblicazione compatibili. Usali intenzionalmente con il supporto della piattaforma. La sola anteprima non stabilisce cosa vedrà il pubblico.

Confronta export e sito sullo stesso dispositivo con pelle o superfici neutre di riferimento. Schermi diversi possono comunque variare. Se la pubblicazione cambia lì i colori, verifica elaborazione e profili prima del ritocco creativo. La guida al colore aiuta.

Trova la compressione con un piccolo campione

La percentuale di qualità non ha lo stesso effetto in ogni esportatore. Controlla un codificatore, non la percentuale di valore artistico o tecnico.

Scegli foto che rendano visibili difetti diversi. Un cielo uniforme rivela bande di colore; capelli, erba e tessuti mostrano la perdita di texture. Le zone scure possono presentare blocchi o rumore impastato. L’architettura evidenzia danni lungo i bordi sottili e molto contrastati. Usa immagini rappresentative del tuo lavoro.

1. Parti dalla stessa fonte modificata. Mantieni dimensioni e colore per variare solo la compressione.
2. Crea due o tre candidati. Su una scala JPG 0–100 prova, per esempio, 75, 85 e 95. Sono punti di test, non raccomandazioni universali.
3. Controlla la foto in due visualizzazioni. Valutala prima alle dimensioni con cui la vedrà il visitatore. Poi esaminala al 100% o in rapporto 1:1 per individuare perdita di texture, blocchi e aloni. Il 100% non equivale ad adattare la foto alla finestra e non implica necessariamente un ingrandimento. Adobe descrive la vista 1:1 di Lightroom come la visualizzazione dei pixel effettivi dell’immagine.
4. Confronta i pesi dopo l’aspetto. Accetta la copia piccola solo se conserva il dettaglio importante. Molta perdita per poco risparmio raramente conviene.
5. Pubblica un test e confronta ancora. L’elaborazione della piattaforma può cambiare il risultato. Verifica griglia, vista aperta e telefono prima della serie.

Non esiste un peso ideale in kilobyte valido per tutte le foto di un portfolio. Una foto di un bosco ricco di dettagli può richiedere più dati di una semplice composizione in studio con le stesse dimensioni. Scegli il file più piccolo che supera il tuo controllo visivo, poi valuta il caricamento dell’intera pagina.

Esempio misurato: una foto, tre export JPG

Abbiamo testato Alpi e Mediterraneo da NASA Earth Observatory. Crediti: NASA/JSC, ISS Crew Earth Observations Facility, immagine ISS073-E-3320. La fonte era già JPG. Ridotta una volta a 2.400 × 1.348, è stata salvata in PNG per partire dagli stessi pixel. PNG non ripristina perdite precedenti.

Il 17 ottobre 2026 abbiamo convertito lo stesso PNG con PNG in JPG di Pixilo a 75, 85 e 95 in Microsoft Edge 155.0.4283.45. Le dimensioni sono rimaste identiche. I numeri valgono per quel codificatore browser, non sono equivalenti Lightroom né garanzie per altre foto.

Ogni dettaglio mostra gli stessi 240 × 160 pixel senza ulteriore ridimensionamento. La pagina può adattare le anteprime allo schermo. Apri i file completi al 100% per il confronto pixel. Osserva creste e texture: valori bassi risparmiano byte ma possono levigarle. Il 95 pesa quasi il doppio dell’85, senza stabilire se il vantaggio conta nella tua galleria.

Puoi scaricare la copia PNG (6.464.084 byte) per ripetere il test. Una foto aerea non determina il valore per ritratti, opere o tutti i paesaggi. Prova immagini rappresentative del tuo lavoro.

Esempio: un preset di export in Lightroom Classic

Supponi una vista massima senza ritaglio di 1.200 × 800 CSS e un originale 6.000 × 4.000. Confronta JPG di 2.400 × 1.600 con una versione piccola. Seleziona la foto e apri File → Export. La documentazione Adobe spiega i pannelli; nomi e opzioni cambiano con versione e lingua.

• File Settings: scegli JPEG e sRGB per l’esempio SDR. Confronta qualità in Lightroom senza copiare valori browser.
• Image Sizing: attiva Resize to Fit e Width & Height. Imposta un riquadro di 2.400 × 1.600 per questa foto orizzontale. La foto vi entra proporzionalmente senza forzare un ritratto. Mantieni Don't Enlarge nei preset usati anche con sorgenti piccole.
• Output Sharpening: confronta disattivato con Sharpen For: Screen, Amount: Standard. Guarda bordi e texture alla misura finale. Riduci o disattiva se compaiono aloni o bordi troppo duri.
• Metadata: conserva descrizioni e copyright necessari, controllando la rimozione di posizione e dati personali.
• Export Location: salva in una cartella web separata con nomi distinti per caricare il candidato controllato.

Carica una versione, controlla la galleria aperta e il telefono, poi salva il preset. Ritratti e miniature possono richiedere altri limiti. Ricontrolla se cambia layout.

Usa Pixilo per i passaggi aggiuntivi utili

Se l’editor dà misura, formato e qualità in un export, parti da lì. Pixilo serve per un’immagine già renderizzata che richiede riduzione, altro ritaglio o confronto di compressione.

Il compressore crea una copia più leggera e Ridimensiona immagine riduce i pixel superflui. Il ridimensionatore accetta JPG, PNG e WebP fino a 25 MB per file. Se la sorgente supera il limite, crea prima una copia ridotta nel tuo editor. Lo sviluppo RAW, la conversione dei profili colore e la nitidezza applicata all’esportazione richiedono un editor che supporti queste operazioni.

Evita export JPG ripetuti. Riunisci le modifiche prima del file finale e confronta sempre la stessa fonte preparata, non ricomprimendo l’ultimo download.

Rivedi metadati, nomi e filigrane

Controlla GPS e dati personali indipendentemente dalla compressione, secondo la guida ai metadati. Con lo strumento filigrana verifica posizione in griglia e ingrandimento. Non distrarre dal lavoro. La filigrana non impedisce copie.

Trova dove cambia la qualità

1. Controlla la fonte modificata. I dettagli mancanti non si ricreano con l’export web.
2. Controlla l’export locale. Se perde texture o aggiunge aloni, rivedi separatamente dimensioni, compressione e nitidezza.
3. Controlla il file della galleria. Se il locale è buono, verifica versione scelta, ritaglio e dimensioni mostrate. Una miniatura ingrandita richiede una soluzione diversa dalla compressione eccessiva.

Cambia uno stadio alla volta. Troppe foto grandi richieste insieme rallentano. Prova una nuova visita e la prima apertura, non solo immagini già caricate.

Controlla la galleria pubblicata

• Miniature e immagini aperte mantengono la composizione voluta.
• Le texture importanti restano visibili senza artefatti fastidiosi in cieli e ombre.
• La vista grande non è una miniatura insufficiente ingrandita.
• I colori risultano coerenti tra export e pubblicazione sullo stesso dispositivo.
• La pagina su telefono si carica in modo fluido senza scaricare il file più grande per ogni miniatura.
• File pubblici e link contengono solo versioni e metadati da condividere.

Domande frequenti

Serve sempre la massima qualità JPG?

No. Il file può crescere molto senza differenze utili alla misura finale. Prova motivi impegnativi e valuta aspetto e risparmio.

Tutte le foto devono avere le stesse dimensioni?

Non necessariamente. Coerenza non significa deformare tutto. Il layout indica quali ritagli uniformare e quali foto devono mantenere proporzioni originali.

L’export web va bene anche per la stampa?

Non darlo per scontato. Stampa e consegna cliente possono richiedere altre misure, colori, metadati e nitidezza. Parti dall’originale secondo le specifiche.