Web Design Responsive: ne vale la pena?

Se c’è una parola che “va di moda” in questo momento, quando si parla di siti internet, è la parola “responsive web design“. Non puoi fare il tuo sito web, senza che qualcuno ti dica che deve essere “responsivo“. Persino Mashable.com ha dichiarato che il 2013 è l’anno del “Responsive Web Design”.  Del resto basta fare un salto alle varie conferenze di web marketing in Italia e all’estero, per notare gli interventi su questo argomento.

sito wmtools versione mobile

La crescita di Smartphone & Tablet in Italia e nel mondo

Come premessa, va evidenziata la vertiginosa crescita e diffusione degli Smartphone nel mondo; in Italia una ricerca Nielsen dice che addirittura ci sono più smartphone che cellulari “normali”.

diffusione mobile

E anche nel resto del mondo non si scherza, sempre secondo Nielsen già nella metà del 2012 due terzi degli americani che stavano comprando un nuovo cellulare, hanno optato per l’acquisto di uno Smartphone. Gartner nel 2010 aveva predetto che nel 2013 le persone si sarebbero collegate a Internet più dal cellulare che dal computer fisso. Forrester stima che nel 2016, 1 miliardo di persone avrà uno smartphone.

Perché “Responsive”?

Ma cosa vuol dire “responsive”? In passato bastava avere una versione del sito adatta per il mobile e il gioco era fatto. Ma oggi le cose si sono complicate: da una parte abbiamo la navigazione tradizionale da computer fisso, ovvero da Desktop; dall’altra abbiamo il mondo degli Smartphone e cellulari vari; infine c’è tutto il mondo dei Tablet, iPad e simili.

A causa di tutti questi dispositivi, oggi serve un tipo di sito che possa adattarsi a diversi formati, allargandosi o stringendosi, a seconda delle dimensioni dello schermo. Un sito responsive si basa su un sistema che tecnicamente riconosce il device e gli risponde con un layout adatto, quindi con colonne, menù e griglie che siano flessibili (su uno schermo piccolo le 3 colonne sono impossibili da leggere e un menù orizzontale dovrà essere limitato a poche voci).

sito per tablet

Credits foto: http://www.mivamerchant.com/

Il problema non è solo di tecnologia, perché cambia l’utilizzo di questi devices e quindi anche l’impostazione del sito. Banalmente un sito accessibile da uno smartphone – che sia iPhone o altro – si presuppone debba avere tasti grandi e uno schermo con poche funzioni, perché frequentemente chi accede al web da cellulare è in una situazione di scomodità (spesso in auto!). Ha urgenza di reperire l’informazione, l’esigenza di una risposta rapida a un bisogno immediato (ad esempio sta cercando un telefono di un ristorante o l’indirizzo di un hotel). Al contrario chi accede da Tablet o iPad potrebbe essere comodamente a casa sua, con lo strumento appoggiato in grembo e magari avere le due mani a disposizione.
E non è detto che un utente non disponga di tutti e 3 questi dispositivi.

Schermata 04-2456403 alle 11.54.51
Credits foto:
http://www.mivamerchant.com/

Fare acquisti da Mobile

Il problema si pone soprattutto quando gli utenti usano questi strumenti per fare azioni più complesse, ad esempio prenotare un albergo o fare un acquisto online. Allora lì si che un layout sbagliato, può incidere sulla conversione. Secondo l’indagine di Google “The Mobile Movement: Understanding Smartphone Users, 2011”  il 70% degli utenti mobile ha comparato prezzi di prodotti e servizi sul proprio telefono, il 65% ha letto recensioni online e il 50% delle ricerche da mobile porta a un acquisto.

mobile users

Altri dati a sostegno dell’E-commerce tramite mobile?

  • Nel 2010 il colosso Amazon ha registrato vendite per 1 miliardo di dollari da dispositivi mobile.
  • Il 40% delle transazioni su eBay avviene tramite l’app mobile.

Purtroppo, sono tanti i siti che hanno visualizzazioni pessime dallo smartphone o dal tablet, se è vero che ben il 61% degli utenti prova un’esperienza frustrante, e si sposta su un competitor, dopo aver provato a comprare su un sito da mobile.

3 Tool per verificare come si vede il sito

Tool #1

A proposito, se ti stai chiedendo come si vede il tuo sito internet su un dispositivo mobile, prova questo tool. Potrai avere un report non solo su eventuali punti critici, ma anche una sorta di check list su cosa funziona o no (per esempio la velocità di caricamento, se la gerarchia dei contenuti è chiara e se i testi sono visibili senza dover ingrandire la visualizzazione).

http://www.howtogomo.com/en-gb/d/test-your-site/

Schermata 04-2456402 alle 17.10.06

Tool #2

L’Opera Mobile Emulator ti mostra come si vede il tuo sito da vari dispositivi. Abbiamo fatto qualche prova, ecco come si vede Wmtools.com da alcuni famosi devices.

Schermata 04-2456404 alle 22.08.20

Schermata 04-2456404 alle 22.09.32

Schermata 04-2456404 alle 22.10.35

Tool #3

