Approccio Mobile First

Il web design essenziale

Dall’ultimo anno, le ricerche effettuate tramite dispositivi mobile, soprattutto, nel settore e-commerce, continuano ad aumentare, complici anche le restrizioni imposte dalla pandemia. Tuttavia, a causa delle dimensioni ridotte, molte persone, si sono, spesso, trovate nella necessità di avvalersi dello zoom per poter leggere chiaramente i contenuti sullo schermo; da questo inconveniente, gli sviluppatori web hanno iniziato a chiedersi in che modo sia possibile assecondare le tendenze di fruizione dei contenuti online da smartphone? La risposta è molto semplice e risiede nel Mobile First: strategia elaborata per aiutare le aziende sia ad entrare in contatto con un maggior numero di utenti, al fine di fidelizzarli, e sia per rimanere in cima alla SERP di Google il più a lungo possibile.

Vediamo, allora, in cosa consiste questo nuovo approccio al web design, le regole che ne stanno alla base e i relativi vantaggi.

L’espressione “ovunque e in ogni momento”, dall’inglese “everywhere & everytime”, ha ormai cambiato le abitudini e i comportamenti dei consumatori, i quali desiderano, sempre più, ricercare informazioni e acquistare prodotti/servizi, avvalendosi dei dispositivi mobile, in qualsiasi luogo si trovino e approfittando di qualunque spazio libero della giornata. Ciò è confermato anche dai dati forniti dall’Osservatorio Mobile B2C Strategy, secondo i quali, in Italia, una persona su due, in età compresa tra i 18 e i 74 anni, naviga su Internet in mobilità ed il 77% degli stessi utilizza lo smartphone per prendere decisioni d’acquisto.

Ecco, allora, che diventa fondamentale, oggi, per le imprese, disporre di siti web ottimizzati da mobile ed organizzare le proprie strategie online scegliendo l’approccio migliore, ovvero il Mobile First.

La suddetta metodologia si presenta come una strategia in cui il dispositivo mobile viene prima di tutto per quanto riguarda la configurazione, l’usabilità e la prestazione. Si tratta, in sostanza, di progettare il design delle pagine web, in modo tale che le stesse possano avere una visualizzazione ottimale, innanzitutto, sui dispositivi mobile, rendendo più facilmente accessibili i relativi contenuti ed aumentandone così la popolarità. Potremmo dire che stiamo assistendo ad una sorta di inversione di tendenza rispetto al passato, nel senso che mentre, fino a poco tempo fa, web designers e programmatori iniziavano dalla realizzazione di siti web per pc desktop, includendo un’ampia gamma di funzioni, animazioni, contenuti ed immagini, poi adattabili ad altri device, oggi, invece, con il Mobile First la prospettiva viene, appunto, capovolta, focalizzando l’attenzione sull’essenziale, partendo dai dispositivi mobile e cercando di non dedicare un tempo eccessivo alla programmazione. Difatti, esserci e rispondere tempestivamente rappresentano le premesse migliori per cogliere l’interesse e le preferenze degli utenti; ciò implica, per le aziende, progettare un customer journey, che parta da un’ottica mobile, e non più desktop, con la consapevolezza che la maggior parte dei visitatori giungerà sul loro sito web, blog o landing page, tramite smartphone.

Nella pratica, un progetto Mobile First si esplica in una serie di passaggi che coinvolgono, soprattutto, quattro ambiti tra loro complementari, che sono:

1. il design, ovvero, la creazione di siti web in un’ottica mobile e che solo, successivamente, vengono adattati ai pc desktop; in questa fase, emergono per i designer e gli esperti di user experience (UX), alcune problematiche riguardanti il menu di navigazione, la gestione delle immagini e, in generale, l’usabilità del sito web;
2. la velocità di caricamento delle pagine che dev’essere il più rapida possibile, dato che, secondo alcuni studi, ogni secondo di caricamento costa il 7% di conversioni in meno;
3. i contenuti, che devono essere fruibili per i dispositivi mobile; ciò implica che, diversamente da un sito desktop, che può includere diverse immagini e testi, un sito mobile first deve tenere conto delle dimensioni ridotte dello schermo e adattare gli argomenti ad uno smartphone, magari dividendoli in più pagine web, perché: sono la qualità e la gerarchia dei contenuti a fare la differenza;
4. ed i funnel di conversione, i quali devono essere concepiti come percorsi ottimizzati o entry point per gli utenti che consultano i device in mobilità e, quindi, con modalità diverse da quelle desktop.

