Ottimizzare wordpress per iPhone, Nokia e PDA

Pubblicato da Davide, Aggiornato venerdì 23 gennaio 2009 8 Commenti »

Questo articolo e' stato scritto piu' di 6 mesi fa.. In teoria non cambia nulla, sed panta rei: se trovi link o informazioni datate segnalalo pure. :)

I dati di Google Analytics parlano chiaro, sempre più spesso si ricevono visite da dispositivi mobili: iPhone e PDA stanno diventando uno strumento di navigazione, ma l’utente torna solo se trova qualcosa di effettivamente navigabile. Un sito web in grado di riconoscere i dispositivi con schermo piccolo è in grado di catturare anche quei navigatori d’avanguarda (passatemi il termine) e fornire a loro una versione ottimizzata del layout.

Il browser, e di conseguenza il dispositivo, con cui l’utente fa accesso a un sito web è riconoscibile attravero lo User Agent.

Oltre ai browser, gli user agent del web possono essere i crawler dei motori di ricerca, i telefoni cellulari, i lettori di schermo ed i browser braille usati da persone non vedenti.
Quando gli utenti di Internet visitano un sito web, una stringa di testo è solitamente inviata per fare identificare al server lo user agent. Questo fa parte della richiesta HTTP, con prefisso “User-agent:” o “User-Agent:” e tipicamente include informazioni come il nome dell’applicazione client, la versione, il sistema operativo e la lingua. I bot spesso includono anche l’indirizzo web e la mail del proprietario, in modo tale che l’amministratore del sito possa contattarlo.
La stringa dell’user-agent è uno dei criteri per i quali alcuni bot possono essere esclusi da alcune pagine usando il file robots.txt. Questo permette ai webmaster, che ritengono che alcune parti del loro sito (o tutto il sito) non debba essere incluso nei dati raccolti da un particolare bot o che quel particolare bot stia usando troppa banda, di bloccare l’accesso alle pagine. [wikipedia]

E’ arrivato dunque il momento di pensare al design del blog, fondamentalmente ci sono due modi per scremare opportunamente gli utenti che accedono al sito web: tramite il file .htaccess o tramite php. Noi ci concentreremo sulla seconda soluzione.

Esistono due interessanti plugin per formattare un blog in versione mobile:

  1. WP-PDA: riconosce in automatico un sacco di user agent relativi a dispositivi mobili windows mobile, playstation portatile, cellulari, ecc..), è possibile aggiungerne altri tramite il pannello di amministrazione. Per l’iPhone carica un tema particolare, concepito appositamente secondo il design apple. Nelle immagini sottostanti potete vedere la versione di questo blog vista rispettivamente su iPhone e su un browser Nokia.
    diploD visto con iPhone diploD visto da Nokia N79
  2. WP Touch: è ottimizzato per formattare le pagine quando vi si accede con l’iPhone. Il design è delizioso, ma il grosso limite è che riconosce sono lo user agent dell’iPhone e non quelli degli altri dispositivi mobili. Nell’immagine sottostante la versione di un mio blog di test.
    diploD Lab visto con iPhone

Il principio di funzionamento è uguale per entrambi i plugin: in base allo user agent viene caricato un tema apposito. Il tema è in tutto e per tutto uguale agli altri temi wordpress, utilizza gli stessi file php, ma viene semplificato il layout: meno div, meno classi css, meno fronzoli..
Nei prossimi giorni ho intenzione di rilasciare qualche tema gratuito appositamente pensato per i dispositivi mobili, da caricare nelle relative cartelle dei plugin per personalizzare ulteriormente il proprio sito.

Per testare la visualizzazione sui diversi dispositivi, senza possederli (daltronde costano davvero caro..), esiste una comodissima estensione di firefox che cambia a piacimento gli user agent: User Agent Switcher.

Per chi volesse divertirsi a fare tesi, qui c’è una esaustiva lista di user agent string, per estendere la lista di quelli disponibili nell’estensione di firefox.
E’ arrivato il momento di concentrarsi anche su questi aggeggini, via con le customizzazioni.

8 Commenti »

Puoi lasciare un tuo commento, oppure fare un trackback dal tuo sito.

Vuoi essere il primo a lasciare un commento per questo articolo? Utilizza il modulo sotto..

Lascia il tuo commento

 

Utilizzando il sito, accetti l'utilizzo dei cookie da parte nostra. maggiori informazioni

Questo sito utilizza i cookie per fonire la migliore esperienza di navigazione possibile. Continuando a utilizzare questo sito senza modificare le impostazioni dei cookie o clicchi su "Accetta" permetti al loro utilizzo.

Chiudi