Cosa è un sito web responsive

 

In questa breve guida andremo a spiegare cosa sia un sito web responsive e vi daremo alcune utili indicazione per crearne uno.

Teniamo conto che un sito web responsive perfetto deve essere creato comunque da un abile web designer.

Un sito web responsive per definizione è semplicemente un sito web che si adatta ai diversi schermi e alle diverse risoluzioni dei dispositivi che utilizziamo.

Questo perché ormai è stato dimostrato dalle ultime statistiche che il popolo del web naviga su internet a maggioranza tramite dei dispositivi mobili, che essi siano dei tablet, degli smartphone o simili.

Quindi un sito web responsive deve adattarsi alla rotazione orizzontale o verticale, a qualsiasi orientamento, a schermi da cinque pollici come a schermi da undici pollici a uno smart tv da sessantacinque pollici.

Le conseguenze dell’avere un sito che non sia responsive sarà quello di dover scrollare con il dito per raggiungere le informazioni desiderate, e in generale di usare lo zoom in o lo zoom out in continuazione con grande fastidio da parte dell’utente che potrebbe benissimo, dato questo problema, migrare verso siti che siano più accoglienti.

Il sistema di sito responsive è solo uno dei sistemi possibili per adattare la propria vetrina web ai vari dispositivi.

Di certo è la più semplice in quanto il sito si adatterà ai vari formati, mentre la soluzione alternativa è decisamente più complicata, infatti bisognerebbe creare dei siti differenti a seconda dei tipi di dispositivi coinvolti.

 

Come si realizza un sito responsive

 

Partendo dal presupposto che un sito responsive veramente funzionale deve essere realizzato da un professionista nella creazione di siti internet, possiamo dare qualche utile indicazione in modo da far comprendere il funzionamento di tipo tecnico che permette di creare un sito di tipo responsive.

Il primo elemento da considerare è che per dispositivi piccoli è necessario eliminare dal layout degli elementi che non sono essenziali.

Infatti la decisione di mantenere tutto il contenuto del sito anche per la visione tramite uno smartphone dallo schermo di quattro pollici può portare all’effetto controproducente di un grande affollamento di quel piccolo visore.

Quindi è necessario operare delle scelte ed eliminare le parti che non sono indispensabili come solo gli slider, le sidebar e i widget e ammenicoli vari che non sono assolutamente necessari per degli schermi così piccoli.

Un elemento tecnico da inserire è il tag viewport che serve proprio per adattare il proprio sito alle diverse dimensioni degli schermi.

Normalmente il viewport che si utilizza per un sito web da vedere in uno schermo piccolo come quello di uno smartphone è di mille pixel.

Questo serve per avere una visione completa in quasi tutti gli schermi su cui intendiamo operare.

Altri elementi che sono necessari per definire il layout responsive di un sito sono i cosiddetti break out tenendo però il codice html del proprio sito sempre lo stesso.

In sostanza è necessario operare sui cosiddetti fogli di stile.

Un ultimo elemento che intendiamo analizzare è quello di usare dei layout non fissi in pixel ma fluidi con termini percentuali.