Suggerimenti su come rendere il tuo blog più mobile friendly

Pubblicato: 2017-02-25

Google ha recentemente annunciato che utilizzerà l'aggiornamento dell'algoritmo ottimizzato per i dispositivi mobili per verificare se tutti i blog sono ottimizzati per i dispositivi mobili e penalizzerà coloro che non lo sono. Il che ha lasciato molti blogger a chiedersi, come rendere i loro siti Web più ottimizzati per i dispositivi mobili e come sapere anche se il tuo blog è ottimizzato per i dispositivi mobili o meno. Ecco perché mettiamo insieme le informazioni più vitali sul perché rendere il tuo blog più mobile-friendly è così importante e su come farlo effettivamente.

Al giorno d'oggi, una gran parte dei visitatori del blog utilizza i propri dispositivi mobili anziché i computer per farlo. E poiché Google ha promesso di aumentare le classifiche dei siti, che sono adatti alla visualizzazione su dispositivi mobili, è più importante che mai assicurarsi che il tuo blog o sito Web sia compatibile con i dispositivi mobili.

Naturalmente, non si tratta solo di ciò che Google vuole. Rendere il tuo blog mobile friendly è anche nell'interesse tuo e dei tuoi lettori, perché, dal momento che così tante persone usano i loro dispositivi mobili per navigare in Internet, renderà loro più comoda la lettura del tuo blog. Secondo la ricerca del Pew Internet Project, più di un terzo di tutti i possessori di telefoni cellulari usa il proprio telefono più del proprio desktop o laptop per accedere a Internet. Quindi, se vuoi che il tuo blog sia facilmente visualizzato su qualsiasi smartphone e aumenti il ​​numero di lettori del tuo blog, la compatibilità con i dispositivi mobili è qualcosa a cui devi pensare. E in realtà è più facile da raggiungere di quanto si possa pensare.

Test per la compatibilità mobile

Quando Google ha inventato questo algoritmo ottimizzato per dispositivi mobili, ha anche consentito a tutti di testare i propri blog e siti Web per questa metrica utilizzando il loro strumento di test ottimizzato per dispositivi mobili. Basta inserire l'URL del tuo blog nella casella " Inserisci URL per testare ", fare clic su " Esegui test " e lo strumento ti dirà se il tuo blog è mobile friendly o meno.

Se il tuo sito web è mobile friendly, puoi rilassarti un po', perché non devi fare nulla. Tuttavia, se questo strumento di Google determina che il tuo blog non è il più facile da leggere su un dispositivo mobile, devi apportare alcuni miglioramenti in questo reparto il prima possibile.

Per coloro che utilizzano un software di gestione dei contenuti (CMS) per gestire il proprio blog, come WordPress, Joomla!, Drupal, Blogger, Tumblr, Google Sites, Bitrix ecc., la personalizzazione non dovrebbe essere un problema, poiché la maggior parte di questi sistemi software offrire strumenti che renderanno automaticamente il tuo sito web ottimizzato per i dispositivi mobili. Ma, se sei andato alla radice più vecchia della scuola di non utilizzare alcun software CMS per creare il tuo sito Web, o se hai utilizzato CMS, ma il tuo sito Web non è ancora all'altezza degli standard mobili, ecco alcuni suggerimenti su come migliorare la compatibilità mobile del tuo sito.

1. Aggiorna CMS all'ultima versione e usa temi mobili

