sito-internet-responsive

Come Creare Siti Web Responsive – La Guida

Cos’è Un Sito Responsive

Con l’avvento degli smartphone negli ultimi anni il traffico internet come lo conoscevamo è cambiato radicalmente – quando prima per effettuare una ricerca dovevamo essere a casa, con il nostro pc, collegati alla linea adsl, adesso abbiamo nelle nostre tasche uno degli strumenti più potenti che ci siano in circolazione. Basta estrarre il telefono per eseguire qualsiasi ricerca, scaricare file e guardare perfino video e film in streaming – i dati parlano chiaro e nell’arco di tempo tra il 2013 ed il 2014 le ricerche da smartphone e tablet hanno superato le ricerche da postazioni desktop (per intenderci quelle che effettuate da pc),  creando così una nuova nicchia di consumatori.

Potete verificare voi stessi questi dati andando a vedere le statistiche di Google Analytics, se non avete ancora impostato Google Analytics sul vostro sito creato con WordPress è ora di farlo guardando su questo articolo.

Ci troviamo di fronte ad una nuova generazione di utenti, persone che hanno tutto a portata di pollice e che difficilmente usano ancora il pc, se non strettamente necessario, ed anche noi, che dobbiamo rapportarci con questo pubblico, siamo coinvolti in questa rivoluzione digitale – dobbiamo riuscire a creare un sito che i nostri utenti riescano ad utilizzare tranquillamente da qualsiasi tipo di schermo, in modo da continuare a vendere i nostri prodotti e servizi mentre loro sono in palestra, in giro per il mondo ed anche mentre sono a letto prima di dormire. Sicuramente vi sarà capitato di entrare in qualche sito non ottimizzato per il vostro telefono o tablet e vi sarete subito innervositi per le continue manovre di ridimensionamento che vi saranno toccate per riuscire a leggere o per acquistare qualcosa, sappiate che c’è gente che quando vede che il sito non è ben ottimizzato lascia immediatamente la pagina, ecco perchè dobbiamo capire come creare siti web responsive per i nostri lettori ed evitare che se ne vadano prima che abbiano acquistato o letto i nostri articoli.

creare siti web responsive per ogni schermo

creare siti web responsive per ogni schermo

Perchè è Importante Creare Siti Web Resposive

Oltre ad essere molto scocciante per l’utente che naviga sul nostro sito web, il mobile responsive è diventato un fattore molto importante per il posizionamento su Google e sugli altri motori di ricerca – tantissimi siti sono stati penalizzati per non essere disponibili nella versione mobile e, nonostante abbiano una certa importanza, potrebbero essere superati nei risultati di ricerca da siti più piccoli, ma che sono stati in grado di adattarsi prima a questo nuovo trend. Google, nelle sue linee guida, parla chiaramente, l’esperienza dell’utente viene posta prima di tutto il resto – potrete avere il miglior sito del mondo in fatto di prodotti e servizi dedicati ai vostri clienti, ma se quando una persona entra da un dispositivo mobile ed è incapace di navigare allora la sua esperienza sarà pessima e non ci tornerà più – per questo che i motori di ricerca stanno molto attenti a quello che fanno le persone all’interno di un sito, e nel caso il vostro tasso di abbandono sia molto alto dovrete lavorare per migliorarlo altrimenti sarete penalizzati. Creare siti web responsive ormai è diventato una delle cose fondamentali per la vostra attività online, sia che stiate vendendo qualcosa o semplicemente scrivendo per i vostri amici e conoscenti, quindi cerchiamo di metterci nell’ordine di idee di realizzare od aggiornare il nostro sito per ospitare al meglio chi verrà a visitarlo in futuro.

sito-internet-responsive

sito-internet-responsive

Come Realizzarlo Su WordPress

Il bello di un sistema automatizzato come wordpress è che gran parte del lavoro è già stato fatto, ci sono dietro una gran quantità di sviluppatori che hanno già pensato a portare avanti la realizzazione del responsive design su tutta la piattaforma – a voi non resta che scegliere un tema che sia responsive e avrete già risolto tantissimi problemi e noie che potrebbe darvi la programmazione web nei vari linguaggi. Ma come vi dico sempre, non affidatevi al primo tema che trovate carino! Scegliete con criterio e cercate qualcosa di professionale che “non vi lasci a piedi”, ci sono miliardi di temi per wordpress ma non tutti sono adatti ad un sito professionale, anzi.

Se ancora non lo hai fatto, scopri come creare il tuo nuovo sito in WordPress qui.

