Che cosa significa sito web responsive
Realizzare un sito web che sia definito responsive significa creare un layout dinamico quasi intelligente che riesca a riconoscere il dispositivo attraverso il quale viene aperto e automaticamente riesce ad adattarsi alle dimensioni utilizzate senza rinunciare a menù, griglie e contenuti.
Che si utilizzi un pc oppure un tablet o uno smartphone non ha importanza in quanto un sito web responsive è flessibile e consente una navigazione semplice ed efficace sempre.
Quali sono i vantaggi di un sito web responsive
Il traffico internet che viene generato attraverso i dispositivi mobile è in forte crescita, sono sempre di più le persone che invece di utilizzare il personal computer scelgono di connettersi e di navigare con il loro smartphone.
Quindi se si possiede un sito web bisogna adeguarsi a queste nuove tendenze offrendo alla community dei portali che siano semplici ed intuitivi anche se si usa un dispositivo touchscreen.
Anche l’indicizzazione su Google viene migliorata in quanto i siti responsive hanno lo stesso URL e lo stesso codice HTML su ogni tipo di dispositivo in cui vengono guardati.
Gli aggiornamenti sono ottimizzati in quanto è sufficiente farli su un solo dispositivo e in automatico vengono sincronizzati ovunque.
Differenza sito responsive e non responsive
La differenza è la praticità infatti un sito non responsive si vedrà lo stesso su un tablet o su uno smarthphone ma probabilmente costringerà il visitatore a fare dei continui zoom per riuscire a vedere tutti i contenuti e di conseguenza maggiori saranno le probabilità che il navigatore si stufi e abbandoni velocemente il sito.
Come realizzare un sito web responsive
La prima cosa da fare nella creazione di siti web responsive è quella di sceglierte i contenuti da mostrare.
Cercare infatti di mantenere intatta la struttura del sito su ogni tipo di dipositivo spesso è inutile e poco efficace.
Banner, menù secondari, sidebar, widgets, immagini, appesantiscono la navigazione su schermi estremamente ridotti e quindi il navigatore deve vedere le cose essenziali essendo in uno spazio ridotto.
Inoltre bisogna utilizzare il metatag viewport ossia inserire nell’head il seguente codice:
meta name=”viewport” content=”width=device-width”
Tale codice ci consente di assegnare esattamente la larghezza del device alle pagine del nostro sito.
Altra informazione fondamentale per la realizzazione di un sito web responsive è quello di mantenere inalterato il codice html e quindi bisogna creare delle pagine assegnando loro delle regole particolari che vengono messe in atto a seconda del dispositivo.
Questo è possibile attraverso l’utilizzo di meta query che di solito sono almeno due una per i tablet e l’altra per gli smartphone.
Il concetto di pixel viene superato in quanto si ragiona sulle percentuali di grandezza che devono essere adattate agli schermi quindi i layout devono essere abbastanza fluidi e devono rispettare le misure preimpostate.
Molto utile infine è l’utilizzo di framework che possono essere istallati facilmente, alcuni sono già completi di tutte le regole sopracitate e quindi snelliscono di molto il lavoro altri sono parziali e vanno implementati.
Avere un sito responsive non è una scelta è un’esigenza reale se si intende stare al passo con i tempi.