2011-02-07 4 views
5

Sto riscontrando un piccolo problema qui. Sono un esperto di sviluppo web e attualmente sto costruendo questo sito per un progetto che devo fare. Volevo farlo sembrare carino con un'immagine di sfondo. Ho creato l'immagine in Photoshop e l'ho salvata sul web come estensione .jpg e ha finito per essere la dimensione 58.8k.Quanto è grande la dimensione delle immagini di sfondo?

Sono tutti per siti web che caricano rapidamente per l'utente, ma mi chiedo se meno di 60k è ok? L'ho controllato sull'estensione di yslow firefox e mi carica in 96 ms (soggetto leggermente scadente - http://www.speedtest.net/result/1146275377.png)

60k è troppo, è una buona pratica avere immagini solo 10-20k? LO ODIO quando vedo un'immagine caricare ... è solo .. non vale nemmeno la grafica in quel punto. C'è un modo più rapido per caricare un'immagine di quella dimensione? CSS o tag? O non dovrei nemmeno preoccuparmene?

risposta

1

La maggior parte dei browser carica l'immagine di sfondo per impostazione predefinita, quindi non dovresti avere problemi.

Quanto grande è troppo grande dipende dalla configurazione dell'hosting, dalla quantità di traffico del sito e dalla tipica velocità di trasferimento dei visitatori.

60k mi sembra ragionevole per un sito medio con non troppi visitatori simultanei. Tuttavia, la larghezza di banda costa denaro e questo è il motivo per cui raramente si vedono immagini di sfondo di quella dimensione su grandi siti. D'altra parte, YouTube trasmette regolarmente video che sono migliaia di volte più grandi dell'immagine di sfondo che proponi. È impossibile dare consigli precisi senza sapere molto di più sul tuo sito, sulla sua soluzione di hosting e sulle sue statistiche di utilizzo.

È probabile che, se stai facendo questa domanda, 60k è perfettamente a posto.

Se si vuole garantire che i carichi di immagini di sfondo prima o l'ultima si può fare:

<script type="text/javascript"> 
bgimage = new Image(); 
bgimage.src = "http://www.olhovsky.com/img/cdf97/256fwt1_eg.png"; 
</script> 

Posto che il codice sopra il tag body per precaricare l'immagine di sfondo. Posizionalo in basso nel documento html per caricarlo in un secondo momento (ad es. Dopo il tag </body> per caricare lo sfondo per ultimo).

E poi nel tag body:

<body onload="document.body.background=bgimage.src;"> 
1

Non credo 60k è troppo grande anche se probabilmente si desidera guardare i vostri utenti probabili e pensare a ciò che i loro velocità di connessione sarà come. Se vuoi provare a ridurre le dimensioni del file il più possibile, prova anche a smushing it e potresti vederlo cadere un po 'oltre.

+0

Mi sono dimenticato di questo! Grazie mille, arrivato a 54.6k! – Phil