Mission (not im)possible: To be Mobile First

Partiamo dall’errore: la progettazione della versione mobile di un sito web è subordinata a quella desktop. Viene studiata la struttura, vengono progettati i contenuti, viene definito il layout...e solo dopo aver completato la versione desktop, si passa alla progettazione mobile. Il risultato? Un sito costruito con la tecnica “ad incastro” che, se visto da tablet o smartphone, risulta un puzzle disequilibrato e non funzionale, perchè il problema più grande è “farci stare tutti i contenuti della versione desktop in uno schermo (molto) più piccolo”.

Siamo seri: non è questo l’approccio giusto. Il web è un ambiente, un contesto fruibile da tanti dispositivi, e un sito performante deve essere funzionale in tutte le sue declinazioni. Per fare questo, dobbiamo inziare a pensare “Mobile First” prima ancora di iniziare operativamente un progetto web.

“Ma da cellulare, funziona?” “Posso vederlo anche da mobile?” “Riesco ad iscrivermi all’evento da cellulare?” Queste sono le domande che dobbiamo aspettarci dal nostro cliente e che dobbiamo essere in grado di rispondere in modo efficiente.

Ma, quali sono le differenze di progettazione desktop/mobile?

to be mobile first
 

1. Always “On”
Se la fruizione desktop obbliga gli utenti a stare seduti su una scrivania, davanti ad una luce idonea, con la mente focalizzata sul pc, con il mobile le persone navigano sempre, in qualsiasi posto e in qualsiasi momento e spesso con la mente altrove. “Pensare Mobile First” significa essere consapevoli che il web è diventato parte integrante della quotidianità: mentre siamo sul web, facciamo molte altre attività....e mentre svolgiamo azioni offline navighiamo sul web, chattiamo sui social, leggiamo news, ecc.

Soluzione: nel mobile, dobbiamo garantire che le informazioni siano consultate facilmente e in modo immediato.

 

2. Questione di schermi
Se le dimensioni degli schermi desktop variano da 1024x768px a 1920x1080px , il mobile costringe a creare siti responsive, compatibili con qualsiasi dimensione e risoluzione. In questo contesto, troppe informazioni possono diventare un problema, perchè possono impedire agli utenti di trovare ciò che effettivamente stanno cercando.

Soluzione: adottiamo il principio del “less is more”. Via i contenuti superflui, ogni elemento contenuto in una pagina web deve portare valore aggiunto. Ma non solo. Progettiamo il sito con un design interattivo e utilizziamo prototipi HTML navigabili con le dita della mano.

 

3. Il mondo a portata di dito
Nel mobile spariscono mouse e tastiera, per lasciare spazio alle dita (spesso, della mano destra). Questo implica una ridefinizione delle dimensioni degli elementi e della loro dispozione all'interno della pagina, per non rischiare di creare pulsanti difficilmente cliccabili, testi non leggibili o click multipli causati da link troppo vicini tra loro. 

Soluzione: diamoci delle regole standard per la dimensione dei testi (12px), per la grandezza dei pulsanti (44 - 48px) e per le distanze tra gli elementi cliccabili (spazio convenzionalmente chiamato "aria", di minimo 32px).

 

QUALI SONO I VANTAGGI PER LE AZIENDE?
Dal 2014, Google dichiara ufficialmente che la responsività dei siti web è un fattore di ranking per il posizionamento nella SERP: i siti responsive vengono premiati, comparendo tra i primi risultati di ricerca.
Quindi, trasformare un sito tradizionale in un sito “Mobile First” significa aumentare la probabilità di entrare in contatto con la clientela, dando vita ad esperienze utenti interessanti, stimolanti e utili. Non significa “tradurre” un sito per i dispositivi mobile, ma (ri)progettarlo in funzione del mobile, tenendo presenti tutte le caratteristiche di questi dispositivi e le esigenze di chi li utilizza. 

 

Vuoi approfondire questa tematica nel dettaglio? Chiamaci al n. 0444 14 96 867 oppure scrivici a [email protected], saremo lieti di fare la tua conoscenza e di rispondere a tutte le tue domande.

Condividi su:

Facebook LinkedIn Twitter