Un altro tool molto interessante per testare come si vede il tuo sito su diversi dispositivi è quello creato da Matt Kersley che permette di verificare e testare una pagina responsive, anche nel momento in cui la stiamo creando.

Schermata 04-2456404 alle 22.52.56

Ok, va bene, ora che hai capito che è importante avere un sito responsive, magari vuoi avere qualche informazione in più. Per esempio vuoi vedere qualche buon esempio e caso di successo.

Un buon esempio di sito responsive è quello del Boston Globe, che si adatta perfettamente allo schermo di qualsiasi dispositivo.

Boston_Globe_responsive

Se invece che un sito di news, vuoi un esempio di un e-commerce responsive, un altro buon esempio è Nuts.com un sito che vende frutta secca, dolcetti, snack, caffè, tè e altri prodotti alimentari.

Schermata 04-2456403 alle 19.47.15

Come buona pratica, ti consigliamo sempre di seguire questi 2 passaggi:

  • 1° step: verifica da quali devices viene visualizzato il tuo sito (con Google Analytics)
  • 2° step: usa un emulatore per verificare come si vedono i tuoi contenuti da quei devices

Obiezione: perché non fare una app al posto di un sito responsive?

Spesso le persone non vogliono scaricarsi una app, ma vogliono visitare il sito dal proprio dispositivo, in maggiore libertà. Secondo il Pew Research Center il 60% di chi possiede un tablet, preferisce leggere le news sul proprio dispositivo anziché scaricarsi una app. Forse perché si ha paura che l’app non sia aggiornata, funzionale o che, oppure per il gusto di decidere noi cosa vogliamo vedere. Lo sapevi che una grossa percentuale di app scaricate, non vengono mai usate?

tablet

Credits: http://features.journalism.org/2012/09/30/the-future-of-mobile-news-a-pej-infographic/

Sito Mobile vs Sito Responsive

Per un certo periodo c’era la tendenza a fare un sito “mobile” con indirizzo dedicato. Sicuramente può garantire una maggior velocità di caricamento, e in alcuni casi può rivelarsi una buona strategia, dal momento che possono essere studiati contenuti ad hoc per quel tipo di utente. Per esempio nel caso di un hotel o ristorante, ci sono informazioni che hanno la priorità (telefono, dove siamo, booking online). Tuttavia oggi questa tendenza è superata, anche perché spesso i siti mobile non tengono conto di altri dispositivi d’accesso (laptop, tablet, iPad, ebook reader) e hanno altri lati negativi.

Ci sono diversi vantaggi nell’avere un sito responsive rispetto alla versione Mobile:

  1. Un sito unico da gestire. Sia per i contenuti (li aggiorno in un luogo unico) che per la user experience dell’utente (per una questione di brand image), è sempre preferibile avere un punto d’accesso unico.
  2. Lato SEO è un sito unico da promuovere. La URL è una sola e tutti i link puntano a quella. Lo sforzo è unico e concentrato.
  3. Un sito unico da monitorare. Su Analytics possiamo differenziare le diverse versioni e tener traccia quindi delle diverse conversioni.
  4. Il sito è già predisposto per il “futuro”: non importa quale device verrà sviluppato, il sito è già pensato per poter adattare il suo layout a diversi schermi.

Ora che ti abbiamo “convinto” della necessità di avere un sito Responsive, forse ne vorrai sapere di più.

Non perdere il prossimo post, con i 10 consigli tecnici per fare un sito responsive, 3 tool utili e un e-book consigliato da leggere!

11 Comments

  1. totalmente favorevole ai temi responsive in ogni dove 🙂 mi sembra decisamente più complesso gestire il theme mobile a parte, ma la cosa essenziale è che tutte le funzionalità del sito – come avete osservato giustamente – siano perfettamente funzionanti.

  2. Se i riscontri analitici rivelano un a percentuale di visite sempre maggiore proveniente da mobile, è evidente otre che giustificata la corsa al tema responsive. Altra questione però è valutare la natura del legame dipendente tra il tasso di conversione e la presenza del tema mobile. Questa è la prova del 9. Servirebbe uno studio su diversi segmenti di mercato in cui si mostrano le differenze registrate dalle aziende in termini di conversione, tra prima e dopo il passaggio al tema responsive.

  3. 10 Consigli utili per un sito Responsive | Web Marketing

  4. Secondo una nostra stima di lavori realizzati per vari clienti il costo dello sviluppo di un sito responsive è inferiore di un terzo a confronto della realizzazione di due siti, uno per mobile/tablet, e l’altro per pc/portatile.

  5. Un problema da porsi…
    In questo momento i siti che sviluppo non sono nè responsive ne mobile ma tutto sommato sui tablet hanno una buona resa. Naturalmente per gli smartphone il discorso è diverso: piccole miniature che senza ingrandimento sono inutilizzabili.
    Che dire? Un’altra cosa da dover imparare!

  6. Meglio un template responsive, oppure no?

  7. Dura la vita online per un albergatore oggi… (Parte 2/2) | Web Marketing Tools

  8. SOME LINK ABOUT RESPONSIVE WEB DESIGN | KonG

Leave a Comment

Your email address will not be published. Required fields are marked with *.