Velocizzato il caricamento delle pagine – Parte 1


Deprecated: Function get_magic_quotes_gpc() is deprecated in /web/htdocs/www.trackarena.com/home/blog/wp-includes/formatting.php on line 4371
Velocizzato il caricamento delle pagine – Parte 1

La parte più difficile del creare un sito non è tanto farlo bello, ma renderlo accessibile e facile da usare. Uno dei parametri per stabilire la bontà di un sito è infatti la velocità di caricamento delle pagine.

Lo ammetto, atletipercaso.net pecca un po’ in questo, poiché come ho già detto è un lavoro complicato e minuzioso che richiede tempo (cosa che al momento mi manca).

Quindi ho deciso di dedicarmici “a puntate”, migliorando le cose un po’ per volta.

Uno dei passi più semplici da effettuare è alleggerire le immagini presenti nel sito, in modo che al browser serva meno tempo per caricarle. Per fare questo ho scaricato un plugin per WordPress, Bulk WP Smush.it, che utilizza il servizio gratuito di compressione immagini messo a disposizione da Yahoo!.

Un altro plugin che ho usato è W3 Total Cahce, che ottimizza l’utilizzo della cache del browser.

Per testare la velocità ho usato l’utilissimo PageSpeed Insights di Google. Inserendo l’URL di una pagina e premendo invio Google analizza a fondo il codice della pagina e restituisce un valore compreso tra 1 e 100 dove 100 significa che non si può fare nient’altro per migliorare. La cosa bella però è che oltre al punteggio ti dice anche cosa c’è che non va e come sistemarlo. Grazie BigG!

Ho effettuato le analisi sui tre tipi principali di pagine del sito, cioè la Home Page, un articolo e la pagina di una manifestazione della sezione Gare.

velocitahome1

velocitaarticolo1

velocitagara1

Come si può vedere i risultati non sono ancora buoni, ma con l’applicazione di questi due piccoli trucchetti è stato guadagnato comunque dal 10% al 20% nel punteggio. La pagina che ha risposto meglio è stata quella della Manifestazione, ma è importante migliorare soprattutto sulla pagina degli Articoli, dato che è quella più richiesta.

Ma questo nella prossima puntata.

Ottimizzata la condivisione sui social network


Deprecated: Function get_magic_quotes_gpc() is deprecated in /web/htdocs/www.trackarena.com/home/blog/wp-includes/formatting.php on line 4371
Ottimizzata la condivisione sui social network

Vi sarà capitato qualche volta di provare a condividere qualcosa su Facebook e di ottenere un semplice link al posto di un’anteprima della pagina da condividere con immagine, titolo e estratto del contenuto.

facebookerrore

E’ irritante vero? Da oggi però non vi succederà più, almeno con atletipercaso.net .

Abbiamo migliorato infatti la lettura delle pagine del sito da parte di Facebook aggiungendo i meta tag per Open Graph, un linguaggio creato dagli sviluppatori del social network più grande del mondo per migliorare l’estrazione di informazioni dalle pagine web.

In particolare abbiamo inserito i tag og:title, og:description e og:image, i tre che servivano proprio a Facebook per gestire la condivisivione. Mentre il titolo e la descrizione spesso venivano riconosciuti automaticamente, per il social network risultava difficile scegliere l’immagine di anteprima tra tutte quelle presenti nella pagina, portandolo quindi spesso ad attribuire una immagine che poco c’entrava con il contenuto. Abbiamo fatto in modo inoltre che l’immagine del link condiviso sia più grande rispetto a prima, con un effetto grafico decisamente migliore e più accattivante.

facebookcondivisione

Abbiamo eseguito un’operazione simile anche per Twitter e Google, nonostante non ci fossero errori evidenti.

Su Twitter abbiamo abilitato una funzionalità introdotta da poco, le Card. Questo strumento permette ai siti di far comparire un’anteprima dei propri contenuti sotto il tweet quando qualcuno li condivide con i suoi follower.

Questa volta sono stati molti di più i tag che abbiamo dovuto aggiungere, per un risultato però indubbiamente migliore. Infatti oltre a titolo, contenuto e immagine dell’articolo nell’anteprima compaiono anche i link ai profili twitter del sito e dell’autore dell’articolo.

twittercard

Per quanto riguarda Google+ invece, il social network di Google, non abbiamo dovuto aggiungere nuovi tag visto che riconosce automaticamente quelli di Facebook. Tuttavia visto che c’eravamo abbiamo migliorato la comparsa nel sito nei risultati di ricerca.

Stavolta l’operazione è stata più delicata perchè ho dovuto fare in modo che accanto al titolo dell’articolo, alla data e all’autore, compaian dei piccoli pezzi di codice che i visitatori del sito non vedono, ma che servono al motore di ricerca ad organizzare i contenuti.

Ora se tra i risultati di una ricerca su Big G compare un articolo di atletipercaso.net sotto il titolo viene mostrato il nome dell’autore con il link al suo profilo di Google+.

googlericerca

Se avete domande su qualcosa in particolare o se avete riscontrato un problema sul sito segnalatecelo in un commento qui sotto, saremo contenti di rispondervi!