E’ autunno
09/28/2011Come foglie dai rami, cadono interi blocchi di CSS. Il tema si schiarisce, come coperto da un manto nevoso, i dettagli vengono nascosti, è tutto bianco e ovattato. Ti piace? A me sì.
Just another blog… si, lo tengo così
Come foglie dai rami, cadono interi blocchi di CSS. Il tema si schiarisce, come coperto da un manto nevoso, i dettagli vengono nascosti, è tutto bianco e ovattato. Ti piace? A me sì.
L’estate (ma anche la tarda primavera) è quel periodo dell’anno in cui i post si bloccano tra testa e tastiera. Ho così tanta roba, ormai avariata, nelle bozze che se si legge il blog abbastanza vicini al monitor si sente odore di marcio.
Una delle mie [tante?] sclerosi è quella di controllare ogni post con il W3 Validation Service: quella scritta in verde con scritto “Passed” ha un fascino tremendo, per me. A parte i banali errori di scrittura del codice HTML, trovo che la parte più complicata sia far digerire i video incorporati nei post. Per quanto riguarda Youtube, il lavoro sporco viene fatto in maniera egregia dal plugin Youtube Embed, ma proprio oggi mi sono imbattuto nella necessità di incorporare un video ospitato da Flickr, il cui codice HTML generato dava una caterva di errori.
Ecco il codice:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 | <object type="application/x-shockwave-flash" width="400" height="225" data="http://www.flickr.com/apps/video/stewart.swf?v=71377" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"> <param name="flashvars" value="intl_lang=en-us&photo_secret=f3b289763a&photo_id=5253540794"> </param> <param name="movie" value="http://www.flickr.com/apps/video/stewart.swf?v=71377"> </param> <param name="bgcolor" value="#000000"> </param> <param name="allowFullScreen" value="true"> </param> <embed type="application/x-shockwave-flash" src="http://www.flickr.com/apps/video/stewart.swf?v=71377" bgcolor="#000000" allowfullscreen="true" flashvars="intl_lang=en-us&photo_secret=f3b289763a&photo_id=5253540794" height="225" width="400"> </embed> </object> |
Questo che segue, invece, è il codice W3C compliant generato dal plugin di cui parlavo più sopra:
1 2 3 4 5 6 7 8 9 10 11 | <object type="application/x-shockwave-flash" data="http://www.youtube.com/v/tLIpL26ztFo&fs=0&rel=0&autoplay=0&loop=0&egm=0&border=0&color1=0x2b405b&color2=0x6b8ab6&hd=1&showsearch=1&showinfo=1&iv_load_policy=1&cc_load_policy=0" width="425" height="355"> <param name="movie" value="http://www.youtube.com/v/tLIpL26ztFo&fs=0&rel=0&autoplay=0&loop=0&egm=0&border=0&color1=0x2b405b&color2=0x6b8ab6&hd=1&showsearch=1&showinfo=1&iv_load_policy=1&cc_load_policy=0" /> <param name="wmode" value="transparent" /> </object> |
Ho preso come spunto il codice qui sopra e l’ho riadattato per il video di Flickr, in questo modo:
1 2 3 4 5 6 7 8 9 10 11 12 | <object type="application/x-shockwave-flash" data="http://www.flickr.com/apps/video/stewart.swf?v=71377" width="490" height="280"> <param name="movie" value="http://www.flickr.com/apps/video/stewart.swf?v=71377" /> <param name="flashvars" value="intl_lang=en-us&photo_secret=f3b289763a&photo_id=5253540794&flickr_show_info_box=true&hd_default=false" /> </object> |
Il W3C Validator ha gradito il cambiamento: “Passed”.
Il codice funziona su Firefox, Safari, Chrome, Opera, ma NON su Internet Explorer, che strano. Ci lavoro un altro po’ e vedo di sistemare anche IE. e Internet Explorer [EDIT: funziona anche con questo browser].
Mi avanzava uno spazietto nella sidebar, e così tra un About e un Perché le foto ho aggiunto l’n-esimo servizio, Flavors.me. Carino, forse di poca utilità, un veloce colpo d’occhio sui miei stream online.
A dispetto di quello che ho detto in un post precedente sono ritornato sui miei passi e ho deciso di concedere un’altra chance a Disqus, soprattutto grazie alla testimonianza positiva di Alex [in questo post, in fondo, ci sono le reactions, e contengono cose interessanti]. Nella discussione è emerso un rallentamento delle prestazioni del sito dovuto all’introduzione di Disqus, e quindi ho pensato di eseguire prima delle modifiche un paio di test per avere una idea del livello di velocità del blog, usando sia YSlow che Page Speed, entrambi plugin per Firebug. Dopodiché ho installato il plugin per WordPress che si occupa del caching delle pagine [e non solo], W3 Total Cache. Una volta attivato il plugin e rieseguiti i test, questi ultimi hanno riportato un rallentamento probabilmente dovuto alle basse performance disco del mio hosting, considerato che la cache degli oggetti interessati è fatta su disco [ma il plugin prevede altri metodi]: ho quindi limitato l’azione del plugin ai file JS e CSS. Sono poi passato a Disqus, installandolo e configurandolo seguendo le indicazioni, e da questo punto di vista nulla da dire; note a margine: a] per vedere apparire le reactions di FF ai post ho dovuto attendere circa una ventina di ore, tempo necessario a Disqus per fare il crawling dei dati da Backtype; b] i commenti non vengono importati nel blog [nelle impostazioni è disponibile una operazione manuale di sync da Disqus al blog, ma non l'ho fatta], ma nel caso del singolo post appaiono in una area al di sotto della classica form per inserire un commento, mentre nella home del blog viene mostrato il conteggio di commenti e di reactions [non i like]. Ora sono dunque un utente di Disqus e potete vederlo in tutto il suo splendore poco più sotto. Una nota relativa al tuning, che magari potrà risultare banale, ma meglio dirla una volta in più che una in meno: se volete far viaggiare più veloce il vostro sito disattivate o eliminate tutti i plugin che non sono in uso. Infatti l’aumento di prestazioni che ho riscontrato si divide più o meno a metà tra la disattivazione del plugin e W3 Total Cache. Chiudo segnalando che ora il blog lo tengo sotto controllo da qui, servizio che ho scoperto usando Page Speed. Dimenticavo, questa non vuole essere una guida esaustiva al tuning del blog, è solo un riportare la mia esperienza al riguardo.