Costruire un tema: ottimizzazione del codice.

Per mancanza di tempo, sono passati due mesi dall’ultimo post della serie “Realizziamo un tema per WordPress da zero” riguardo le attenzioni che ho avuto io durante la costruzione del mio nuovo template, così… eccomi di nuovo qui.

Facendo un veloce resoconto, nelle “precedenti puntate” abbiamo parlato di layout, di scelta delle dimensioni e dei colori, abbiamo parlato del testo (dimensioni e lunghezza) e degli effetti speciali che possono essere applicati ad una pagina per renderla più “interattiva” o quanto meno, più al passo con le tendenze del web (qualcuno lo chiama 2.0).

Bene… il passo conclusivo (o quasi) consiste nel mettere insieme tutto ciò che abbiamo imparato in un documento che dovrà esser letto – potenzialmente – dai browser dell’intero pianeta. Ho già parlato delle difficoltà (e dell’importanza) del rendere un tema cross-browser e cioè capace d’esser letto da browser diversi (cellulari, netbook, etc.) ma non dobbiamo neanche dimenticare un ulteriore aspetto delle nostre pagine: l’accessibilità passa anche da un buon codice.

La sintassi di una pagina è paragonabile ai costrutti lessicali di una lingua. “Io posso non  parlerei così”. Ecco. Usare costrutti errati o posizionati erroneamente può portare a difficoltà di interpretazione da parte dei browser tanto quanto vi è venuto difficile capire il senso di quella frase.

Il motore interno del vostro browser web, quando riceve una pagina, analizza prima i tag (che sono le indicazioni della nostra sintassi, per continuare il paragone) e in base a quelli costruisce un DOM in cui posiziona i vari oggetti.

Per capire meglio cosa succede durante il caricamento di una pagina date un’occhiata al seguente video.

Questa operazione prende il nome di reflow di una pagina (quello nel video è il reflow di Gecko per Mozilla.org) e, per via della struttura dell’html, avviene ricorsivamente sempre più in profondità. Da questo si capisce anche perché solitamente su pagine molto pesante e piene di elementi i computer con processore più datato impieghino qualche istante in più nel visualizzare la pagina.

Ecco che la parola chiave di un buon codice diventa ottimizzazione.

L’ottimizzazione, passa per prima cosa, dalla validazione del codice secondo gli standard concordati dal consorzio W3. Avere delle pagine con codice sintatticamente corretto aiuta sicuramente i browser durante il loro compito. E’ vero che i browser più diffusi fanno miracoli e spesso accettano codice non del tutto corretto (ad esempio un tag <div> inserito dentro un tag <a>) ma evitare problemi alla lunga paga.

Inoltre, non dobbiamo dimenticarci dei motori di ricerca. C’è chi dice che internet senza Google sarebbe ancora una grossa e asettica web-directory. Avere una pagina facilmente accessibile agli spider dei motori di ricerca significa ricevere un buon punteggio nelle loro liste di “siti preferiti” (semplificando di molto il discorso) e un buon punteggio si traduce in una buona indicizzazione e… sono poche le persone che costruiscono un sito web senza volere che sia visibile (così come sono poche le persone che usano il balcone per nascondersi!).

Dunque, una regola fondamentale da ricordare è: i motori di ricerca apprezzano pagine leggere, veloci da caricare e sintatticamente corrette.

Questo non mette in secondo piano i contenuti che rimangono l’elemento principale della pagina (figurarsi che possa importare a Google o chi per lui una pagina vuota ma correttissima sintatticamente) ma, a parità di “valore” del contenuto, il contenitore migliore verrà preferito.

Un po’ come quando esco da casa e devo scegliere tra Porsche e Ferrari… (sigh, è una metafora più astratta delle cose di cui stiamo parlando! :-D).

Un altro aspetto da tenere in considerazione è la struttura del codice che pubblichiamo.

I frame ad esempio, sono deprecati e non credo esistano ragioni valide per usarli ormai. Oltre a questo, cerchiamo di pubblicare i contenuti più importanti nella parte più alta del documento, in modo da far si che gli spider gli diano maggiore importanza (com’è giusto che sia). Ovviamente possiamo giocare poi con il posizionamento grafico tramite i fogli di stile.

Realizziamo un header compatto e completo. I motori di ricerca sfruttano quei dati per avere qualche informazione in più ma abusarne non serve a nulla… per questo non facciamo mancare il tag “title” ad esempio ma non abusiamo del metatag “description” perché spesso i motori di ricerca ignorano quelle keyword (che considerano viziate in partenza).

Evitiamo inoltre l’uso smodato di risorse esterne. Caricare contenuti esterni (immagini, javascript, video flash, audio…) rallenta il caricamento della pagina e oltre a non essere apprezzato dai motori di ricerca (Google tramite i webmasters tools vi permette di monitorare il tempo medio di caricamento delle vostre pagine), sicuramente fa perdere la pazienza ai visitatori (che alla fine, rimangono il vostro riferimento). Cerchiamo di ospitare sul nostro hosting il maggior numero possibile di contenuti.

A quest’ultimo aspetto ovviamente si ricollega la scelta dell’hosting che, sicuramente, va fatta anche in considerazione del peso dei contenuti che vogliamo pubblicare.

Un altra piccola attenzione può esser quella di comprimere i fogli di stile e collegarli all’interno del documento come unico file. Per capirci meglio, nel mio blog, il CSS è segnalato al browser tramite un’unica riga:

<link rel="stylesheet" href="//www.dreamsworld.it/emanuele/wp-content/themes/emanuele-theme/style.css" type="text/css" media="screen" />

Il file style.css al suo interno, però, richiama i vari fogli di stile:

@import url("//www.dreamsworld.it/emanuele/wp-content/themes/emanuele-theme/css/main.css");
@import url("//www.dreamsworld.it/emanuele/wp-content/themes/emanuele-theme/css/header.css");
@import url("//www.dreamsworld.it/emanuele/wp-content/themes/emanuele-theme/css/sidebar.css");
@import url("//www.dreamsworld.it/emanuele/wp-content/themes/emanuele-theme/css/footer.css");

Questa scelta, oltre a favorire gli spider (che durante la scansione saltano una riga e non incontrano altre risorse esterne da scartare), favorisce anche la manutenzione del blog. Se volessi cambiare nome o inserire un nuovo foglio di stile, mi basterà effettuare le opportune modifiche dentro style.css senza dovermi ricordare dove l’avevo linkato.

Insomma, tanti piccoli accorgimenti che aiutano a mantenere sotto controllo sia il peso della pagina che la sua struttura.

Voi, avete qualche suggerimento da darmi? 🙂

Emanuele

Ubuntu o Mint?

Dopo aver letto fino in fondo questa discussione, sono quasi tentato dal provare Linux Mint sul mio computer.

E’ una Ubuntu con un tema ripulito (e guardabile!), qualche scorciatoia nei menu in più e qualche altra cosetta carina: gestione software ancora più semplice (a prova di bambino a questo punto immagino!), codec già installati e qualche bug corretto.

Inoltre giusto pochi giorni fa è uscita l’ultima versione.

Perché continuare ad usare Ubuntu? 🙂

Emanuele

Wonderwall…

Today is gonna be the day that they’re gonna throw it back to you…

Inizia così Wonderwall degli Oasis e, a volerla tradurre, questa frase dice: “oggi sarà il giorno in cui ti verrà data di nuovo un’opportunità”.

Forte questa cosa delle opportunità. Sono come tanti treni che vanno e vengono da una stazione ad orari ben precisi.

Testo ritornello: Oasis - WonderwallQualche settimana fa, mentre ero preso da miliardi di preoccupazioni, è “rispuntata” una di quelle cinque ragazze.

Ci siamo visti, ci siam presi un bel gelato e abbiamo parlato un bel po’.

Mi ha detto che nella vita capita di fare errori. Mi ha detto d’esser fidanzata per errore e – rullo di tamburi – di avermi sognato e di continuare a piacerle come quando mesi fa le dissi che potevamo essere amici.

