Il sito responsive è già un imperativo, un obbligo. Oltre metà del traffico proviene dai dispositivi mobili; le versioni mobile only (come m.sitoweb.it) non sono versatili né facili da gestire. Il responsive garantisce invece un sito web che è sempre sé stesso, ma cambiando le proprie dimensioni in base al dispositivo su cui gira. Detto ciò, non c’è un’unica via per progettare un sito responsive.

Questa non è una guida pratica, non entreremo nelle profondità dei codici con cui realizzare un sito responsive. Parleremo invece dell’idea, di quello che sta prima delle realizzazione. Insomma, per un Web Designer ci sono varie tecniche per tracciare, disegnare questo risultato responsive. Una è più utilizzata di altre, e oggi vogliamo metterla in discussione.

Progettare un sito responsive a partire dal Desktop

Generalmente si passa al responsive usando come base il sito Desktop, quello in versione completa. Dal suo interno, per ridurre la quantità di elementi, si rimuovono le parti non essenziali. Immagini secondarie, qualche decorazione, paragrafi aggiuntivi (in questo caso non fate arrabbiare il Copywriter). Quello che rimane è appunto l’essenziale; costituirà il contenuto della versione riadattata agli schermi di smartphone e tablet.

Questa tecnica adatta facilmente molti siti allo spazio inferiore (soprattutto parlando di versioni smartphone). Resta la soluzione più pratica per i siti web già esistenti ma non ancora ottimizzati, da trasformare in responsive. Ma ha un difetto: non consente il pieno controllo del nuovo design. La disposizione del Mobile viene per forza condizionata dall’aspetto del sito originale. Questo lascia meno spazio alla creazione di un layout ideale, come magari lo si costruirebbe da zero, senza influenze preesistenti.

Progettare un sito Desktop a partire dal responsive

E se avessimo un differente punto di vista? L’idea è di partire direttamente dal design della versione responsive. Insomma, progettare un sito responsive prima, e poi sviluppare la versione Desktop! In tal modo si può ottenere il massimo controllo sul layout e sulla disposizione, così da gestire nel modo migliore gli elementi fondamentali del sito. Il Mobile ha acquisito così tanta importanza che questo processo inverso può diventare necessario.

Una volta creata la versione Mobile, si disegna quella Desktop aggiungendo nuovi elementi. Il fatto che siano parti non fondamentali, comunque, non deve ingannare: devono saper dare informazioni aggiuntive e maggior valore, a chi vuole un’esperienza più completa. Detto ciò, chiariamo che la scelta della tecnica varia a seconda delle esigenze. Si tratta di un metodo alternativo, che non cancella quello precedente. A seconda dell’obiettivo, si può scegliere il più adatto.

Consigli aggiuntivi in ambito responsive

Prima di concludere, vale la pena menzionare un paio di trucchi in tema responsive. Prima di tutto, tracciate delle bozze comparative su carta ancor prima che al PC! Vedere le due versioni disegnate una accanto all’altra vi aiuterà a tenere d’occhio la coerenza tra Desktop e responsive. La carta fa sempre un effetto diverso, più neutrale; rappresenta un ottimo punto di vista aggiuntivo.

Per finire, ricordate una regola somma del Web Design per Mobile. Non utilizzate troppi effetti (o effetti troppo pesanti) che finirebbero per appesantire il sito. Certo, è un’ovvietà, ma nel Mobile le conseguenze sono sicuramente peggiori che nel Desktop! Quest’ultimo riesce spesso a sopportare; il Mobile invece finirebbe per rallentare sensibilmente il suo caricamento, creando seri problemi di usabilità.

Speriamo che l’articolo vi sia stato utile! Ricordate che potete richiedere un Sito Web vetrina responsive ai freelance di Shiny Comunicazione, contattandoci tramite il nostro form o dalla nostra pagina Facebook!