Se utilizzi CMS, tutto ciò che devi fare è aggiornare il tuo software o cambiare il tema che stai utilizzando per il tuo blog. La maggior parte dei CMS fornisce già tutti gli strumenti per rendere il tuo sito ottimizzato per i dispositivi mobili, ma devi assicurarti che il tuo CMS sia aggiornato all'ultima versione. Ad esempio, Joomla viene fornito con il supporto mobile, solo quando viene aggiornato all'ultima versione del software. Altri software, tuttavia, potrebbero richiedere di modificare il tema del tuo sito Web per renderlo mobile friendly, poiché alcuni temi più vecchi semplicemente non hanno un bell'aspetto sui dispositivi mobili, quindi non sono nemmeno adatti a loro. Per farlo vai al pannello di amministrazione del tuo CMS, trova la scheda dei temi sulla dashboard e cambia il tema del tuo blog in uno, che sia reattivo e ottimizzato per i dispositivi mobili. Ad esempio, WordPress offre centinaia di temi diversi e gran parte di essi sono gratuiti e reattivi. Purtroppo, se stai utilizzando un CMS, che non offre supporto mobile, saranno necessari ulteriori miglioramenti e potrebbe essere più intelligente cambiare semplicemente il tuo software di gestione dei contenuti.

2. Usa i sottotitoli

Una regola pratica quando si tratta di contenuti del blog che sono convenienti per gli utenti mobili è consentire loro di assorbire il testo in paragrafi più piccoli invece di avere il tuo articolo in un testo lungo. Quindi il testo del tuo post sul blog dovrebbe essere ben strutturato, in modo che il lettore possa orientarsi facilmente nel testo. Questo può essere fatto facilmente usando i sottotitoli. Quando si utilizzano i sottotitoli, il testo viene automaticamente suddiviso in molti sottocapitoli e ci sono minori possibilità che il lettore perda il proprio posto durante la lettura dell'articolo. E poiché perdere il tuo posto mentre leggi qualcosa sullo smartphone è un problema abbastanza comune per molti utenti di dispositivi mobili, poiché lo scorrimento mobile rende difficile la lettura di testi lunghi e monotoni, risolvilo utilizzando i titoli.

Le intestazioni possono essere facilmente inserite utilizzando i tag di intestazione. Il tag per l'intestazione più grande e più importante è <h1>. Questo tag viene utilizzato più comunemente per il titolo del testo. Altre intestazioni hanno una gerarchia dall'alto verso il basso da <h1> a <h6>, che è un'intestazione appena percettibile, ma ti aiuterà comunque a suddividere il contenuto e renderlo più facile da leggere.

3. Scegli la dimensione appropriata per le immagini

I blogger di solito scelgono la dimensione delle immagini che utilizzeranno nei loro post del blog in base alle normali dimensioni dello schermo del computer, ma quando i post del blog vengono visualizzati su schermi più piccoli, come quello di un telefono cellulare, le immagini generalmente finiscono tutte fino ad avere le stesse dimensioni. Significa che gli utenti di dispositivi mobili non vedono le immagini nella proporzione appropriata. Quindi crea le tue foto in modo che non solo abbiano dimensioni più piccole, di solito le immagini inferiori a 1500 per 2500 pixel sono le migliori, ma anche di dimensioni inferiori: si consigliano meno di 500 KB. Oltre ad avere foto compatibili con i dispositivi mobili, la riduzione delle dimensioni dei file delle tue immagini consentirà anche agli utenti di caricare le pagine più velocemente, poiché le immagini più piccole utilizzano meno dati per essere caricate.

Per rendere le tue foto più piccole è la dimensione e le dimensioni del file, usa qualsiasi editor di foto che hai a portata di mano, perché non hai bisogno di Photoshop per essere in grado di farlo. Ti consigliamo di utilizzare JPEGmini o Pixlr , perché con questi editor di foto puoi ridurre le dimensioni delle tue immagini senza comprometterne la qualità.

4. Usa un design reattivo

Il design reattivo per un blog o un sito Web offre la possibilità di visualizzarlo da molte piattaforme e dispositivi diversi con dimensioni dello schermo diverse in modo più conveniente, perché adatta automaticamente il tuo sito Web alla larghezza della finestra del browser. E, per garantire una lettura comoda ai visitatori del blog, durante questo adattamento di solito il design del blog cambia, ad esempio, le immagini si restringono, le colonne si allineano verticalmente e anche il menu cambia. Ma se questi cambiamenti non si verificano da soli, ci sono strumenti che puoi usare per farlo da solo.

