COnsigli su DISPLAY e VISIBILITY

[z.cristiano]

Buon pomeriggio..
secondo voi, se facessi un DIV con dentro un'immagine che pesa 1 MB e metto un codice css "display:none;" cosa succede, la pagina diventa vuota e non carica lo stesso immagine di 1 MB?

Perchè ho letto che DISPLAY:NONE gli elementi sono nascosti e non caricano, mentre il codice VISIBILITY gli elementi sono nascosti ma caricano lo stesso.

Giusto?

[fcaldera]

Buon pomeriggio..
secondo voi, se facessi un DIV con dentro un'immagine che pesa 1 MB e metto un codice css "display:none;" cosa succede, la pagina diventa vuota e non carica lo stesso immagine di 1 MB?

Perchè ho letto che DISPLAY:NONE gli elementi sono nascosti e non caricano, mentre il codice VISIBILITY gli elementi sono nascosti ma caricano lo stesso.

Giusto?

no, in entrambi i casi se stai usando un elemento <img /> questo sarà caricato sempre anche se nascosto.

Diverso invece il discorso se si parla di una immagine di sfondo (background)

guarda http://timkadlec.com/2012/04/media-q...ading-results/

[z.cristiano]

Ah ok..
Allora mi consigli una cosa?

Siccome sto studiando bene il RESPONSIVE che praticamente, se vedo un sito sviluppato per la visualizzazione DESKTOP e RESPONSIVE che praticamente, sul desktop vedo tanti immagini e restringendo o andando a vedere sui smartphone, alcuni immagini vengono nascosti però caricano lo stesso, non c'è un modo che le immagini o il contenuto facendo il responsive vengano nascosti senza caricare...

[fcaldera]

Non ho capito quando dici "alcuni immagini vengono nascosti però caricano lo stesso"

Nel RWD le immagini vengono caricate o come background (attraverso mediaqueries per larghezze di viewport diverse) oppure come elementi di primo piano (attraverso gli attributi srcset e sizes)

Credo sia meglio che tu faccia un esempio puntuale e preciso da vedere: meglio se su un tuo codice minimale postato su codepen / dabblet / jsfiddle

[z.cristiano]

Allora, ti faccio esempi, una pagina con 2 DIV:
- 1 DIV contiene un'immagine di 1 MB
- 2 DIV il testo LOREM IPSUM

Se vado direttamente a questa pagina sul computer e vedo solo il 1 DIV e 2 DIV, poi se vado a vedere sull smartphone, vedo solo il 2 DIV (testo) significa che il 1 DIV è nascosto, unica cosa che ti chiedevo prima è che se sul smartphone mi fa vedere solo il 2 DIV e il 1 DIV è nascoto ma consuma lo stesso 1 MB per immagine nascosto..

VOlevo dirti che esiste un modo che l'immagine, anche se nascosto, per la versione smartphone non deve caricare l'immagine perchè non è visibile.

Ma mi consigli anche un'altra cosa, fare un sito univoco (versioen desktop e responsive) con alcuni elementi nascosti per desktop e responsive consuma internet e allora, ho pensato di fare due siti separati ossia un sito per la versione DESKTOP e un sito per la versione RESPONSIVE (smartphone) così evita di non consumare troppo per gli elementi nascosti.

Che dici?