Sempre più utenti utilizzano dispositivi mobile come tablet e smarphone, per navigare sul web. E il dato è in continua crescita, anche secondo l’autorevole fonte Audiweb che, secondo una recente statistica dello scorso Novembre 2014, dichiara:

Nel giorno medio ad agosto sono stati 15,5 milioni gli utenti online da dispositivi mobili (smartphone e tablet), collegati per 1 ora e 37 minuti per persona. Il 66,4% del tempo totale speso online è stato generato dalla fruizione di internet da mobile.

Ne consegue che programmatori e webmaster nella progettazione e realizzazione di un sito web, non possono assolutamente ignorare la portata e l’importanza di rendere facilmente navigabile, anche dai dispositivi mobile, il sito stesso. In caso contrario, il rischio è di perdere contatti e potenziali clienti!

La soluzione: un sito web con layout responsive

Per rendere accessibile un sito a prescindere se viene utilizzato un PC Windows, MAC, un tablet o uno smartphone, con qualsiasi browser (Internet Explorer, Chrome, Firefox, ecc.) a qualsiasi risoluzione del display, la risposta è semplice: il design del sito deve essere responsive.

Il responsive web design e di conseguenza il codice di un sito web responsive sono progettati per riconoscere le dimensioni del monitor con il quale il sito viene visualizzato e di conseguenza adattare il layout affinché il sito mostri un menu compatto, adatti le immagini, elimini o eviti di richiamare alcune librerie javascript che, nella versione desktop mostrano effetti speciali utili a fornire agli utenti un’esperienza più gradevole, ma al contrario nella versione mobile non sarebbe altrettanto “godibili” anzi appesantirebbero il download della pagina inutilmente.

A Google piace il responsive

Ormai è ufficiale, molti siti responsive guadagnano posizioni grazie alla loro adattabilità e ottimizzazione a differenti layout, rispetto ad altri siti web “mono layout”. Già da un po’ Google mostra nei risultati di ricerca effettuati con smartphone, la scritta “Mobile-friendly” accanto alle descrizioni dei siti web, questo in prima battuta per fornire un ulteriore informazione agli utenti che di conseguenza sapranno di trovare un sito navigabile e usabile adatto al loro dispositivo e come tutti sanno, ciò che gli utenti preferiscono, piace anche a Google! Non è quindi più tempo di avere un sito a “layout fisso” se si vogliono soddisfare tutti i nostri visitatori e convertire al massimo le visite in contatti.

Come testare se un sito ha un design responsive

Il tuo sito ha un design responsive? Come accennato prima, Google è il primo strumento che può darci questa indicazione premiando i nostri sforzi con la scritta “Mobile-friendly”, ma se vogliamo avere una certezza in più possiamo utilizzare una risorsa online (un tool per testare siti responsive) che ci permetterà di verificarlo.

Designmodo.com (clicca qui) è un tool – non devi fare il download o l’installazione -, che ti consente di eseguire un test su un sito web per ogni tipo di risoluzione. In questo modo potrai avere idea di come gli utenti vedono il tuo sito e verificare se le pagine web si adattano alla visualizzazione attraverso dispositivi mobile.

Nella barra in alto di stato, inserisci l’indirizzo del sito (Url) da verificare. Dopo il caricamento, potrai impostare la risoluzione semplicemente specificandola nelle successive caselle o selezionare risoluzioni preimpostate per i vari tipi di dispositivo.

Scelta la risoluzione, prova a trascinare la barra di scorrimento laterale da destra verso sinistra: se la pagina si ridimensiona consentendo la visualizzazione dell’intero sito all’interno del frame, allora vorrà dire che il sito che stai esaminando ha un layout responsive.

Viceversa, se trascinando la barra di scorrimento laterale verso sinistra la finestra si ridimensiona ma la dimensione della pagina resta la medesima, permettendoti di visualizzare solo la parte di pagina non sorpassata dalla barra di scorrimento, allora in questo caso stai testando un sito web con layout NON responsive.