Ad esempio, Foundation 3 , Skeleton e Bootstrap . Questi framework regoleranno automaticamente il tuo blog, quindi è facile da leggere su qualsiasi dispositivo. Usarli è molto più semplice che codificare da soli ogni possibile combinazione. Ovviamente puoi farlo anche usando le nuove unità di lunghezza relativa di CSS3 come la larghezza del viewport (vw), l'altezza del viewport (vh), il minimo dell'altezza e della larghezza del viewport (vmin) e il massimo dell'altezza e della larghezza del viewport (vmax). Tuttavia, la programmazione richiede abilità oltre che tempo e, se non sei un programmatore esperto, ti suggerisco di utilizzare la prima opzione.

5. Usa disegni semplici

Gli utenti mobili preferiscono la progettazione di siti semplici, perché i siti Web di progettazione grandi e complicati diventano lenti su un dispositivo mobile. I design semplici consentono inoltre di mantenere l'attenzione del lettore sul contenuto piuttosto che distrarlo con un design fantasioso, perché statisticamente la maggior parte degli utenti mobili ha intervalli di attenzione piuttosto brevi.

Ciò significa rendere il layout del tuo sito semplice e facile da capire. Se stai utilizzando un tema offerto dal tuo fornitore di servizi, puoi semplicemente cambiarlo in uno più semplice. Ad esempio, WordPress offre molti design eleganti e semplici che non sopraffaranno i dispositivi mobili, ma avranno comunque un bell'aspetto anche su un desktop. Ma se hai creato il tuo sito Web utilizzando HTML, puoi scaricare un modello semplice, che renderà il tuo sito fantastico e anche ottimizzato per i dispositivi mobili. Ad esempio, Envato Market offre molti diversi design semplici tra cui scegliere e utilizzare sul tuo sito.

6. Usa caratteri standard

I caratteri interessanti possono rendere un blog più creativo, ma questi caratteri possono anche essere un fastidio per i lettori mobili del blog, perché non tutti i dispositivi mobili supportano i caratteri desktop fantasiosi. Quindi, per vedere il contenuto, gli utenti di dispositivi mobili dovranno scaricare nuovi font sui loro telefoni, il che è una seccatura che non vale la pena per molti. Inoltre, anche se hanno tutti i caratteri preinstallati, alcuni caratteri più creativi possono essere difficili da leggere su uno smartphone, a causa delle dimensioni ridotte.

Quindi scegli i caratteri tradizionali come Times New Roman, Verdana, Comic Sans MS, WildWest o Bedrock. E controlla anche la leggibilità del font che decidi di utilizzare, per assicurarti che il testo non diventi illeggibile una volta visualizzato su uno schermo più piccolo di uno smartphone. Una regola generale è che qualsiasi testo su un sito web dovrebbe essere di almeno 14 px, perché in questo modo il testo sarà abbastanza grande da essere facilmente leggibile anche se utilizzi un dispositivo mobile con uno schermo molto piccolo.

7. Riduci al minimo il contenuto per pagina

Quando una pagina viene caricata su qualsiasi dispositivo, sia esso un computer, un tablet o uno smartphone, il dispositivo scarica tutto il contenuto della pagina. Di solito non causa problemi se si utilizza un computer, ma grandi quantità di dati possono sovraccaricare i dispositivi mobili. Per evitarlo, dovresti ridurre al minimo la quantità di contenuto in ogni pagina, perché questo farà in modo che il tuo blog funzioni su ogni dispositivo mobile.

Si consiglia di ridurre il contenuto della pagina al di sotto di 5 MB per pagina. Puoi facilmente controllare le dimensioni del contenuto della tua pagina su qualsiasi browser. Basta usare uno dei tanti strumenti di controllo delle dimensioni delle pagine web, disponibili online. Se è superiore a 5 MB, riduci manualmente le dimensioni e la quantità di testo, immagini e altri componenti della pagina oppure utilizza estratti del blog per facilitare la visualizzazione del tuo blog da parte dei visitatori.