Ecco, sarà che io in questo periodo sono davvero distante da quella zona del mondo chiamata “vita di coppia” e magari nel frattempo qualcosa è cambiata ma certe cose proprio non riesco a capirle.

Gli Oasis, però, sembrano avermi dato la risposta giusta.

Tornando alla canzone infatti, Wonderwall (parola nonsense), significa letteralmente “muro meraviglioso” ma il significato all’interno del testo viene tradotto, correttamente, in “àncora di salvezza”. E’ questo il senso di quella parola all’interno di questa favolosa canzone.

E così, parlando proprio di “ancore di salvezza” mi chiedo come si possa stare con qualcuno che non si ama davvero, che non si sente di volere bene fin nel midollo.

Cavoli. Io posso capire che arrivati a quarantacinque anni, ancora single, si possa pensare di scendere a compromessi se proprio non si vuol passare la vecchiaia soli o che se a sessant’anni ci si accorge di aver sposato l’uomo o la donna sbagliata gli si rimane accanto per amore dei figli ma… come si fa a vivere così nel pieno della propria vita?

Mi hanno detto che c’è gente che fa fatica a viver sola, che senza “il fianco caldo” (bella espressione, non è mia ma m’è piaciuta parecchio!) ha difficoltà ad andare avanti. “Ancore di salvezza”, ecco.

Io ovviamente ero sorpreso da tali avance. Posso aspettarmi una cotta da una persona single (e magari cieca! :-P) ma non da una persona che dovrebbe aver fatto una scelta in modo maturo e deciso.

Ho provato a dirle che aveva da rifletter tanto proprio su questo e sulla sua relazione… lei insisteva però col dire che quelli erano fatti suoi (sacrosanto!), che si trattava di un’errore e che a me doveva importare solo di “me e lei e del futuro”.

A me ‘ste storie però non riescono ad ammaliare. Non soffro vivendo solo (anzi…!).

Puoi essere carina quanto vuoi (e lei lo è… e gliel’ho pure detto!) ma non gira così l’amore nella mia testa. Voglio accanto una persona col coraggio di scegliere. E quando dico scegliere, non intendo tra me e qualcun altro. Quello san farlo tutte (e scelgono sempre l’altro! :-|). Scegliere di amare qualcuno o… star soli finché non si incontra la persona che si avvicina tanto più al nostro ideale.

Avere il coraggio di affrontare il sole e la pioggia senza piangersi addosso. Un po’ come quei maratoneti che nel deserto non pensano mai alle difficoltà… sanno dove vogliono arrivare e niente può fermarli.

Io intanto mi son chiesto perché Dio me l’abbia rimandata. Non so se sia servito per “allietarmi” le giornate che avevano un peso particolare per via dell’infarto di mio padre (nessuna ipocrisia, fa piacere sentirsi dire certe cose!) così mi affido ancóra (oggi si gioca con gli accenti della parola “ancora”) a Lui e lo ringrazio! 🙂

A lei ho detto che in questo periodo forse ci sono già così tante novità che probabilmente è questo che non mi permette di lanciarmi in nuove storie. In fin dei conti ho ancora (…) quel numero di telefono sul cellulare ma quella ragazza non l’ho più vista né sentita… eppure fui io a volerla conoscere inizialmente. Non so se sia stato un semplice test per capire cosa ero in grado di fare o sia stato altro.

Mi è nuovamente passata la voglia? E’ una domanda che da qualche giorno mi faccio e col tempo troverò una risposta.

Intanto si continua a marciare lungo la strada che mi sta facendo impazzire di felicità da *troppi giorni* ormai. E’ così bella che sarebbe da stupidi abbandonarla…

Non so… mi sento un gradino avanti a certi atteggiamenti, a certe visioni così basse dell’Amore. Di prove di maturità ne ho date abbastanza a me stesso e per ora non vedo nessuna coetanea che mi faccia dire “guarda… che persona speciale!” (e, sia chiaro, per persona speciale non intendo una ragazza ricca, colta o chissache’… in fin dei conti anche tra quelle 5 c’è qualche laureata e le altre erano studentesse! Essere belli dentro è una cosa che si sente a pelle e non tramite attestati!).