Esistono, inoltre, altri aspetti, ugualmente importanti e che non vanno trascurati, quali:

• le call to action (CTA) a misura di indice, ovvero link e pulsanti sufficientemente grandi e separati, quindi, visibili, chiari e facilmente cliccabili, al fine di agevolare la navigazione, ridurre al minimo lo spreco di tempo e incentivare azioni di acquisto impulsivo.
• e il colore come trait d’union, cioè un mezzo funzionale per cogliere l’attenzione degli utenti, influenzare le loro azioni e guidarli nella navigazione; ad esempio, contraddistinguere con un solo colore tutte le azioni e le sollecitazioni legate al processo d’acquisto, favorisce il customer journey e stimola i processi di conversione.

Infine, è bene, anche, evitare forme di pubblicità troppo invasive e ridurre al minimo i dati che l’utente, spesso, deve inserire manualmente nei form di profilazione, adottando, ad esempio, come metodo alternativo, la social login.

Come abbiamo, già, visto nel nostro precedente articolo, il Responsive Web Design è una tecnica di progettazione web che consiste nel creare siti, prima, nella loro versione desktop e dopo in una variante mobile; si tratta di interfacce in grado di adattarsi automaticamente al dispositivo su quale vengono visualizzate, poiché, i differenti elementi che le compongono, si ridimensionano in proporzione e al variare dello schermo, in modo tale che vengano visualizzate correttamente, favorendo l’usabilità del sito in qualsiasi contesto. Tuttavia, se creiamo un sito mobile secondo la tecnica responsive, avremo gli stessi contenuti della versione desktop riassemblati per essere fruibili da mobile, ma potrebbe anche accadere, ad esempio, che le immagini orizzontali appaiano troppo piccole sullo smartphone e perdere appeal se molto dettagliate, oppure che un testo poco lungo, se visualizzato da un monitor, possa non sembrare tale da smartphone e, quindi, apparire superfluo o non essere letto. Per questo motivo, negli ultimi anni, si è preferito ricorrere al Mobile First, piuttosto che all’approccio responsive, creando siti più interattivi e meno descrittivi, nonché puntando all’aspetto emozionale tramite immagini, forme e colori, e non a quello razionale.

In particolare, i principali vantaggi, derivanti dall’utilizzo dell’approccio Mobile First, possono essere così sintetizzati:

• è incentrato sul concetto di essenziale,
• la relativa programmazione non richiede particolari sforzi,
• offre prestazioni massime su tutti i dispositivi mobili,
• consente un accesso rapido a tutte le informazioni,
• offre un design adatto allo schermo dello smartphone,
• è privo di immagini eccessivamente grandi e di funzioni inutili,
• è dotato di un codice sorgente ridotto,
• infine, le pagine web sono programmate direttamente in HTML, senza avvalersi di JavaScript.

In conclusione, oggi, ogni prodotto di comunicazione digitale dev’essere progettato per i dispositivi mobile, sia che si tratti di una nuova iniziativa e sia che riguardi il miglioramento di un lavoro precedente. Tuttavia, la versione desktop, dei siti web, non è del tutto da trascurare, soprattutto per quanto riguarda i contesti più orientati al B2B, ma non ha più un ruolo preminente, come in passato, e la precedenza va data a smartphone e tablet poiché, da soli, generano la quasi totalità del traffico su Internet. L’approccio Mobile first, quindi, va applicato su entrambi i lati dello schermo, ovvero:

• dalla parte degli utenti, per agevolarli nell’usabilità dei siti web e garantire loro una UX ottimale, 
• e dalla parte degli addetti ai lavori, per evitare loro inutili sforzi e perdite di tempo nella programmazione dei siti web.