Non hai un sito responsive? Corri subito ai ripari. E sai perché? Sempre più persone si collegano a Internet da mobile. Ricercano contenuti immediati e facili da consultare attraverso il proprio smartphone e tablet.
Con un design responsive rispondi a questa necessità, adattando il tuo progetto web a qualsiasi schermo. Ma non solo: migliori la user experience, gli individui devono essere accolti nel miglior modo possibile sul tuo sito. A prescindere dallo strumento che utilizzano per raggiungerti.
Questa tecnica ti aiuta a entrare anche nelle grazie di Google. Il motore di ricerca più famoso del mondo dà molta importanza a questa funzione. Big G ha contrassegnato i siti responsive con la dicitura mobile friendly.
Ecco il pensiero dell’azienda: “Responsive Design. Consente di pubblicare lo stesso codice HTML per un URL e utilizza le query supporti CSS per determinare in che modo il contenuto viene visualizzato sul lato client. Questo elimina i possibili problemi di rilevamento dello user-agent e fa sì che gli utenti non vengano reindirizzati. Questa è la configurazione consigliata da Google”.
Quindi, non aspettare più: aggiorna il tuo blog. Ma come realizzare un sito responsive?
Cosa vuol dire sito responsive
Come ti ho già anticipato, costruire un sito responsive design vuol dire renderlo fruibile da qualsiasi dispositivo portatile. Eviti agli utenti tutte quelle azioni complicate che facevano fino a qualche tempo fa.
Hai presente ingrandire in continuazione il testo e leggere per forza in orizzontale la pagina? Un vero incubo, vero? Invece, questa modalità rende la tua piattaforma simile a un abito da indossare in ogni occasione. Cambia la forma ma non la sostanza.
Certo, quando stai per costruire un sito mobile friendly non puoi pensare di trasferire tutti gli elementi che visualizzi dal desktop su tablet e cellulare. Devi dare spazio alla semplicità e ridurre al minimo gli elementi che non servono. Un’attenta riflessione in fase di progettazione ti aiuterà a capire quali componenti lasciare fuori dalla versione responsive. Ti consiglio di stabilire una gerarchia dei contenuti.
Non dimenticare un aspetto importante: il responsive design è stato pensato per soddisfare le persone che attraverso il web vogliono muoversi sul tuo sito in modo semplice e intuitivo. Ad esempio: prenotare un volo, fare un acquisto, prenotare una cena oppure controllare gli orari dell’autobus, leggere una notizia in tutta comodità.
Se gli utenti riescono a fare almeno una di queste attività sul tuo sito hai maggiori possibilità che si trasformino in potenziali clienti.
Per approfondire: quale font scegliere per il tuo blog.
Cosa devi sapere per creare un sito responsive
Un web designer per realizzare o trasformare un sito già esistente in modalità responsive deve conoscere il codice HTML. Devi lavorare sodo con il metatag viewport e le media query.
- Il viewport: questa stringa di testo suggerisce al browser la larghezza della pagina in base allo schermo del dispositivo mobile.
- Le media query: sono moduli Css3, servono per creare stili diversi che si adattano a tutti i contenitori.
Tuttavia, oggi puoi anche evitare di mettere mano al codice. I CMS più comuni supportano già dei template responsive, devi solo scegliere quello adatto al tuo progetto e installarlo. Basta seguire i tutorial sui siti ufficiali.
I principali CMS: WordPress, Joomla, Prestashop hanno cataloghi molto forniti dove puoi pescare a piene mani. A proposito, sai cosa è un CMS, vero? Un sistema che ti permette di gestire contenuti. Ovvero un software con il quale puoi costruire siti internet anche se non sei un grande conoscitore del codice HTML.
Ancora una cosa: non dimenticare di dare la giusta attenzione anche a immagini e video. Anche questi elementi devono essere scelti in ottica responsive. Soprattutto devono essere utili: gli elementi visual non devono essere usati per spezzare il testo ma per arricchirlo con elementi utili all’economia del contenuto.
Con Bootstrap il template responsive lo crei tu
I template responsive sui siti ufficiali non ti hanno convinto? Prova a costruirlo da solo con l’aiuto di Bootstrap. Che cosa è questo strumento?
È un framework che i web designer usano per creare pagine web. Raccoglie componenti grafici e funzionali. Ti sto parlando di convenzioni HTML e CSS, form di contatto, tipi di font, tabelle e griglie. Tutti elementi che possono essere aggiunti facilmente al tuo sito e in modo gratuito.
La tua opinione
Realizzare un sito web responsive non è più una scelta ma una necessità. Le persone quando visitano il tuo blog devono raggiungerti con facilità, usando lo strumento che preferiscono.
E poi, in un mondo sempre più mobile non puoi rischiare di non essere al passo con i tempi. Tu hai un sito responsive? Quali sono i tuoi consigli? Lascia la tua opinione nei commenti, parliamone insieme.
Lascia un commento