Testare il nostro blog su browser diversi tramite Browsershots


L'altro giorno mi ero deciso a dare un look migliore al blog, e dal sito di Dzelque Blogger Templates ho scaricato un template che mi ero piaciuto, il nuDzelque. Mi sono messo lì a personalizzarlo e sistemarlo, con non poca fatica (tutti sappiamo cosa significhi scaricare un nuovo template per Blogspot: addio widgets e personalizzazioni varie). Solo il giorno dopo, per puro caso, un collega mi faceva notare che nel mio blog non si riusciva a capire niente, era tutto sballato.


Il problema era che il collega utilizza Internet Explorer 6, mentre io avevo visualizzato il blog con Flock a casa e con Internet Explorer 7 al lavoro. Sebbene su questi due il template non aveva problemi, con la vecchia versione di Explorer (e anche la più diffusa delle due) il template veniva visualizzato male.

Sono subito corso allora a cambiare template, ho scelto Ilike di Dzelque e l'ho testato anche con IE6: tutto a posto. Però per un giorno intero chiunque sia entrato nel mio blog col precedente browser di Microsoft avrà visto una serie scoordinata di cubettoni colorati, e non solo: ho dovuto risistemare tutti i widgets di nuovo.

Solo dopo ho scoperto un sito che risolve problemi di questo tipo: Browsershots.



Su Browsershots è possibile inserire l'indirizzo del proprio blog e scegliere una serie di browser su cui si vuole testarlo. Dopo aver premuto il pulsante "submit", si viene indirizzati su una nuova pagina, che ci segnala un certo tempo di attesa, passato il quale potremo aggiornare la pagina (o possiamo conservarci il link e tornarci anche il giorno dopo) e vedremo le immagini di come appare il nostro blog con tutti i browser selezionati. Magnifico!

Possiamo selezionare i browser più diffusi dei principali sistemi operativi e anche su quale risoluzione vogliamo effettuare il test, la profondità di colore, se vogliamo attivare Javascript, Java e Flash. Personalmente non ho toccato queste impostazioni (vanno benissimo così, a meno che non si abbiano esigenze particolari) e ho selezionato le varie versioni di Firefox, Opera, Internet Explorer, Flock e Safari per i vari sistemi operativi (sono quelli più diffusi e non sceglierli tutti farà durare meno l'intero processo) escludendo gli altri.

E' possibile utilizzare il servizio (disponibile anche in italiano) una volta al giorno gratuitamente, tuttavia è anche possibile registrarsi per 10 dollari e così facendo non avremo più lunghe attese ma risultati immediati.

Da mettere subito tra i favoriti!
Condividi su Facebook, Twitter o Google Buzz:
Condividi su Facebook Condividi su Twitter Pubblica su Google Buzz

Per ricevere direttamente in posta i nuovi articoli, inserisci il tuo indirizzo email:
oppure puoi iscriverti al feed per tenerti sempre aggiornato sui nuovi contenuti del blog!
Per maggiori informazioni sui feed, clicca qui!

7 commenti:

Andrea Walter ha detto...

Ciao, ti racconto che un po di tempo fa ho creato un blog a un mio amico fotografo argentino,
il blog e relativo template incriminato è questo:
http://enfocofotografiaprofesional.blogspot.com/

l'ho creato partendo da un template trovato in rete! il template si chiama: minimalistanegro e lo si può trovare al seguente indirizzo:
http://blogandweb.com/2007/05/15/plantilla-blogy-minimalistanegro/

Quando l'ho messo in rete per il mio amico lo stavo visualizzando con netscape 9 e si vedeva tutto perfetto!! però il mio amico fotografo usando internet explorer 6 ha notato che i post venivano allineati un po malamente alla sinistra.
Da qui ho provato a veder cosa succede andando nel codice del template, ho trovato la stringa:

#main-wrapper {
padding-bottom: 0px;
}

e ho provato ad aagiungere un margin-left così:

#main-wrapper {
margin-left: 39px;
padding-bottom: 0px;

Ebbene, adesso il fotografo è tutto contento perchè sul suo internet explorer6 lui vede tutto perfettamente centrato, però il problema si è invertito e chi adesso entra con netscape o simili vede tutto spostato un po' a destra.

Riassumendo:

PRIMA
c'era la stringa:

#main-wrapper {
padding-bottom: 0px;
}

e si vedeva bene centrato su netscape 9 e spostato a sinistra su internet explorer6

DOPO
aggiunto un margin così:

#main-wrapper {
margin-left: 39px;
padding-bottom: 0px;

e adesso si vede bene centrato su internet explorer6 e spostato un po' a destra su netscape 9.

Il problema più grosso è che questo fotografo è molto contento di come sta realizzando il blog e mi ha detto che a giorni lo vuol presentare a un forum di fotografia del quale tra l'altro anch'io sono iscritto. oddio!!! adesso lui è convinto che è tutto perfetto ma non è così!
cosa posso fare a questo punto!?
c'è qualche rimedio per far si che si veda uguale su nescape, e internet explorer?

Ciao a tutti e grazie

Tenebrae ha detto...

ciao andrea :)

complimenti per la riuscita dell'intervento, e grazie per avermene parlato, potrebbe servirmi in futuro

per il tuo amico, beh se si vede male solo su netscape il problema non si pone, netscape non lo usa praticamente più nessuno tant'è è stato abbandonato perfino dagli sviluppatori (che peccato però)

a quel che so netscape ha qualche problema con gli stili di formattazione, ma sinceramente è un browser che ormai sconosco totalmente

diciamo che i browser su cui fare i test sono sicuramente ie6 e ie7, firefox 2 e 3, e al limite opera 8/9 o e safari...

ANhIMA ha detto...

:)]
Scusami parlavo col mio commercialista per il tuo bonifico.. 2000 € per adesso vanno bene?

Ok, a parte gli scherzi ti ringrazio anche per questa segnalazione e scusa se non ho usato il "cerca" dal tuo sito. Mi sento più sereno se mi rispondi :D almeno poi ti ringrazio nè?

.... :)]

ANhIMA ha detto...

...e un peccato vedere l'assenza totale di commenti su di un post per un sito di primaria importanza come questo rispetto ad uno sulle scitte glitterate e ai pesci che volano. Questo fa riflettere.. ma va bene cosi...

Tenebrae ha detto...

@paolo: è vero il post è essenziale, ma questo è il secondo di questo blog, ancora non avevo lettori nè l'audience di oggi :)

un Blogger qualunque ha detto...

scusa questo articolo se lo sono copiato uguale qui

http://blog-htmlblog.blogspot.com/2009/02/testare-il-nostro-blog-su-browser.html

mi sembrava giusto comunicartelo ciao

Tenebrae ha detto...

@mago: ahahah bellissimo =)) grazie della segnalazione mago, mi vengono spesso segnalati post copiati... che dire, il fatto che i lettori vengano a farmelo notare come te fanno capire come sia ridicolo il tutto.


Prima di lasciare un commento, leggete qui

Posta un commento

Nota. Solo i membri di questo blog possono postare un commento.