Oggi parleremo delle sidebar dinamiche e dei widget (quelli che sono rilevanti per i contenuti); soprattutto di come possono aiutare a ridurre la frequenza di rimbalzo del vostro sito e a migliorare le possibilità di conversione.
Vi mostreremo come creare una barra laterale, insieme ai widget che mostrano ai vostri visitatori esattamente ciò che vogliono vedere, in base all’argomento o al contenuto della pagina o dell’articolo.
Cos’è la Frequenza di Rimbalzo?
Prima di mostrarvi come ridurre la frequenza di rimbalzo visualizzando le barre laterali e i widget rilevanti per il contenuto, definiamo prima la frequenza di rimbalzo.
La frequenza di rimbalzo, o Bounce rate, si riferisce alla percentuale di visitatori del sito che entrano ed escono invece di rimanere per visualizzare altre pagine del vostro sito. Per ridurre la frequenza di rimbalzo è necessario aumentare il coinvolgimento, e questo ci dice molto sull’usabilità del vostro sito. Quando un visitatore trova utili i vostri contenuti, rimane e si rende disponibile ad esplorare il sito per altri contenuti utili. Questo, a sua volta, vi dà un tasso di conversione più alto. Più a lungo i vostri visitatori rimangono sul vostro sito, maggiori sono le probabilità di accrescere vendite, iscrizioni e ricavi pubblicitari.
Naturalmente, vorrete che rimangano più a lungo, quindi dovete avere qualcosa che impedisca loro di andarsene troppo presto: contenuti utili.
Usabilità: La Chiave per Ridurre la Frequenza di Rimbalzo
Non si ottiene l’usabilità del sito fornendo solo contenuti utili ai visitatori. È anche necessario ottimizzare gli strumenti che sono visualizzati su ogni pagina in modo che i visitatori possano interagire con essi. Inoltre, questi strumenti devono essere rilevanti anche per il contenuto che viene fornito in una determinata pagina.
Gli strumenti a cui mi riferisco sono la barra di navigazione e tutte le aree widget in una data pagina, compresa la sidebar. Mentre per molti, la barra di navigazione gioca il ruolo più importante nel garantire il coinvolgimento dell’utente, non si può dare per scontato il potere delle aree widget. Questo è vero soprattutto quando si è consapevoli dei tanti modi disponibili con WordPress per prenderne facilmente il controllo.
La barra laterale è il principale segnaposto di widget che può garantire o interrompere l’usabilità del sito. Perché? — Perché è conveniente mettere nella barra laterale qualsiasi widget che vi piace senza pensare se questi widget siano rilevanti o meno per il contenuto principale.
Che Cosa Sono le Sidebar Dinamiche di WordPress (Rilevanti per i Contenuti)?
Una barra laterale di WordPress rilevante per il contenuto principale si riferisce a una barra che visualizza i widget accuratamente scelti in modo che appaiano accanto a contenuti specifici su una data pagina in termini di applicabilità. Ad esempio, una barra laterale rilevante per uno specifico articolo del blog conterrebbe widget come le iscrizioni alle newsletter e articoli correlati.
Le schermate sottostanti mostrano la differenza tra la barra laterale di MarketingProfs.com.
Pagina Podcast (Schermata A)
In questo articolo del blog, MarketingProfs mostra i seguenti widget: suggerimenti, link di iscrizione e i post più popolari.
Pagina dell’articolo (Schermata B)
In questo articolo del blog, MarketingProfs mostra i seguenti widget: iscrizione, widget dei social media, post più popolari.
Come le Barre Laterali Dinamiche Aiutano a Ridurre la Frequenza di Rimbalzo
Le barre laterali aiutano i visitatori del sito a decidere quale azione intraprendere successivamente. Ad esempio, da una pagina un articolo del blog, possono scegliere di iscriversi alla newsletter. Se si dispone di un certo numero di categorie per le newsletter, è possibile visualizzare un widget di iscrizione per la categoria a cui appartiene l’articolo. Ogni widget porta il nome della categoria specifica, in modo che i lettori sappiano esattamente a cosa si stanno iscrivendo. Guardate le immagini qui sotto tratte da The Washington Post.
Le barre laterali rilevanti per il contenuto aiutano anche nel marketing mirato. È possibile creare una barra laterale dedicata agli utenti del sito che si raggruppano in base alle informazioni demografiche. Ad esempio, potete creare delle sidebar per le diverse lingue del vostro sito, visualizzare i link di contatto a seconda della località, o mostrare le promozioni dei prodotti in base ai loro interessi. Oppure potete creare diverse sidebar in base alla categoria dei vostri articoli.
“Must Reads” è una delle sue categorie per le newsletter del Washington Post. Il widget appare in questo articolo intitolato “Pollo contaminato da salmonella ha ucciso 1, intossicati 17, in un’epidemia in più stati, dice il CDC” e tutti gli altri articoli appartenenti alla stessa categoria.
D’altra parte, questo articolo di Tech del The Washington Post, “I dirigenti di Facebook e Twitter che testimonieranno al Congresso la prossima settimana”, ha il widget “Tech news email alerts” nella barra laterale, rivolto ai lettori di storie legate alla tecnologia.
Le barre laterali con i widget rilevanti per il contenuto possono anche aiutare a migliorare la SEO. Utilizzando gli interi tag di intestazione o una parte di essi come titoli di widget può avere un piccolo ma significativo impatto sull’ottimizzazione dei motori di ricerca.
Aggiungere i Widget Rilevanti alla Barra Laterale
Il primo passo verso la creazione di barre laterali rilevanti per il contenuto è quello di decidere cosa è rilevante e cosa non lo è. Decidere quali widget devono apparire su una pagina o un post richiede una comprensione chiara dello scopo e per cui è stata creata quella pagina o quel post.
Ad esempio, avete creato una pagina di un prodotto non solo per spiegarne le caratteristiche, i vantaggi e i prezzi. Lo avete fatto anche per indurre i visitatori ad acquistarlo o a considerare prodotti simili o correlati. Inoltre, potreste voler mostrare le valutazioni più alte del prodotto e le migliori recensioni che possono aiutare i visitatori a decidere di acquistarlo. Oppure, potreste aiutarli a mettersi in contatto con un rappresentante delle vendite per rispondere alle domande. Qualunque sia l’azione che intraprenderanno, la pagina deve mostrare loro il modo in cui farlo. La barra laterale è uno dei posti migliori per mettere quei pulsanti di call to action. Quindi, la barra laterale diventa uno strumento molto potente per mantenere il coinvolgimento dei visitatori del vostro sito web.
Kinsta, per esempio, usa diversi CTA sul suo blog in base alla categoria dell’articolo visualizzato. Questo aiuta a garantire che il contenuto sia mirato e pertinente all’argomento dell’articolo.
Eliminare i Widget non Correlati
Decidere cosa non mettere nella barra laterale è importante quanto decidere cosa metterci. La densità della barra laterale e di altre aree widget sulla pagina contribuisce al suo aspetto generale. Eliminare i widget irrilevanti o ridondanti è un modo per affrontare lo stesso problema dei tassi di rimbalzo. In effetti, alcuni siti potrebbero scoprire che non c’è nessuna barra laterale che vada bene.
Potreste aver messo un mucchio di widget nella vostra barra laterale perché pensate che potrebbero essere utili per i vostri visitatori. Tuttavia, una pagina sovraffollata potrebbe scoraggiare un potenziale cliente. Se la pagina è troppo affollata, i visitatori potrebbero perdere attenzione rispetto a quello che li ha fatti atterrare sulla vostra pagina. Con questo intendo troppi widget pubblicitari esterni o troppi link di prodotti.
In parole povere, decidere quali siano i contenuti rilevanti della barra laterale è fondamentale per aumentare il coinvolgimento degli utenti.
Evidenziare i Widget Importanti
Dopo aver deciso cosa mettere nella sidebar, è possibile far risaltare alcuni widget rispetto al resto. Un modo è quello di farli apparire in altre aree widget, come il footer. Un altro modo è quello di renderli fissi e fluttuanti sulla pagina mentre gli utenti scorrono. Questo permette agli utenti di interagire istantaneamente con i widget senza dover scorrere verso l’alto o verso il basso.
Passo Successivo: Scegliere i Metodi Migliori
Ora che abbiamo parlato dell’importanza della scelta dei widget che si utilizzano, il passo successivo è quello di individuare un metodo per creare quelle barre laterali rilevanti per il contenuto. Ci sono 2 metodi:
Opzione 1 – Controllare la Visibilità dei Widget con un Plugin WordPress
Uno dei modi più semplici per controllare la visibilità dei widget sulla barra laterale è utilizzare un plugin WordPress. Un plugin come Widget Options permette di farlo con pochi semplici click. È possibile mostrare o nascondere i contenuti della barra laterale per ogni articolo o pagina con condizioni come categorie, tag, nomi delle pagine, ecc.
Il plugin Widget Options ha al momento oltre 70.000 installazioni attive con un’impressionante valutazione di 5 stelle su 5. Potete scaricarlo dalla repository di WordPress o cercare “opzioni widget” all’interno della bacheca di WordPress, sotto “Plugin → Aggiungi nuovo”. Poi cliccate su “Installa ora” e attivate il plugin.
Nascondere i Widget in una Pagina Specifica
Una volta installato e attivato il plugin Widget Options, è possibile nascondere facilmente un widget da una pagina specifica con pochi clic. Per illustrare, ecco lo screenshot di un widget coupon. Nelle impostazioni del widget, c’è ora un’opzione di visibilità: potete scegliere tra nascondere e mostrare questo widget su pagine selezionate.
Nascondere i Widget in Post Specifici
È anche possibile nascondere i widget negli articoli del blog utilizzando i tag condizionali. Utilizzando le opzioni dei widget, questo richiede un paio di passaggi in più rispetto al nasconderli dalle pagine. È necessario prima individuare l’ID del post, che bisognerà includere nei tag condizionali dove si vuole nascondere il post.
Per trovare l’ID del post, sfogliare il post e passare il mouse (non fate clic) sull’opzione “Modifica post” nella barra degli strumenti di amministrazione di WordPress. In basso a sinistra del browser dovreste vedere l’ID del post.
Una volta che si dispone del/i post ID, è possibile utilizzarlo con i seguenti tag condizionali.
Nascondere un widget da più post:
!is_single(array('Post ID', 'Post ID'))Nascondere un widget da un singolo post:
!is_single( 'Post ID' )Sul widget che volete nascondere dal post, andate alla scheda “Logica” e inserire il tag come mostrato di seguito.
Inoltre, se vi è necessario utilizzare il titolo di un widget rilevante per i tag di intestazione di una pagina o di un post, potete inserire tante copie di quel widget quante sono necessarie e creare un titolo unico per ciascuna copia.
Nascondere i Widget dai Dispositivi Mobili
È anche possibile limitare la visibilità dei widget quando una pagina o un post viene visualizzato su tipi di dispositivi specifici.
Per le dimensioni limitate dello schermo, è facile che una pagina o un post appaia affollato quando viene visualizzato da un dispositivo mobile, come uno smartphone o un tablet. Dovremmo assicurarci che le pagine non appaiano troppo dense sia su desktop che su un dispositivo mobile. Tuttavia, dobbiamo anche sfruttare lo schermo del desktop più grande per visualizzare i widget rilevanti nel maggior numero possibile di aree di widget.
Ad esempio, supponiamo di volere che l’email opt-in appaia sia nella barra laterale che nel footer. Per quanto riguarda la visualizzazione su cellulare, invece, vogliamo eliminare i widget ripetitivi. Widget Options consente di nascondere i widget nella visualizzazione da mobile.
Rendere Fissi i Widget della Barra Laterale
Un altro modo per controllare la visibilità dei widget è quello di renderli fissi, il che significa che seguiranno gli utenti con lo scroll su e giù su una pagina o un articolo del blog. Se tenete pulita la vostra barra laterale, o la applicate solo a uno o due widget, non dovreste preoccuparvi che diventi troppo invadente. Guardate lo screenshot qui sotto. WPMU Dev ce ne dà un ottimo esempio sul suo blog.
I widget di condivisione sociale fluttuano sulla pagina senza oscurare il contenuto principale e incoraggiano i visitatori ad agire ogni volta che sono pronti a farlo. Questo significa che non devono scorrere indietro fino all’area della barra laterale per interagire con questi widget.
Widget Options fornisce un’opzione in cui è possibile rendere fisso qualsiasi widget e seguire i visitatori durante lo scrolling. Potete scegliere di rendere fissi tutti i widget della barra laterale o semplicemente sceglierne uno o due che ritenete necessitino di una maggiore esposizione rispetto agli altri.
Opzione 2 – Aggiungere Barre Laterali Personalizzate
La seconda opzione è quella di creare manualmente delle barre laterali personalizzate tramite codice. È un po’ più noioso rispetto al un plugin di terze parti che permette di creare le barre laterali con pochi click. Tuttavia, dato che WordPress la possibilità di aggiungere il proprio codice, si può scegliere di farlo. In questo modo, è possibile creare esattamente ciò che si vuole.
Per iniziare, è necessario registrare un’area con un’area widget. Quindi, salvatela e caricatela sul vostro server per renderla accessibile dal menu dei widget. Per farlo, dovrete inserire il seguente codice nel file function.php del vostro child theme. Oppure potete usare un plugin gratuito come Code Snippets.
Viene fornito con alcuni elementi che si possono cambiare in base alle proprie esigenze. Ecco un esempio:
<?php
/*
* Create Custom Widget Area for Pages Only
*/
function page_only_custom_sidebar() {
register_sidebar(
array (
'name' => __( 'For Pages Only', 'your-site' ),
'id' => 'page-only-custom-sidebar',
'description' => __( 'Contents to this widget area will be displayed on pages only.', 'your-site' ),
'before_widget' => '<section id="%1$s" class="widget %2$s">',
'after_widget' => "</section>",
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
)
);
}
add_action( 'widgets_init', 'page_only_custom_sidebar' );
?>Il passo successivo è quello di rendere visibile la barra laterale da qualche parte nel sito. Per farla funzionare, aggiungetela al/i template file delle pagine dove volete siano visibili. Date un’occhiata al codice qui sotto per far apparire la barra laterale solo sulle pagine.
Per raggiungere il nostro scopo, lo mettiamo all’interno del file page.php del nostro tema. Nel caso del tema Twenty Seventeen, il codice sarebbe simile a questo:
<?php if ( is_active_sidebar( 'page-only-custom-sidebar' ) && is_page() ) : ?>
<aside id="secondary" class="widget-area" role="complementary">
<?php dynamic_sidebar( 'page-only-custom-sidebar' ); ?>
</aside>
<?php endif; ?>Tocca a Voi: Come Riducete la Frequenza di Rimbalzo?
Quello che ho mostrato qui è solo una piccola parte dei tanti modi per ridurre la frequenza di rimbalzo. Le barre laterali, uno dei posti più spesso trascurati dei siti web, possono diventare strumenti potenti per far sì che i visitatori esplorino il vostro sito, aumentando così la possibilità di conversioni. La creazione di barre laterali rilevanti per i contenuti non è necessariamente difficile, soprattutto con i tanti plugin disponibili nella repository di WordPress.
Inoltre, dato che aumentare il coinvolgimento è uno dei modi principali per ridurre la frequenza di rimbalzo, è necessario verificare l’usabilità del sito.
In order to achieve usability, bear in mind that content is king. You start off with useful contents and pair them with the right sub-contents (the widgets, the links, your content-relevant sidebars) that will encourage them to explore your sites.
— Jeffrey Carandang (@jeffreycarandng) November 1, 2018
Per ottenere la fruibilità, tenete presente che il contenuto è il re! I vostri widget, link o barre laterali rilevanti per i contenuti dovrebbero guidare gli utenti nel vostro sito, portandoli ad altri contenuti che potrebbero trovare utili. Oppure, potreste rimuovere completamente le barre laterali per far sì che i vostri utenti si concentrino solo sui contenuti… ma questo è un altro approccio!
Avete già utilizzato le barre laterali dinamiche di WordPress o i widget sul vostro sito? Che risultati avete avuto?
Jeffrey creates and develops carefully cooked WordPress Plugins over at Phpbits. Just the right blend of creativity, user-friendliness, and functionality!
Lascia un commento