Prima o poi arriverà, ne son sicuro… e sarà il mio muro meraviglioso. Sarà la persona con la quale sbatterò la testa. Non sarà mai però la mia àncora di salvezza. So benissimo farcela da solo nella vita (che bello saperlo dire ormai…).

Cambiando discorso, ormai l’estate è entrata prepotente. Con quel sole così grande e pacioccone come si può mai esser preoccupati per qualcosa?! :joy:

Emanuele

Errore NO_PUBKEY, errore chiave pubblica su Ubuntu.

Durante gli aggiornamenti, può capitare che manchi qualche chiave pubblica necessaria per autenticare i repository (accade se abbiamo modificato manualmente il file /etc/apt/sources.list).

Errore chiave pubblica repository APT - NO_PUBKEY

W: Errore GPG: http://ppa.launchpad.net jaunty Release: Le seguenti firme non sono state verificate perché la chiave pubblica non è disponibile: NO_PUBKEY 78414460095F1873

Per non impazzire andando alla ricerca della chiave mancante, basta installare ed avviare apt-key-manager presente su Synaptic.

Per rapidità, installiamolo da terminale scrivendo:

sudo apt-get install gui-apt-key

E avviamolo con:

sudo gui-apt-key

APT Key Manager - Gnome GUI

Nella semplicissima interfaccia inseriamo la chiave (nell’esempio sopra è 78414460095F1873) e clicchiamo su Aggiungi.

That’s all folks. 🙂

Emanuele

PS: il software viene posizionato in Applicazioni – Strumenti di sistema – APT Key Manager.

Se plonger dans une photo.

Che poi è bello quando metti una cosa li, una foto, magari di quando eri piccolo e la guardi. E più la guardi, più sei felice. E oggi è così, come quella cosa li, come una foto d’infanzia, una di quelle in cui sei tornato da una lunga corsa e la mamma felice ti sistema un attimo, ti rincalza la magliettina nei pantaloni e ti dice di star fermo. Che poi, diciamolo, star fermi è una cosa che da bambini non riesce mai. Più ti si dice di star fermo e più ti vengono in mente milioni di cose da fare. La palla del tuo compagno a ricreazione, il gatto che hai visto tornando a casa, la sua coda e quella lucertola che invece una volta la coda l’ha persa e si muoveva ancora. E poi le pietre che gli tiravi e magari anche quel gioco in cui dovevi centrare un quadrato descritto da un gessetto trovato per caso e dovevi raggiungerlo saltando prima su un piede e poi su due, a turno e senza superare mai la linea. E quando succedeva iniziavi a chiederti perché. Perché proprio a te, proprio in quella partita. Perché proprio quando stavi andando benissimo. Ed è così che della foto te ne importa sempre meno, neanche la senti la mamma e le sue due parole. Statti fermo. Niente da fare, nella tua testa c’è tanto altro e sembra quasi un acquario in cui i pesciolini hanno sempre un posto nuovo da esplorare. E così tu viaggi, viaggi senza rendertene neanche conto. Torni indietro, avanti e indietro, avanti e indietro. Proprio come l’altalena che nel parco reputavi spettacolare. Ci saresti rimasto altre due ore se non fosse che alle sette la mamma vuole che torni. E poi c’erano le cacche dei cani, e quelle fanno puzza e le eviti sempre e ti chiedi perché i cani debbano farla proprio li, con tutto lo spazio che c’è. E così il tempo passa, e passerà anche questa giornata, iniziata così, con una foto che mi ha fatto viaggiare nel tempo, e poi varie ore di università che mi fanno dondolare tra il presente e il futuro, e poi il mio papà, che andrò a trovare e sarà come tornare nuovamente al momento della foto, in cui, senza papà, non riesci proprio a stare un attimino fermo.

Buona giornata,

Emanuele