Un Sito Responsive è un sito che si adatta al dispositivo su cui viene aperto, una caratteristica fondamentale per un momento in cui è diffusissima la navigazione online da smartphone e tablet più che da PC, perciò che cosa succede ad sito Responsive quando lo apriamo ad uno smartphone o un tablet?

Prima di tutto questa caratteristica la potete vedere anche da PC restringendo la finestra, il nostro sito ad esmpio è Responsive, per questo se andrete a restringere la finestra del browser vedrete che i contenuti si adatteranno allo schermo per questo sarà facile navigare anche da smartphone e tablet. Nel caso opposto invece dove non sia stato sviluppato un sito Responsive sarebbe difficilissimo navigare da smartphone perchè il sito non si adatterebbe allo schermo questo vuol dire che su uno schermo da circa 320 px (larghezza) come di un comune smartphone dovremmo visualizzare un sito fatto ad hoc solo per pc che è largo mediamente 3 volte tanto, provateci…

Per crearne uno è fondamentale avere padronanza delle media queries, un sistema per eseguire le porzioni di codice CSS quando lo schermo è caratterizzato da un numero minore di pixel, adattando perciò la struttura del sito in base alla larghezza del dispositivo con il quale viene visualizzato. La prima cosa da fare è impostare un layout con le dimensioni per PC da codice css, successivamente inseriremo nel codice le media queries modificando le dimensioni del layout (e le relative immagini) per ogni device con le proporzioni standard che vedete nell’immagine.

media-query

Mattia De Zuliani
About Mattia De Zuliani

Mattia de Zuliani, Web Designer e Content Manager da più di 5 anni, specializzato nella gestione dei contenuti di Siti web. Creativo e dinamico.