mercoledì 22 maggio 2013

Ottimizzare le prestazioni di un web server con nginx


I tempi di caricamento di un sito web sono essenziali per offrire un servizio di qualità ai visitatori. Il web server gioca un ruolo fondamentale ed è per questo che va ottimizzato in maniera opportuna.

Nel caso si utilizzi il web server Apache esistono molte strategie per configurarlo in maniera ottimale, inoltre è anche possibile affiancarlo o addirittura sostituirlo con un web server alternativo dalle prestazioni molto elevate: nginx.

Nginx come web server

Nginx può sostituire completamente apache e grazie al supporto per PHP (tramite FastCGI) riesce a gestire siti dinamici in PHP senza grossi problemi, le prestazioni però non sono molto diverse da Apache.

Transparent reverse proxy con nginx

Nginx è invece usato molto più spesso come reverse proxy server, è infatti proprio questo il suo uso originale. Si tratta di un sistema efficace per aumentare le prestazioni di un sito web. Un reverse proxy trasparente agli utenti fornisce ai visitatori di un sito le risorse statiche con un impatto minimo sulle risorse hardware del server.

La configurazione classica è quella che vede un server con Apache che si occupa di generare i contenuto dinamici, ed un secondo server con Nginx configurato come "ponte" tra i visitatori ed il web server.

Ottimizzare l'applicazione prima del server

In ogni caso, quando si ha una applicazione web dinamica, sia essa sviluppata in PHP, java o in un altro linguaggio, il primo punto dove si deve intervenire per migliorarne le prestazioni è proprio l'applicazione stessa.

Spesso infatti la lentezza di caricamento ed esecuzione del codice dipende da una programmazione poco attenta o comunque non orientata alle prestazioni del sistema.

Paginazione, caching ed algoritmi efficienti sono solo alcuni dei tasselli fondamentali per ottenere applicazioni e siti web veloci.

sabato 18 maggio 2013

Compressione codice HTML per aumentare la velocità di un sito?

La compressione del codice sorgente HTML delle pagine di un sito web può servire realmente alla riduzione dei tempi di caricamento?

In linea teorica sì: riducendo i caratteri che compongono una pagina si trasmettono meno dati e di conseguenza si riducono i tempi. In pratica non sempre è così. Se il web server utilizza la compressione dei dati con ad esempio gzip/deflate ecc, i benefici sono impercettibili, addirittura a volte una ottimizzazione preventiva del codice HTML potrebbe ridurre l'efficacia della compressione effettuata dal web server.

L'ottimizzazione, o meglio, compattazione, del codice HTML riduce gli spazi ridondanti, gli "a capo" ed altri eventuali caratteri che sono superflui nel rendering della pagina.

Solitamente questa operazione si svolge attraverso delle espressioni regolari (regexp) che pre-processano il codice. A questo proposito si deve quindi segnalare che l'attività di compattazione, ammesso che ciò non influisca negativamente sulla compressione, richiede un certo tempo e risorse per essere eseguita.

Pertanto conviene svolgere dei test per evitare di rallentare il tempo di caricamento delle pagine anziché velocizzarlo. Solitamente si cerca di non effettuare questo tipo di operazione a runtime ma si preferisce memorizzare il codice compattato in sistemi di caching.

Infine si deve prestare attenzione all'eventuale presenza di codice JavaScript inline che potrebbe essere influenzato dagli algoritmi di compattazione.

Anche il codice presente all'interno di blocchi pre-formattati potrebbe smettere di essere renderizzato correttamente.

In linea di massima la compattazione del codice HTML non va considerata come un intervento essenziale per ottimizzare le prestazioni di un sito web e va applicata stando attenti a tutti i possibili rischi.

Se si utilizza un CMS per la generazione del markup si può preferire di ottimizzare le funzioni di generale del codice agendo solo dove serve, perlomeno per una questione di eleganza :-)

In ogni caso per ridurre i tempi di caricamento delle pagine che compongono un sito web è consigliato intervenire per prima cosa nella compressione delle immagini, nell'ottimizzazione del codice JavaScript e CSS ed eventualmente introducendo sistemi di caching.

giovedì 16 maggio 2013

Nuova grafica per Google+ in occasione del Google I/O 2013

È da qualche anno che l'evento Google I/O è l'occasione per Google di presentare novità non solo agli sviluppatori ed agli operatori del settore, ma anche ad un pubblico più ampio.

Oggi, tra le varie cose, abbiamo visto l'introduzione della nuova grafica del social Google+.

Il nuovo layout di Google+ per i PC riprende l'impaginazione che già da un po' di tempo si trovava nell'app per Android.

Visualizzazione dei post tramite griglia "responsive"

La caratteristica più evidente è l'utilizzo dell'area visibile dello schermo come "bacheca" dove i post sono inseriti su più colonne, ad esempio come fa Pinterest.

Questo modo di presentare le informazioni è di moda già da un po' di tempo ed è spesso associato allo sviluppo responsive dei siti web in quanto restringendo o allargando le dimensioni del browser gli elementi si reimpaginano con effetti grafici anche piacevoli.

Sul web, e soprattutto proprio su Google+, gli esperti e gli appassionati stanno già lodando o criticando questo nuovo modo di visualizzare i post.

Alcuni si lamentano della presenza di troppe scrollbar, anche se forse dipende dal browser o da alcuni casi particolari in quanto non ho ancora riscontrato il problema, altri invece trovano l'aspetto grafico decisamente migliorato.

Usabilità e leggibilità della nuova interfaccia

Dal mio punto di vista posso dire che le grafiche proposte nei servizi di Google sono sempre molto curate anche se in alcune situazioni l'usabilità viene un po' meno.

Affiancare in questo modo i post potrebbe infatti rendere più difficoltosa la scansione degli elementi in quanto l'occhio deve zigzagare per seguire l'inizio dei post che non hanno tutti la stessa lunghezza.

Allo stesso tempo però questo non è poi un grosso problema perché enfatizza l'aspetto social e incentiva la creazione di post appariscenti per richiamare l'attenzione.

Va infine segnalato che è possibile ripristinare la visualizzazione verticale dei post cliccando nel menu "Altro" e selezionando la tipologia di layout.

Gli altri dettagli grafici del nuovo Google+

Molti dettagli grafici sono stati ridisegnati, come ad esempio la finestra di chat, l'elenco laterale dei contatti, il menu di navigazione delle sezioni e l'intestazione della pagina con i filtri e le opzioni di navigazione. Le modifiche grafiche rispetto alla precedente versione di Google+ sono praticamente in ogni angolo.

Ad esempio mi piace molto l'animazione che mette in evidenza il riquadro per inserire un nuovo post:

Google+ Maggio 2013: interfaccia inserimento nuovo post


La gestione degli hashtag e Google Hangout


Oltre all'aspetto grafico generale, il nuovo Google+ ha delle nuove funzionalità decisamente interessanti. Ad esempio è stato aggiunto un meccanismo automatico per la gestione degli hashtag ed anche Google Hangout è stato completamente rinnovato. Questi argomenti meritano degli approfondimenti separati in quanto oltre all'aspetto tecnologico hanno dei risvolti social da non sottovalutare.

A voi il nuovo Google+ piace?


I blogger stanno già scrivendo post sulle qualità e sui difetti di Google+, sul nuovo hangout e sulle altre novità del social.

Ed a voi piace la nuova grafica di Google+ e le nuove funzionalità?

lunedì 13 maggio 2013

I mercati non sono tutti uguali

Quando si pianifica una attività di marketing vanno analizzati e studiati diversi aspetti che coinvolgono la tipologia di clienti che possono essere interessati al prodotto in vendita.

I potenziali acquirenti di un prodotto o di un servizio si possono differenziare in base al sesso, all'età ed alla provenienza geografica, tutti fattori che influenzano il processo decisionale e di conseguenza l'approccio della campagna promozionale, il packaging, i messaggi trasmessi e così via.

Poter vendere dei prodotti in una determinata area geografica è molto utile studiare usi, costumi ed eventuali competitor presenti nella zona.

Da questa analisi si potrebbero evidenziare dettagli significativi ed a volte inaspettati.

Se ad esempio si è abituati al mercato italiano e si vuole cominciare a proporre i propri prodotti in stati orientali, sarà necessario utilizzare un modo di comunicare più consono agli usi e costumi del posto.

Credere che il processo di vendita sia sempre uguale è un errore che potrebbe costare caro.

Sul web questo errore si può osservare frequentemente: ad esempio nel caso degli e-commerce si traducono direttamente i contenuti in svariate lingue senza tener conto di questo aspetto.

Allo stesso modo anche una campagna pay-per-click può soffrire dello stesso problema

Immagini, testi, convenzioni grafiche e tipografiche sono tutti dettagli che possono fare la differenza nella conversione dei visitatori in reali acquirenti.

venerdì 3 maggio 2013

Riflessione sui siti web responsive

Nella progettazione e nella creazione di siti web responsive (ovvero quei siti che sono in grado di adattarsi ai dispositivi tablet e smartphone) ci sono molti aspetti da considerare e che invece spesso vengono trascurati.

Ad esempio anche le prestazioni di un sito web responsive dovrebbero essere ottimizzate in base alla piattaforma in cui sono caricati.

Spesso infatti accade che i siti web responsivi hanno lo stesso peso in KB sia quando sono caricati da un normale PC, sia quando sono caricati da un dispositivo mobile.

Esistono però delle metodologie che permettono di caricare in maniera condizionale le risorse di una pagina web. Ad esempio si può utilizzare del codice JavaScript per caricare CSS e JS per risoluzioni e browser specifici (vedi l'articolo su Conditionizr). Oppure si possono adottare tecniche come l'Adaptive Images che permette di offrire le immagini in più versioni ridimensionate.

Queste ottimizzazioni dovrebbero essere valutate ed implementate nei siti web responsive in modo da offrire il massimo delle prestazioni che, come ben sappiamo, sono molto importanti per migliorare l'usabilità di un sito web ed anche le sue performance di posizionamento.