Come creare un sito web responsive


Postato in data Maggio 27th, da Riccardo Esposito in Vita da Webmaster. No Comments

Oggi è impossibile procedere in una buona attività di marketing senza un sito web responsive. Vale a dire un portale pensato per adattarsi a tutti i dispositivi, dal laptop allo smartphone. Senza dimenticare i tablet. Perché è necessario questo?

L’aumento del traffico che arriva da cellulare è in costante crescita. Le persone si connettono a internet soprattutto attraverso smartphone: anche se ci sono dei settori in cui il desktop mantiene una buona percentuale di visite procedere senza una strategia mobile è impensabile.

Quindi, come creare un sito web responsive? Quali sono i passi per realizzare un progetto con pagine web capaci di adeguarsi e adattarsi alle moderne tecnologie di navigazione?

Differenza tra responsive e mobile friendly

Direi di affrontare, in primo luogo, una serie di definizioni che possono aiutare a prendere in considerazione l’argomento. Un sito web responsive si definisce tale quando si presenta con un contenuto dinamico che cambia, le immagini si ridimensionano e gli spazi prendono la giusta forma in base alle esigenze.

Un sito mobile-friendly, invece, presenta una versione per i dispositivi semplificata. Non si adatta allo schermo come il responsive ma evita eventuali problemi di usabilità perché viene ridotto al minimo, riducendo tutte le possibili fonti di difficoltà nella navigazione.

Quale soluzione scegliere? In realtà è il mercato ad aver deciso per noi. Oggi è praticamente impossibile aprire un blog senza un template responsive. In passato c’era questa differenza e si installavano plugin WordPress per creare versioni mobile-friendly dei siti web e blog.

Erano delle soluzioni orribili se le guardi ora ma all’epoca era già tanto. Oggi la soluzione è semplice: cerca e installa un template responsive. Anche se non sono tutti uguali. Devi prestare attenzione al modello che preferisci per dare una veste ai contenuti migliori.

Da leggere: bounce rate, abbassare la frequenza di rimbalzo

Usa un tema responsive e veloce (sul serio)

La base di partenza è chiara: per avere un sito web adatto a cellulari, tablet e computer devi scegliere un template che consenta di adattarsi a questi schermi. Ecco che entrano in gioco i temi responsive, che sono pensati per fornire un’unica versione dello stesso sito web ma che si adatta alle necessità. Non tutte le soluzioni, però, sono adeguate allo scopo.

Ecco perché ho precisato: il template deve essere veramente responsive. Nel senso che conviene mettere da parte le vecchie versioni di temi con soluzione mobile friendly.

Ma anche quelle strutture che, pur essendo responsive, diventano un problema per chi naviga. E per il webmaster che deve ottimizzare i dettagli per rispettare l’usabilità. Spesso il design rischia di mettere in discussione questi aspetti: meglio puntare sulla semplicità.

Velocità del sito responsive: quale scegliere

Uno degli aspetti da prendere in considerazione per definire un tema: assicurati che offra una base snella e veloce. Si parla molto bene del framework Genesis che ho provato personalmente su alcuni progetti e confermo la sua capacità di adeguarsi alle esigenze di chi cerca un tema responsive e rapido. Altri temi che ti possono aiutare su questa line:

  • Bridge.
  • Newspaper.
  • TheGem.
  • Pofo.
  • Pillar.

Sono template a pagamento ma funzionano veramente bene. Però per pretendere il meglio in termini di velocità consiglio di lavorare con un hosting performante: solo così puoi ottenere il massimo. Un sito web responsive deve poter fare affidamento su basi solide.

Blog: punta sulla tecnologia AMP Google

Se decidi di lavorare con un blog può far comodo avere a disposizione un sistema che ti consenta di creare pagine veloci per caricare il sito web in tempi minimi. La velocità di un blog dipende da diversi fattori, ma con la soluzione AMP puoi dare un’accelerata senza pari.

Questa realtà, infatti, consente di creare delle copie adatte alla navigazione mobile: sono snelle, quindi velocissime. Puoi attivare le pagine AMP con un semplice plugin e monitorare eventuali errori da search console. Solo un punto: alcuni aspetti grafici dovranno organizzarsi a causa del cambio d’impostazione. Però tutto si può aggiustare con un bravo webmaster.

Come attivare pagine AMP.

Come attivare AMP (Accelerated Mobile Pages) sul tuo blog o sito web? La soluzione migliore è quella che chiama in causa plugin specifici per ottenere il risultato. Uno dei migliori risponde al nome di AMP per WP – Accelerated Mobile Pages, perfetto anche per WordPress Gutenberg.

Regole base per l’usabilità di un sito mobile

Questo aspetto è importante perché, molto spesso, ci riduciamo a montare un template responsive ignorando tutti i passaggi che potrebbero essere comunque in grado di vanificare la navigazione da mobile. Quali sono gli aspetti da considerare? Abolire Flash da qualsiasi pagina web? Questa è la base, l’ovvio: ecco qualche punto che dovresti sempre valutare.

  • Menu di navigazione hamburger.
  • Font generoso, non troppo piccolo.
  • Evita immagini e video inutili.
  • Crea spazio adeguato intorno ai bottoni.
  • Usa anchor text facili da selezionare.
  • Non mettere elementi troppo vicini.
  • Allarga le immagini più importanti.

Ricorda che in questi casi al search console di Google può aiutarti perché vengono segnalati gli errori di usabilità. Ma al tempo stesso hai diversi strumenti che ti aiutano a verificare l’adeguatezza del tuo sito rispetto agli standard richiesti da Mountain View. Qualche esempio?

Il punto è questo: ciò che sembra facile e immediato da desktop diventa difficile sullo smartphone. Di conseguenza devi semplificare. Cura la leggibilità, dividi il testo in paragrafi.

Ancora un consiglio utile: togli le immagini che non servono. E se ci sono dei grafici con numeri piccoli assicurati che siano facili da leggere magari con un ingrandimento della grafica.

Per approfondire: migliorare la velocità di une commerce

Come e perché creare sito web responsive

Forse perché Google ha indicato la capacità di adattarsi alle esigenze del pubblico mobile come un elemento utile al posizionamento SEO? Certo, ma il punto deve essere a monte: lo devi fare per i tuoi utenti, in modo da fornire qualcosa di valido ed essenziale. Ma soprattutto facile da consultare. Sei d’accordo? Hai già creato un sito web responsive per la tua realtà?

Riccardo Esposito

Blogger per Serverplan, webwriter freelance e autore di My Social Web. Scrivo ogni giorno. Ho pubblicato un libro dedicato al mondo del blogging. Ah, l'ho già detto che scrivo?

Latest posts by Riccardo Esposito (see all)





Lascia un commento

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

*

Shares