Il mio consiglio è quello di guardarvi qualche piccola selezione di temi su ThemeForest e cercare quello che si adatta di più al vostro tipo di esigenze, sono tutti lavori creati da web designer professionisti che in caso di aiuto vi seguiranno senza problemi – per non parlare della community alle spalle che potrà aiutarvi nel caso abbiate bisogno di qualcosa, e dei vari filtri che vi permetteranno di selezionare i migliori temi venduti e quelli meglio recensiti. Una delle possibilità che avete su di un portale come ThemeForest è quella di poter selezionare anche le categorie di prodotti, quindi armatevi di voglia e pazienza e cercate dei temi con buone recensioni e tanti acquisti che siano ottimizzati per la seo, o comunque seo friendly. In questo modo avrete un tema ben ottimizzato, in linea con tutte le direttive Google e che sarà anche responsive, che vi garantirà un ottimo rendimento in fatto di velocità del sito (solitamente i temi premium, cioè quelli a pagamento, sono fatti da esperti che sanno come ottimizzare i template per renderli più veloci) e il vostro sito apparirà scalabile su ogni dispositivo che accederà al vostro portale.

Come Realizzarlo in Html

Se invece siete degli amanti della programmazione e avete voglia di cimentarvi in questo percorso come ho fatto anche io, non vi resta che armarvi di pazienza e voglia di fare e studiare qualche nozione di web design ed iniziare il vostro bellissimo sito. La soddisfazione di aver realizzato qualcosa con le proprie mani è irripagabile assolutamente, per questo che vi consiglio di dare un occhiata a qualche corso online per apprendere qualche cosa di nuovo e magari imparare a modificare e costruire da soli i vostri prossimi progetti. Magari potreste farne anche il vostro lavoro e vendere le vostre realizzazioni sui portali come ThemeForest 😉

creare siti web responsive in html

creare siti web responsive in html

Se cercate qualche risorsa utile per iniziare a programmare in html e creare siti web responsive vi consiglio:

Udacity – Progetto davvero molto bello, video lezioni e test online che vi guideranno nella realizzazione di un sito web. Io l’ho seguito e mi sono trovato davvero bene, il corso è gratuito e vi garantirà un’ottima base per iniziare il vostro percorso da web developer.

CodeCademy – Uno dei corsi più belli che ho trovato sul web, vi insegneranno i linguaggi di programmazione del web (Html & CSS) con un interfaccia molto semplice e molto ben studiata. Consigliato anche per chi vuole studiare altri linguaggi di programmazione più complessi.

Udemy – Questo marketplace è davvero uno dei più completi in fatto di corsi online e risorse gratuite per iniziare il vostro percorso da programmatori di siti web, vi ho segnalato uno dei corsi che ho seguito anche io e che ho trovato molto ben fatto.

Per iniziare a programmare il layout responsive dovrete comunque seguire questi passaggi base, prima di tutto inserire il meta tag relativo alla visualizzazione della pagina su qualsiasi dispositivo che venga impiegato per aprire il vostro sito web:

<meta name="viewport" content="width=device-width" >

Dovrete decidere quali sono i contenuti da mostrare e quali no, infatti quando andrete a realizzare lo schema per la visualizzazione sui vari smartphone e tablet dovrete tener conto della grandezza del display e dovrete decidere quali oggetti mostrare e quali no per non andare ad intaccare la user experience con oggetti inutili. Una volta decisi dovrete realizzare lo style di tutti questi elementi, adattato per ogni tipo di schermo, impostando la grandezza minima e massima del display con i codici css adatti.

@media (min-device-width : ***px) and (max-device-width : ***px) {
/* Smartphone  */
}

Su Udemy ci sono anche tantissimi corsi che spiegano come creare siti web responsive in wordpress partendo da un file pdf – cioè potreste aver visto un bellissimo template per un sito, decidete che deve essere vostro assolutamente ed acquistate il disegno in pdf. Con questi corsi specifici riuscirete a realizzare il vostro tema per WordPress sulla base del disegno in pdf senza dover ricorrere a persone esterne che facciano il lavoro per voi.

Quindi a voi la scelta, se volete creare qualcosa da soli adesso avete tutte le risorse necessarie per creare siti web responsive sa zero, mentre se avete optato per WordPress e tutti i suoi benefici allora è il momento di affidarvi a qualcosa di professionale, studiato appositamente per garantirvi velocità, leggerezza e adattamento ad ogni tipo di schermo. Ricordatevi di aggiornare il vostro sito il prima possibile per non incorrere in penalizzazioni che vi farebbero perdere clienti e denaro, per qualsiasi altra cosa scrivetemi e non dimenticate di iscrivervi alla mailing list per non perdervi neanche una novità del nostro sito.

0 commenti

Lascia un Commento

Vuoi partecipare alla discussione?
Fornisci il tuo contributo!

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *