Blog Design: come deve essere il Layout del tuo Blog

Blog Design

Un paio di mesi fa, sul TagliaBlog ho montato un tema WordPress responsive, che mi ha aiutato a migliorare velocità, fruibilità dei contenuti e anche la quantità di accessi al sito.

Ma a quanti e a quali altri elementi dovremmo guardare, se stiamo per mettere mano al design del nostro blog?

Neil Patel, nel suo The Blueprint of an Optimal Blog Design, ce ne suggerisce alcuni. Siccome però il suo post è in realtà solo un’infografica, e per di più in lingua inglese, ho pensato di metterla in forma testuale e di tradurla in italiano (con qualche aggiuntina mia).

Eccola qui:

Layout

In home page, pubblica solo una piccola parte dei post: questo ti eviterà la duplicazione di contenuti speculare (fra la home page e il post stesso), e ti permetterà di aumentare le pagine visualizzate (il lettore che atterra sulla home page e vede una porzione di contenuto interessante, cliccherà per leggere tutto il resto). Nelle preview dell’articolo, includi sempre una immagine: secondo MDG Advertising, i pezzi che includono una immagine rilevante hanno in media il 94% in più di visualizzazioni degli articoli senza immagini.

Metti il contenuto a sinistra, e la sidebar a destra: al contenuto andrebbe riservato almeno il 60% della pagina. Anche se alcuni consigliano di invertire le 2 aree (spostando quindi i contenuti sulla destra), secondo Patel la sidebar sulla sinistra può diminuire il numero di persone che leggerà i tuoi contenuti, in una misura variabile fra il 15% e il 25%.

Centra la pagina sullo schermo: il 94% dei blog utilizza un design centrato, nel 56% dei casi con una larghezza fra i 951 e i 1.000 pixel.

Usa un design di tipo responsive: si calcola che gli utenti spendano ormai il 60% del loro tempo su Internet utilizzando dispositivi mobili (questo è uno dei motivi per cui anche il TagliaBlog è passato ad un tema responsive).

Social

Come devono essere i “bottoni sociali”? Patel suggerisce di utilizzare gli scrolling social button, che sul suo blog avrebbero migliorato le condivisioni del 27%. Upworthy consiglia invece di utilizzare grossi pulsanti in testa, in coda e in “overlay” sui contenuti del sito: in questo modo, l’editore ha aumentato le condivisioni del 398%. E’ comunque opportuno limitare le opzioni (secondo Patel, ad un massimo di 3): troppe scelte diminuiscono i click sui bottoncini.

Font e Caratteri

Usa una dimensione dei font del contenuto di almeno 11pt: in base ad un test effettuato su 13 blog, è emerso che passare da un font da 8pt a uno da 9pt ha aumentato il tempo speso sul sito di 13 secondi. Passando da 9pt a 10pt di altri 8 secondi. E passando da 10pt a 11pt di altri 6. Il 34% dei blog più noti nell’ambito della tecnologia e del web marketing utilizza un font da 12px, il 30% uno da 13px e il 14% uno da 14px.

Usa una dimensione dei font del titolo fra i 17px e i 25px: Il 24% dei blog più noti utilizza un font fra i 20px e 22px, il 22% uno fra i 23px e i 25px, e un altro 22% uno fra i 17px e 19px. Il 52% dei 50 top blog usa l’Arial o il Georgia per gli headline.

Usa il Serif o il Sans Serif come font di base: lo fa 90% dei 50 blog più famosi. Nello specifico, il 34% usa il Verdana, il 24% il Lucida Grande, il 18% l’Arial e il 14% il Georgia (serif).

Colori e Design

Imposta lo sfondo chiaro e il testo scuro: il 98% dei blog ha lo sfondo bianco (o comunque chiaro) e il testo dei contenuti nero (o comunque scuro).

Lascia abbondanti “spazi bianchi”: evitare di comprimere troppo i contenuti, lasciare “aria” fra i vari elementi del blog (e soprattutto all’interno del corpo, dove sta il testo scritto) migliora la comprensione della lettura di almeno il 20%.

Sistemi di Opt-In

Chiedi solo l’email: un modulo di iscrizione senza il nome, che chiede solo l’email, ottiene il 10% in più di iscritti rispetto ad uno formato da nome + email.

Usa gli “Exit Intent Popup: i popup che compaiono automaticamente quando poni la freccia del mouse fuori dalla finestra attiva del browser, generano un numero incredibile di iscrizioni (Social Media Examiner dice che ottiene circa il 70% di iscrizioni in questo modo).

Condividi su facebook
Facebook
Condividi su google
Google+
Condividi su twitter
Twitter
Condividi su linkedin
LinkedIn
Condividi su pinterest
Pinterest

13 Comments

  • Ciao Davide..cosa intendi per “Exit Intent Popup”?
    Dici quando uno clicca indietro con il browser di far comparire una finestra interattiva?!

  • Ho un dubbio sulla posizione dei social. Metterlo all’inizio potrebbe facilitare la persona a leggere l’articolo vedendo quante volte è stato condiviso ed eventualmente se il numero di condivisioni è alto, potrebbe invogliorlo a cliccare sul bottone social. Ma metterlo alla fine può invogliarlo a cliccare se l’articolo gli è piaciuto veramente. Qual’è la soluzione migliore?

  • @Daniele: secondo Upworthy, i bottoncini (grossi!) van messi ovunque: in testa, in coda, e pure “sovrapposti” al contenuto.

  • Ciao Taglia, complimenti come sempre per l’articolo: con/senza “aggiuntine” è pieno di buon senso 🙂

    Mi viene solo un dubbio: con il trend attuale, non si rischia un po’ che i siti si assomiglino tutti? Peraltro, non sono più sicuro se ciò sia un vantaggio o uno svantaggio 😀

  • Hai ragione Nicola, ma anche rischiare usando layout troppo originali può confondere i nuovi utenti, abituati a tutti gli altri siti/blog presenti sul web… personalmente sono per l’utilizzo di design semplici e lineari, magari con qualche piccolo tocco di originalità 😉

  • Avevo letto anch’io l’infografica di Neil Patel e una traduzione all’italiano è un bel servizio che hai offerto per facilitarne la chiarezza.

    Proprio a proposito degli Exit Intent Popup, stavo pensando di implementarli anch’io nel sito che vedete in firma, per aumentare il tasso di conversione degli iscritti.

    Invece di crearmelo da solo, avevo pensato di usare questo tool a pagamento che inserisce anche i form anche in altre parti della pagina (nel footer e ai lati):

    http://optinmonster.com/

    E’ un pò caro, ma offre anche dati da analizzare per controllare da quale parte della pagina arrivano le iscrizioni, in modo tale da testare quello che funziona ed eliminare quello che porta meno risultati.

    Stavo pensando di acquistare l’abbonamento annuale, che costa di meno, e se vedo che non funziona come pensavo, posso sempre disabilitarlo o testarne un’altro.

    se non andiamo off topic e qualcuno di voi lo ha usato, parliamone qui ;).

  • Eccolo… ho la colonna piccola a sinistra… ed effettivamente a destra è molto più gradevole… ma è sicuro sia più performante?

  • Davvero un post bellissimo! Non ti conoscevo, mi hai aperto un mondo con questo blog, Grazie!

    @Nicola
    Proprio ieri parlavo con un’amica che si occupa di grafica, a proposito del fatto che tutti i siti sono praticamente identici…

    Ho capito in alcuni anni di lavoro su internet che la funzionalità è sempre da prediligersi all’originalità.

    Imbrigliare la grafica di un sito in una griglia, non significa sminuire l’attività di grafica, bensì valorizzare il valore di un buon grafico, che nonostante i vincoli funzionali, riesce a dare originalità ad un blog / sito / giornale online / servizio.

    La differenza la fanno poi i contenuti, foto e video.

  • Interessante!
    Sul layout in generale direi che ci sono. Chiaro, semplice, responsive etc…
    Ho messo i bottoni (piccoli) in fondo per la condivisione perchè mi sembra logico che il post lo si condivida DOPO averlo letto e non prima a scatola chiusa. Si può sapere se è stato cliccato il bottone sopra o sotto il testo del post?
    Intanto cercherò di metterli più grandi ed “invasivi”… 🙂

  • Ma tutti i Widget sul lato destro che fine hanno fatto? Ad esempio i più letti, i più commentati, il blogroll, ecc..?
    Questo post si dovrebbe intitolare “Blog Design: come deve essere il Layout del tuo Blog per Google”.
    Non è che si rischia di far contenti i quality rater di Google a scapito della reale user experience?

  • @Marco
    Per quanto riguarda più visti e keywords. Avevo un amico e collega che ha lavorato per anni nel settore dell’intrattenimento per adulti.

    Non so se è ancora vero, ma mi diceva che i siti migliori per quanto riguarda l’ottimizzazione per i motori di ricerca e, soprattutto, la capacità di trattenere utenti sul proprio sito, sono proprio i siti porno. Su quest’ultima affermazione, credo non sia cambiato granché.

    Tutti gli studi che facciamo noi, li fanno anche gli operatori del mercato dell’adult entertainment, eppure nessuno di questi provider si è mai sognato di eliminare tag cloud, più visti, etc. Al contrario, li arricchiscono.

    Se il parallelismo articolo serio / pornazzo non piace, può essere utile sapere che i siti di informazione hanno, se non tutti, sicuramente tutti i maggiori, sia la sezione più visti, che le keywords e tutti i link social possibili immaginabili.

    Sono considerati così indispensabili che in molti quotidiani vengono falsate le statistiche esposte, al fine di evitare che certi articoli “troppo” popolari, stiano sempre al top, finendo così per autoalimentarsi.

    Buon anno, Davide.

Lascia un commento

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

Max Valle

Max Valle

Da oltre 20 anni, fornisco consulenze per aziende e professionisti, che vogliono sviluppare il loro business, 
aumentando i clienti, utilizzando le ultime tecnologie e nel pieno rispetto delle normative vigenti in materia.

Seguimi sui social

Iscriviti alla Newsletter

Main sponsor

Scroll to Top

Utilizziamo i cookie per personalizzare contenuti ed annunci, per fornire funzionalità dei social media e per analizzare il nostro traffico. Condividiamo inoltre informazioni sul modo in cui utilizza il nostro sito con i nostri partner che si occupano di analisi dei dati web, pubblicità e social media, i quali potrebbero combinarle con altre informazioni che ha fornito loro o che hanno raccolto dal suo utilizzo dei loro servizi. Acconsenta ai nostri cookie se continua ad utilizzare il nostro sito web. Per maggiori informazioni visualizza la Privacy & Cookie policy