Responsive Web Design

Da diverso tempo ormai si sente parlare di siti “responsive design“.

Però non tutti sanno con esattezza a cosa ci si riferisca quando si parla di “responsive design“… non che sia obbligatorio saperlo però, nel momento in cui occorre decidere che strada prendere per un nuovo sito, o anche solo per un aggiornamento dell’attuale, diventa importante disporre di quel minimo di elementi e conoscenze atte a consentirci una scelta consapevole e proficua.

I siti web, originariamente, sono nati per esser navigati usufruendo di pc desktop e successivamente su pc portatili. I siti, di fatto venivano sviluppati decidendo a priori la miglior risoluzione di visualizzazione che cambiava con l’incrementarsi delle prestazioni delle schede grafiche e dei monitor: dal 640×480 all’800×600 e poi al 1024×768 ecc.

Si decideva a priori la larghezza della pagina in visualizzazione, si formattavano tabelle e immagini in funzione di questa larghezza e man mano che la tecnologia avanzava il sito web si dimostrava sempre più inadeguato.

L’avvento di device di tutti i tipi ha poi complicato maggiormente la situazione: pensate alla visualizzazione di un sito 800×600 su uno smartphone… se ne vedono ancora tanti in giro e di sicuro è un tipo di navigazione che toglie il piacere della navigazione stessa anche in presenza di un sito ben fatto.

Grazie alla potenzialità dell’html e dei fogli di stile css si è quindi passati da una programmazione del sito in valori assoluti ad una programmazione del sito in valori percentuali. In un sito responsive la pagina non sarà larga 720 pixel ma ad esempio 100% dello spazio disponibile, la tabella non sarà larga 200 pixel ma il 20% della spazio in cui viene collocata. E così via per le immagini e per tutti gli atri elementi necessari alla costruzione del sito.

Molto succintamente un sito responsive è un sito che è un grado di adattarsi al monitor in cui viene visualizzato senza necessità di esplicitamente richiedere una visualizzazione particolare (una volta molti siti offrivano la possibilità di essere visualizzati in 2 o 3 risoluzioni differenti e l’utente sceglieva in funzione del suo monitor).

Le statistiche parlano chiaro:

• si vendono sempre più smartphone e sempre più tablet
• aumentano le persone che, nei primi venti minuti dopo il risveglio, utilizza un dispositivo elettronico diverso dal pc: chi controlla la posta, chi entra in Facebook e chi effettua un ricerca Google per poi navigare in un sito che soddisfa i criteri di ricerca
• i siti responsive hanno una percentuale di utenti mobile circa 4 volte superiore rispetto ai siti tradizionali: questo significa che un utente mobile, quando capita su un sito tradizionale, la maggior parte delle volte passa oltre alla ricerca di un sito perfettamente navigabile con il device in uso

Soddisfare le esigenze di fruibilità del sito di una platea sempre più vasta è uno dei fattori vincenti del proprio business anche quando non parliamo di e-commerce o di internet-business

Pensate ad una persona che sta viaggiando in treno e con il suo smartphone cerca un ristorante dove pranzare una volta giunto a destinazione.
Un sito di tipo tradizionale potrebbe obbligare questa persona ad uno scrolling continuo all’interno del menù ad esempio, determinando un’esperienza di navigazione quanto meno negativa e quindi, potenzialmente, l’utente cercherà un altro ristorante quando magari sarebbe stato pienamente soddisfatto dalla cucina di quello che stava cercando di esaminare.
Un sito responsive adatterà il menu del ristorante alle modalità di visualizzazione dello smartphone rendendo l’esperienza di navigazione positiva, piacevole ed utile.

Se poi il sito è realizzato con un responsive design ti tipo evoluto, sfruttando appieno le potenzialità della tecnologia Framework (come ad esempio il sito Web Net 3.0 sul quale siete), allora lo smartphone scomporrà la pagina in blocchi che poi proporrà sequenzialmente, sostituirà il menu usato per la versione desktop con un menu realizzato ad hoc per la versione smartphone (quell’icona con le tre linee orizzontali che appare solo quando si naviga da smartphone).

Il responsive design è quindi la scelta ottimale per quanti non necessitano di applicazione specifiche per il mobile e non obbliga alla realizzazione di una doppia versione del sito: versione desktop e versione mobile ready.