8. Usa i video di YouTube

Se tendi a pubblicare molti video negli articoli del tuo blog, devi ricordare che avranno un aspetto molto diverso su un dispositivo mobile rispetto a un computer. Inoltre, alcuni dispositivi mobili non supportano nemmeno determinati formati video, quindi per evitare la possibilità che l'utente non sia in grado di riprodurre il video sul tuo sito, utilizza YouTube incorporato. Il codice di incorporamento fornito da YouTube per ciascuno dei suoi video è già reattivo, il che significa che sarai in grado di visualizzare il video su quasi tutti i dispositivi e non dovrai più preoccuparti delle dimensioni e dei formati dei video.

Puoi ottenere il codice di incorporamento per un video di YouTube facendo clic sul pulsante "Condividi", che si trova sotto il pulsante " Iscriviti ", quindi fai clic sulla scheda " Incorpora " e copia il codice fornito nel tuo sito. E hai un video di dimensioni perfette nel tuo post senza nemmeno doverlo convertire o regolare in altro modo.

9. Sostituisci i collegamenti con pulsanti e menu selezionabili

Molte volte i collegamenti su un sito Web sono troppo piccoli per consentire a un utente mobile di toccarli facilmente e con precisione con il dito. E può essere davvero fastidioso per un lettore di blog, quando non può toccare con precisione il contenuto che desidera visualizzare. Ecco perché dovresti sostituire tutti i link sul tuo sito web con pulsanti che abbiano una dimensione di almeno 44 pixel per 44 pixel.

Se stai utilizzando un CMS come WordPress, puoi semplicemente utilizzare i plug-in per creare questi pulsanti. Vai al pannello di controllo del tuo CMS, trova un plugin appropriato, installalo e segui le istruzioni per usarlo correttamente. Ma se hai codificato tu stesso il sito Web, puoi utilizzare uno o quei generatori di pulsanti di collegamento gratuiti, che ti faranno risparmiare tempo durante la codifica dei pulsanti da solo.

10. Continua a testare

Infine, quando hai apportato tutti i miglioramenti e pensi che il tuo blog sia ottimizzato per i dispositivi mobili, prova di nuovo il tuo blog con lo strumento di test di Google o qualche altro strumento di test di ottimizzazione per dispositivi mobili, che puoi trovare su Internet. Se ora va tutto bene e lo strumento ti assicura che il tuo blog non riceverà penalità, perché non è ottimizzato per i dispositivi mobili, allora puoi rilassarti e continuare a far crescere il tuo sito web creando ottimi contenuti. Ma solo per essere sicuro, ti suggerirei di testare il tuo sito Web da più dispositivi diversi.

Chiedi ad amici o familiari di guardare il tuo blog dai loro telefoni e tablet. Testa il tuo sito da un dispositivo Android e IOS, nonché da dispositivi che potrebbero avere un sistema operativo completamente diverso. E sfoglia tutte le tue pagine principali del tuo blog su quei dispositivi. Solo testando l'ottimizzazione mobile del tuo blog nella vita reale puoi essere sicuro che il tuo sito è effettivamente facile da visualizzare e leggere da tutti i gadget.

L'ottimizzazione per dispositivi mobili non significa solo avere un bel design del sito, ma anche migliorare l'esperienza dell'utente sul tuo sito web. Ecco perché, quando rendi il tuo blog più mobile friendly, più persone saranno disposte a tornare sul tuo sito web, perché sarà facile da visualizzare e capire. E poiché il numero di persone che utilizzano i propri telefoni cellulari come dispositivi principali per navigare sul Web aumenta solo ogni anno a venire, è solo nel tuo interesse assicurarti che il tuo sito Web sia amichevole per questi utenti di smartphone e mostri il contenuto a in modo comodo e di facile lettura.