Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial
  • Lezione 21 di 59
  • livello principiante
Indice lezioni

La navigazione mobile

Alcuni principi da tenere a mente quando si progetta un sito mobile, user experience e mercato dei browser
Alcuni principi da tenere a mente quando si progetta un sito mobile, user experience e mercato dei browser
Link copiato negli appunti

Aggiornamento a cura di: Marco Pontili

Grazie al successo crescente delle vendite di smarthphone e tablet con dimensioni, capacità e prezzi di ogni genere, il Web mobile è sempre più presente nella vita di molti utenti quale strumento immediato di accesso ad internet.

Creare siti performanti e ottimizzati anche per questo tipo di navigazione è imperativo per designer e sviluppatori.

Differenze tra desktop e mobile

Esistono delle differenze fondamentali fra un dispositivo di navigazione desktop e uno mobile. Ecco 3 principi chiave da tenere a mente:

Browser mobile

I browser mobile hanno capacità e peculiarità che derivano dall'hardware e dal sistema operativo su cui sono installati. Internet Explorer, Firefox, Chrome, Safari e Opera rappresentano solo una parte della lunga lista dei browser esistenti; e comunque, accanto ad altri browser meno conosciuti, circolano versioni specifiche per mobile di quelli appena citati.

Risoluzione e dimensioni dello schermo

Smarthphone e tablet sono dotati di schermi di ogni genere. Schermi in alta o bassa risoluzione, di dimensioni molto piccole (480px X 320px), medie (1024 X 768px), intermedie...e via dicendo. In generale comuque, il Web mobile viaggia su schermi più piccoli di quelli tradizionali.

Contesto e rotazione dello schermo

Con uno smartphone possiamo ruotare lo schermo e aspettarci che cambi la visualizzazione del sito, cosa che con i monitor tradizionali non è consentita.

Se si è in movimento può capitare di vedere la pagina per un po' sul 'lato lungo' e un po' su 'quello corto' perchè l'interfaccia del browser scorrerà adattandosi all'inclinazione del device.
Gli utenti mobile vedranno un sito web nella modalità di visualizzazione che preferiscono (in gergo tecnico: portrait view e landscape view) e la user experience (UX) sarà differente.

Inoltre è da tenere a mente che il contesto in cui si trova un utente mobile è pieno di distrazioni e stimoli (al supermercato, in strada, in metro, ecc). Per questo, è meglio arrivare subito al punto e dare le informazioni che l'utente sta cercando il prima possibile.

Caricamento delle pagine

In genere i siti desktop vengono caricati più lentamente sui dispositivi mobili. Le rete mobili di trasmissione dati sono solitamente più lente di un'ADSL e le capacità hardware dei device sono spesso ridotte. Dunque, se non si prendono accorgimenti, un sito web si visualizzerà più lentamente su un dispositivo mobile che su uno desktop con la seguente degradazione della UX.

Cellulari e tablet: i browser mobile

I browser mobile sono software snelli ed efficienti che si adattano alle basse capacità di memoria, hardware e larghezza di banda di un dispositivo portatitle. Questi browser sono progettati per renderizzare al meglio i contenuti web anche su schermi di piccole dimensioni.

Quasi tutti cercano di creare automaticamente una "versione mobile" di ogni pagina, adattando i contenuti al display disponibile.

I più moderni supportano senza problemi i principali linguaggi e tecnologie web recenti come HTML5, CSS3, JavaScript e Ajax. Ma alcuni dispositivi (iPod, iPhone, iPad) non supportano la tecnologia Flash. Altri ancora supportano solo CSS2.1.

Possiamo dire che la maggior parte dei browser mobile "gira" su un hardware di capacità ridotte e ha prestazioni ben più limitate di un computer desktop.

Inoltre, l'esperienza di input tastiera/mouse per la navigazione mobile non esiste o è completamente stravolta. Per i touch screen ad esempio, i bottoni di un sito dovranno essere abbastanza grandi per essere toccati con un dito e lo scrolling delle pagine avverà muovendo lo stesso dito su e giù "sopra" al sito web.

Per i cellulari "non smart", può essere presente invece un piccolo joystick per navigare fra i link delle pagine. La navigazione avviene attraverso un cursore e un puntatore e non certo attraverso un gesto intuitivo di 2 dita.

Da valutare anche il fatto che un utente mobile si troverà spesso a zoomare le zone più importanti delle pagine per poter leggere testi, altrimenti davvero troppo piccoli, o navigare all'interno di portali.

Infine, è importante precisare che esiste un alto numero di browser mobili preinstallati o da installare con diverse caratteristiche e diversi sistemi di rendering. Fra i più conosciuti troviamo Mobile Safari (iOS), Android browser, Opera Mobile (installabile anche su iOS e Android) e Opera Mini (preinstallato su molti vecchi Nokia).

Seguire il mercato e essere a conoscenza di statistiche aggiornate è quindi fondamentale per scegliere un target di riferimento. In questo modo saremo a conoscenza (o ne avremo un'idea) delle capacità e delle tecnologie da supportare per rendere un sito web pronto per il mobile.

Ti consigliamo anche