Non è più sufficiente semplicemente assicurarti che il tuo contenuto web si adatti a un piccolo schermo. Google ha rafforzato questo precedente di aggiornando il suo algoritmo per sottolineare l'importanza di progettazioni reattive attentamente pianificate e ben eseguite sui telefoni cellulari.

E ha senso: i tuoi spettatori non hanno bisogno di tutte le funzionalità di un desktop su un dispositivo mobile. In effetti, potrebbero voler rimuovere alcuni contenuti e funzionalità quando sono su uno schermo più piccolo. Dopo tutto, nessuno vuole ordinare le pagine di contenuti solo per trovare il numero di telefono della tua azienda. Questo è l'elemento mancante nelle molte basi del web design di un'azienda: la vera adattabilità.

Non è sufficiente inserire il tuo sito in una versione che si adatta a un dispositivo mobile. Devi dare un'occhiata da vicino all'esperienza utente completa e come dovrebbe essere modificata per adattarsi ai diversi ambienti in cui viene visualizzata.

Il problema con il design reattivo

Il 57% degli utenti di dispositivi mobili non consiglierà le aziende con scarsi design di siti mobili e Il 48% dice che le aziende con siti mobili che non funzionano correttamente hanno l'aspetto di non preoccuparsi.

Ci sono diverse aree problematiche che la maggior parte delle aziende incontrano nei loro siti Web reattivi:

Posizionamento dell'immagine

I precedenti processi di progettazione hanno imposto che il cliente approva le immagini statiche e gli screenshot prima della fase di sviluppo. Oggi il design è più focalizzato sul riorganizzazione di elementi per diverse dimensioni del dispositivo e molto meno focalizzato sul posizionamento di immagini statiche.

Spremere lo schermo

Mostrare i dati su uno schermo piccolo spesso rende difficile vedere o leggere il contenuto, in particolare le tabelle di informazioni. Il W3C incoraggia effettivamente le marche a scegliere un metodo diverso da tabelle e tab per presentare i dati; le complicate interfacce utente contengono semplicemente troppe informazioni per i dispositivi mobili da gestire.

Spostamento di prospettiva

Soprattutto, il problema con la progettazione reattiva è semplicemente una questione di prospettive dei clienti rispetto alle prospettive delle aziende. Sfortunatamente, la maggior parte delle aziende tende a chiedersi cosa vogliono dire ai propri clienti piuttosto che a come i loro clienti desiderano visualizzare e interagire con tali informazioni.

Ad esempio, mentre i flussi di lavoro di registrazione sono generalmente l'aspetto più importante del web design, spesso hanno una bassa priorità. Questo perché le aziende pensano più alla funzionalità che vogliono che i clienti vedano che al punto di ingresso logico e al flusso di lavoro primario che i clienti stanno cercando.

In parole povere, il responsive design non è la soluzione definitiva per dare agli utenti ciò di cui hanno bisogno da un sito web; lascia ancora molto a desiderare.

Aggiornamento reattivo o aggiornamento ad adattivo?

Quando si parla di web design, i marchi di conversazione chiave devono essere ricondotti al concetto di siti web reattivi e adattivi.

L'approccio reattivo prende il sito attuale e lo adatta a diverse dimensioni dello schermo, mentre l'approccio adattivo modifica effettivamente il contenuto e il suo funzionamento in base alle dimensioni dello schermo.

Il web design reattivo presuppone che i contenuti e le funzionalità dovrebbero essere gli stessi su tutti i dispositivi, ma ciò non è necessariamente vero

Sostengo generalmente un maggior numero di un metodo di progettazione web adattivo, anziché un semplice accatastamento di contenuti, per una ragione importante: il web design reattivo presuppone che i contenuti e le funzionalità dovrebbero essere gli stessi su tutti i dispositivi, ma non è necessariamente vero. La chiave è abbinare la natura del contenuto con il caso d'uso e il contesto in cui gli utenti guardano il tuo sito web.

Ad esempio, supponiamo che tu stia progettando un sito reattivo per un marchio nei beni confezionati al consumo o nelle industrie di beni di consumo. Le promozioni e le pagine di offerte per questi tipi di siti generalmente ricevono il maggior traffico online. Le persone raramente guardano i dettagli del prodotto, ma quando lo fanno, un ottimo modo per evidenziare quei dettagli è mostrare come si confrontano con altri elementi. Con questo in mente, dovresti mettere la visualizzazione del prodotto e il contenuto didattico sulle pagine dei prodotti in modo che tu possa aiutare i consumatori a capire come usare e interagire con il tuo prodotto.

Per l'industria dei beni di largo consumo, vuoi conoscere i tuoi clienti e determinare se sono pre-in, o post-store. Avrai bisogno di creare un'esperienza diversa a seconda di dove si trova il cliente nel percorso di acquisto.

Ecco una breve analisi di ciascun percorso:

  1. Pre-store: le persone che sono pre-store probabilmente visiteranno il sito attraverso i social media o un annuncio e probabilmente cercheranno coupon, offerte o ricette (nel caso del cibo).
  2. In negozio: una volta in negozio, probabilmente stanno cercando coupon, recensioni o confronti di prezzo con altri venditori.
  3. Post-store: quando sono post-store, probabilmente stanno cercando contenuti di marca.

Sapere dove i clienti si trovano nel percorso di acquisto consente di progettare il sito in un modo che soddisfi queste esigenze e altro ancora.

Il design adattivo consente al cliente di avere un'esperienza personalizzata ... in base al dispositivo che sta utilizzando

Soprattutto, devi metterti nei panni dei tuoi clienti. Ad esempio, compro da Trader Joe's ogni settimana. Sarebbe bello se potessi pianificare in anticipo i pasti dal mio portatile e collegare questo piano alla mia esperienza di acquisto. In altre parole, potrei dire al sito cosa vorrei fare per colazione, pranzo o cena. Il sito mi avrebbe quindi detto tutti i prodotti di cui avevo bisogno per preparare quei pasti e creare un elenco mappato per me, in modo da sapere quali corsie colpire quando sono arrivato al negozio. Tutto quello che dovrei fare è tirare fuori il mio telefono.

Il design adattivo consente al cliente di avere un'esperienza personalizzata, ad esempio in base al dispositivo che sta utilizzando.

Ottimizza l'esperienza del cliente adattando il design e le informazioni al dispositivo. Ad esempio, se il tuo cliente ti sta guardando su uno smartphone, rendi il tuo numero di telefono prominente e interattivo in modo che lui o lei possa facilmente chiamare. Il consumatore è su un laptop? Forse è più importante presentare le informazioni sul prodotto in anticipo. Capire di cosa ha bisogno il cliente in base al dispositivo utilizzato e fornire quell'esperienza.

Devi guardare il tuo sito dalle prospettive degli utenti, indipendentemente dal dispositivo su cui lo stanno vivendo. Se i tuoi clienti ritirano i loro telefoni per cercare la tua attività, è meglio essere pronti ad aiutarli a trovare ciò di cui hanno bisogno con il miglior design e funzionalità possibile. Se non lo rendi semplice e senza soluzione di continuità, porteranno la loro attività da qualche altra parte.

Immagine in evidenza, immagine UX mobile via Shutterstock.