Salve, vorrei realizzare un sistema in cui l'utente carica foto e queste vengono salvate in un database e poi mostrate in una pagina. Le foto vorrei che fossero mostrate con larghezza standard, mentre l'altezza in modo che rispetti le proporzioni dell'immagine originale, ma che non sia nè troppo alta nè troppo bassa (all'incirca uguale alla larghezza, oppure un po' più alta ad esempio se l'immagine originale aveva altezza maggiore della larghezza).
In generale, come mi consigliate di muovermi? Fare un resize prima di inserire l'immagine nel database, oppure in fase di visualizzazione? E in questo caso, mi conviene utilizzare il tag <img> oppure un <div> con background-image e magari cover?
Grazie
Come ti hanno già detto, non mettere le foto sul database, prendono non solo spazio, ma ti ritrovi a scaricare da due server, uno Apache per il Web ed uno MySQL ( o altro simile ) dove viene fatta una richiesta non per pochi chilobyte, ma per qualche decina o centinaia, solo per far vedere una foto che poi va elaborata per mostrarla.
Meglio un link alla foto memorizzata nel disco fisso del sito.
A prescindere poi, se uno posta una foto alta il doppio della larghezza, che fai? La tagli?
Normalmente le applicazioni come Pinterest, Instagram ecc. fanno vedere le foto come se le vedessi dal buco della serratura, ovvero sono dentro una griglia genericamente a griglia fissa, con overflow fissato a hidden, così che ciò che è fuori non si vede.
Poi ci clicchi su e apri la foto intera, la foto sempre intera, se no chi la inserisce protesta perché gliel'hai tagliata in modo arbitrario.
Sulla dimensione fisica invece dipende da che disponibilità hai tu di server. Tieni presente che:
- le foto mangiano tantissima banda e più ce ne sono e peggio è;
- per il motivo di cui sopra vanno sempre ridotte in risoluzione e non lasciate di 250kb tanto ho la fibra;
- chi usa un telefonino per guardare il tuo sito, non sempre ha un 4G a piena potenza, anzi praticamente mai nemmeno in centro a Milano, scaricarsi dieci foto da 250Kb significa mangiarsi due mega e mezza di banda solo su quella pagina, più il resto.
Per mostrare le foto in stile album di Facebook o Pinterest, cercati la tecnica chiamata Mansory.