Responsive web design: il tuo sito è adatto per il mobile?

Responsive web design: cos'è?

Partiamo da un dato: in Italia (nel momento in cui scrivo) le persone tra i 18 e i 34 anni passano il doppio del tempo a navigare da mobile anzichè da un computer fisso; un dato che comunque non varia anche per le altre fasce d’età.

Adesso fai un esperimento: prendi il tuo smartphone e apri il tuo sito. Come lo vedi? Per consultarlo devi stare lì col le dita a fare lo zoom e a scorrere a destra e a manca? Se è così probabilmente gli utenti delle tue pagine perderanno presto la pazienza e tu perderai potenziali clienti.

La soluzione: responsive web design

Per ovviare a questo inconveniente devi affidarti al responsive web design. Cos’è? È una tecnica di progettazione che fa sì che il tuo sito si veda bene su tutti i device da cui è aperto: monitor grandi e medi, tablet e smartphone. Per ottenere questo risultato l’impaginazione del tuo sito risponderà alla grandezza del dispositivo dal quale viene aperto, ingrandendo, rimpicciolendo, nascondendo e spostando il contenuto presente.

L’esigenza di avere un design flessibile e liquido si è presentata contestualmente al diffondersi di diversi terminali per la navigazione della rete. A coniare il termine responsive web design fu Ethan Marcotte, che ha descritto l’approccio e le tecniche per questa progettazione in un libro del 2011 intitolato, appunto, Responsive web design.

Invece di creare design sconnessi, ognuno tagliato su misura per un particolare dispositivo o browser, dovremmo invece trattarli come sfaccettature della stessa esperienza. In altre parole, possiamo creare siti che non solo sono più flessibili, ma in grado di adattarsi al media che li visualizza.
Ethan Marcotte

Mobile only contro Responsive

Alcuni siti (sempre meno) adottano come soluzione alternativa quella del cosiddetto Mobile only design, cioè il sistema riconosce il dispositivo dal quale si sta aprendo il sito e, in caso di mobile, apre una versione dello stesso progettata specificatamente per questi dispositivi. Se da un lato può sembrare un’ottima soluzione, dall’altro questa implica il dover portare avanti due design differenti, un po’ come fossero due siti, con conseguente aumento dei tempi e dei costi di progettazione. Inoltre l’esperienza utente, con tutta probabilità, perderebbe di coerenza tra i diversi dispositivi.

I 7 vantaggi del responsive web design

  1. il responsive web design permette di offrire agli utenti la stessa esperienza di navigazione da qualsiasi dispositivo: un utente che torna sul vostro sito da un device diverso non dovrà approcciare qualcosa di nuovo, ma saprà già come muoversi per visionare i vostri contenuti;
  2. con un solo sito coprite tutta la vasta galassia di dispositivi presenti sul mercato, dai più piccoli ai più grandi;
  3. migliorate l’indicizzazione nei motori di ricerca: Google infatti affibia ai siti progettati per smartphone e tablet l’etichetta Mobile friendly, avvantaggiandoli nei risultati delle ricerche effettuate da device mobili;
  4. avete un grande margine di scalabilità futura, cioè nel momento in cui il vostro progetto e le vostre esigenze di design crescono, la flessibilità del responsive non vi metterà bastoni tra le ruote;
  5. se avete un e-commerce non potete non avere un sito responsive: gli acquisti da mobile crescono a velocità incredibili, nel 2015 sono state il 68% in più rispetto al 2014;
  6. è più facile attrarre traffico dai social network, piattaforme che vengono navigate principalmente da mobile e quindi sempre da mobile faranno arrivare utenti al vostro sito.

Ora che sai cos’è il responsive web design e quali sono i vantaggi che può portare al tuo progetto o business, non ti resta che metterti al passo con i tempi.

E tu hai esperienze da raccontare sulla navigazione del tuo sito o di quello di altri da mobile? Raccontamelo nei commenti.
(Ricordati che il fatto che i siti responsive sono più facili da leggere mentre si è in bagno non vale) 😀

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *