Come creare un sito web mobile friendly

Quali sono i passaggi fondamentali per avere un sito web responsive e adatto a tutti i dispositivi mobile? Ecco quello che devi sapere per lavorare al meglio con il web.

Creare siti mobile friendly è indispensabile per rafforzare la tua presenza nel mondo di smartphone, tablet e altri dispositivi che puoi indossare e portare ovunque.

come creare siti mobile friendly
Progettare un sito web responsive.

Grazie a un sito mobile i potenziali clienti possono trovare il tuo brand fuori casa, ma anche in un contesto domestico dove i dispositivi mobili sono molto utilizzati.

Perché creare un buon sito web mobile

Già, perché pubblicare un portale per navigare su smartphone e tablet quando puoi progettare e vendere una applicazione?

Creare un’app è più complicato: hai bisogno di un bravo sviluppatore, devi creare diverse versioni dell’app per i numerosi dispositivi, devi pubblicare il risultato negli app store online. E devi aggiornarla con nuove funzionalità.

Con un per il sito mobile marketing non hai di questi problemi. Ci sono diverse alternative sul mercato che ti permettono di costruire, progettare, personalizzare, aggiornare e gestire un sito mobile. Ma devi avere una strategia chiara di ciò che vuoi ottenere, e devi focalizzare gli obiettivi da raggiungere. Ti propongo alcuni consigli base per creare un sito web mobile che sia davvero utile.

Da leggere: come creare un blog, la guida

Cura la velocità del caricamento pagina

Ricorda che gli utenti sono mobili. Questo significa che sono persone in movimento, hanno poco tempo per usare il tuo sito web e hanno bisogno di compiere le operazioni rapidamente, senza troppi passaggi. E soprattutto senza aspettare.

I tempi sono molto importanti, rappresentano un fattore di caricamento per Google e rappresentano un elemento per la SEO. Ma anche per l’usabilità mobile (e non). Iniziare da un buon tema responsive, pulito e senza orpelli, è decisivo.

Non replicare, adatta ciò che ti serve

Tutto ciò che usi sul tuo sito desktop ha un valore, non è detto che sia replicabile su quello mobile. Scegli solo gli elementi importanti per i tuoi clienti e il tuo business.

E organizzali in modo che siano facilmente accessibili.Pensa sempre al fatto che questo sito web dovrà essere sfogliato in situazioni diverse dalla poltrona di casa.

Vai oltre gli smartphone più famosi

Gli smartphone non sono l’unico tipo di telefono cellulare. Ci sono anche i tablet e i phablet, dispositivi a metà strada tra cellulare e tablet. Inoltre molte persone possiedono ancora un normale cellulare dotato di connettività WAP o GPRS.

come progettare sito
Hai progettato un buon sito web?

Senza dimenticare chi naviga ancora con il 3G, soprattutto se hai un sito web internazionale devi valutare quest’aspetto. Assicurati che il tuo sito sia visibile anche dai cellulari di vecchia generazione. A tal proposito può essere utile un controllo su Test My Site di Google che verifica la velocità anche con il 3G.

Usa un tema responsive adeguato

Non deve essere solo un template mobile friendly, quindi adatto ai dispositivi portatili, ma capace di adattarsi a qualsiasi schermo. Quindi anche alle smart TV. Assicurati che sia un tema veloce e snello, e che possa essere personalizzato senza problemi.

Utilizza gli stessi colori, font, sfondo e logo (ben visibile) che usi sul tuo sito web visibile su desktop. Non confondere l’utente, fai in modo che i tuoi clienti si sentano subito a casa. E che riconoscano subito le caratteristiche del tuo brand.

Devi aggiungere un bottone chiama ora

Se hai un business con una sede fisica non dimenticare la mappa, l’indirizzo e un pulsante click-to-call per chiamarti con un solo gesto. Per farlo puoi usare un plugin WordPress Call Now Button oppure usare il codice HTML. Esempio:

<span itemprop="telephone">
<a href="tel:prefisso+numero">chiama il numero</a>
</spam>

Attenzione, nell’esempio in alto ho aggiunto anche il contributo di Schema.org con i microdati per far capire a Google che si tratta di un numero di telefono.

Usa testi grandi, capaci di farsi leggere

Scegliere il font del sito web è importante. Sugli schermi dei dispositivi mobili, di solito, le lettere sono troppo piccole. Utilizza un carattere che sia abbastanza grande e definito, in modo che le persone possano leggere facilmente i tuoi testi.

Questo aspetto può essere valutato sul test di usabilità di Google. La leggibilità da mobile è importante, viene valutato come errore anche nella search console.

Comprimi le tue Immagini, usale bene

Le tue immagini fanno la differenza su un sito web ma devono caricarsi velocemente, evitare inutili zoom e adattarsi alla dimensione degli schermi mobile.

Soprattutto devono essere immagini utili: secondo Google, infatti, la presenza di tanto visual rallenta la pagina, un possibile fattore che diminuisce le conversioni.

creare siti web mobile friendly
Crea siti web facili da navigare e veloci.

Spesso, inoltre, si pensa di caricare immagini senza un’adeguata compressione rendendo la pagina web più pesante. Per velocizzare un sito c’è bisogno di programmi per comprimere le immagini online, tra i tanti io suggerisco Optimizilla.

Struttura una navigazione semplice

Permetti ai clienti di navigare con un semplice gesto. Il menu di navigazione a panino è la soluzione miglior per il mobile (non per il desktop): assicurati che l’architettura del sito sia semplice, che non ci siano inutili sottomenu e tendine, e che i microcontenuti delle etichette siano chiari. Semplifica tutte le operazioni.

Prova tutto prima di andare su internet

Controlla i link, apri i menu, rivedi i testi. Assicurarti che il sito risulti perfettamente visibile sia con lo schermo in verticale (portrait), sia in orizzontale (landscape).

Puoi fare una verifica con lo strumento ispeziona di Google Chrome che consente di visualizzare il sito attraverso il monitor di diversi modelli di smartphone e tablet. Oppure puoi usare questo ottimo mobile test device di mobilemoxie.

Da leggere: come caricare una foto su WordPress

Come creare siti mobile friendly per te

Questa è solo la base di partenza per avere un punto di riferimento online valido sia per desktop che per telefonino. Come creare siti mobile friendly? Pensa sempre alla semplicità, alla necessità di essere più immediati e veloci. Non basta questo ma di sicuro è un buon punto di partenza. Sei d’accordo?

Riccardo Esposito
Sono un web writer freelance. Mi occupo di scrittura online dal 2009, mi sono specializzato nella stesura di piani editoriali per blog aziendali. Ho scritto 3 libri dedicati al mondo del blogging e della scrittura online.

6 COMMENTI

  1. Io, sinceramente, non concordo sul fatto di puntare anche sui cellulari di vecchia generazione, per due motivi:
    1. Presto (nel giro di 2 o 3 anni) questi terminali spariranno quasi del tutto.
    2. Adattare un sito a vecchi dispositivi comporta dei costi aggiuntivi che, a mio avviso, possono essere evitati.

    Per il resto sono in linea di massima d’accordo su tutto. Gran bell’articolo, complimenti. 🙂

    • Ciao, grazie per il commento. I cellulari di vecchia generazione sono ancora molto usati nei paesi emergenti (Africa, ad esempio), quindi è una fetta di mercato che bisogna valutare. Poi, chiaramente, dipende dal tuo business.

    • Grazie Francesco, è una risorsa utile. E apprezzo soprattutto il discorso che ruota intorno al Responsive Web Design Sketch Sheets: fondamentale! Tu non credi?

  2. Da quando ho scoperto un plugin wordpress che permette di scegliere un tema diverso, quando il sito/blog è visualizzato dagli smartphone, ho ragionato anche io sul fatto di adattare la grafica.
    La grafica che utilizzo l’ho creata io e, spontaneamente, ho seguito vari punti che hai suggerito in questo “decalogo” 🙂
    Ho dato spazio solo ai post – senza barre laterali che nel blog fanno da contorno e invogliano la navigazione e l’esplorazione (ma quando qualcuno visita un blog dal telefono o da un tab, è anche possibile che conosca il tuo sito e sia lì proprio per aggiornarsi un po’, cerca qualcosa di preciso o magari solo gli ultimi aggiornamenti) – e ad una serie di metodi di ricerca ed esplorazione inseriti sotto la lista degli ultimi articoli: lista dei tag, motore di ricerca e archivio per mesi, giusto per dare la possibilità di muoversi un po’ all’interno, ma senza dare troppa importanza alla cosa.
    Ho scelto di riadattare la grafica che ho sul blog, cambiando un po’ le misure e sistemando tutto in funzione di uno schermo meno grande e l’ho sistemato andando a navigare il blog sul mio telefono stesso.
    Il suggerimento legato al “controlla i link, vedi se è tutto ok, naviga il sito per vedere se è comodo” lo trovo quello più giusto, infatti è un’altra di quelle cose che ho fatto spontaneamente per capire l’impatto immediato su chi mi avrebbe visitata da telefonino 🙂

    In poche parole, trovo i tuoi consigli assolutamente interessanti e mirati, c’è il buon senso dietro e, come sempre, è l’unica cosa cui affidarsi 😉

  3. Sulla larghezza ho sempre paura di esagerare…
    Io che uso un 16:9 sono comodissima, ma qualcuno che invece ha ancora un monitor con diversa risoluzione potrebbe trovare scomodo usare lo scroll orizzontale, anche se comunque la larghezza da me scelta non va incontro a delle precise misure, ho cercato di fare ad occhio 🙂
    Il menu in alto è partito così, un po’ nascosto, perché i contenuti del blog sono tutti nei post e non sulle pagine. Ero partita con un semplice CHI SONO, come pagina, in cui c’erano scritte 3 righe su di me e l’indirizzo e-mail ma oggi, con quell’ampia descrizione che contiene i link ai post in cui ho attraversato le varie fasi che racconto, e l’aggiunta della galleria e dello shop, dovrei iniziare a considerare il consiglio che mi hai dato qui in proposito.
    Ci penserò, grazie di essere passato a trovarmi ^_^
    Cinzia

RISPONDI AL COMMENTO

Please enter your comment!
Please enter your name here