Molti sviluppatori si chiederanno se siti ed applicazioni web per iPad possono essere ottimizzati seguendo una linea di web generico piuttosto che mobile. In questo articolo cercherò di fare un pò di chiarezza e distinzione sulle tecnologie supportate da iPad traendo delle conclusioni finali su qual’è la miglior scelta di ottimizzazione per un sito web su iPad.
Partendo dal presupposto che iPad è un dispositivo che si interpone tra mobile e netbook ci sono una serie di possibilità e soluzioni che possiamo apportare per migliorare la visibilità del nostro sito web su questo dispositivo.
Flash non è supportato
Come ormai ben sapete Flash non è supportato da Apple e di conseguenza già taglia fuori una buona fetta si siti web che utilizzano questa tecnologia.
1 punto a favore delllo sviluppo per mobile.
L’utilizzo di HTML5
Benchè sia a favore, cosi come quando siete all’interno di un negozio Ikea dovete, per forza (come criceti) seguire tutto il tragitto che vi porta a far vedere tutti i loro prodotti e magari acquistarne qualcuno in più, beh, Apple l’ha pensata più o meno allo stesso modo, non solo con le applicazioni che rimangono “close-source” all’interno dell’App Store ma anche lato web saremo costretti ad utilizzare il tag html <video> (che magari linka dei contenuti Apple) piuttosto che utilizzare marchi di fabbrica Adobe. Certo il Flash non è per nulla accessibile, ma siamo sicuri sia questa la reale motivazione?
1 punto a favore del web generico. 1 punto a favore dello sviluppo per mobile.
Dimensioni dello schermo
Anche qui ci preoccupiamo tanto dell’ottimizzazione per iPad ma quanti siti sono ottimizzati anche per netbook? E pure questi dispositivi in silenzio guadagnano sempre più una grossa fetta di mercato, qualcuno dovrà anche iniziare a preoccuparsene. Tornando all’iPad, qui abbiamo possibilità di gestire la larghezza dello schermo fino a 1024px, nulla di strano e nuovo per chi ottimizza già a 1024×768 e soprattutto se stiamo parlando di un layout liquido.
Tutta via cosi come iPod Touch e iPhone, anche iPad gestisce la rotazione dello scheremo, in teoria quando viene tenuto in posizione verticale la larghezza massima sarebbe 768px, al contrario quando viene tenuto in orizzontale 1024px.
Safari sul iPad supporta la window.orientation, quindi se necessario, è possibile utilizzarlo per determinare se l’utente è in modalità orizzontale o verticale. Esempio:
window.orientation è 0 quando viene tenuto in posizione verticale window.orientation è di 90 quando viene ruotato di 90 gradi a sinistra (orizzontale) window.orientation è di -90 quando è ruotato di 90 gradi a destra (orizzontale)
È inoltre possibile utilizzare direttive CSS per determinare se il iPad lavora verticalmente oppure orizzontalmente, come ad esempio:
Interessante vero? Ma effettivamente avete più modi per incasinarvi la vita. 1 punto a favore del web generico.
Sfruttare il touch
Qualche settimana fa ho scritto un articolo su jQuery Touch, un progetto open-source scritto appositamente per dispositivi Apple e sfrutta in tutto e per tutto la possibilità di muovere oggetti mediante il touch screen che iPad, in questo caso, mette a disposizione.
1 punto a favore dello sviluppo mobile, ed in particolare per Apple.
Conviene ottimizzare per iPad?
Per il momento no. Nonostante se ne siano venduti in tutto il mondo 2 milioni in meno di una settimana il mercato qui in italia è ancora un pò a rilento e sono convinto che il boom lo avremo come al solito a Natale.
Se il vostro sito ha già una versione mobile può essere tranquillamente visualizzata anche per iPad, cosi come se il vostro sito web rientra nei canonici 1024×768 oppure è un layout liquido e nel contempo non ha alcuna animazione Flash al suo interno può essere tranquillamente fatto passare come un sito web generico.
Se, invece volete sfruttare al massimo le tecnologie che Apple fornisce e magari realizzare un sito web touch-screen che assomigli più ad un’applicazione, beh, allora iPad fa al caso vostro.
Conclusioni
Leggendo questo articolo vi sarete fatti un’idea su come iPad non si classifichi nè dalla parte dei dispositivi mobili nè dalla parte dei siti web generici ed allora sta nella vostra interpretazione cercare di capire se il sito web sviluppato possa essere tranquillamente visto da iPad come web generico oppure mobile oppure ancora come una versione ad hoc. Questo in base al rapporto tempo/denaro e accordi con il cliente.
User agent
Questo è l’user agent da adottare per riconoscere un dispositivo iPad
ozilla/5.0 (iPad; U; CPU iPhone OS 3_2 come Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, come Gecko)
Version/4.0.4 Mobile/7B314 Safari/531.21.10
Se stai cercando di rilevare la iPad utilizzando JavaScript, c’è un modo molto semplice per farlo: verificare navigator.platform. Il valore di navigator.platform restituito nel nostro caso sarà “iPad”. Questo è il modo più accurato per rilevare iPad con JavaScript:
function iPadDetection(){
return navigator.platform == "iPad";
}
