fatti trovare dai tuoi clienti
Corso SEO & HTML: #17 Tag Aside
Che cos'è la sidebar? perché esiste un tag HTML5 specifico per i contenuti a bordo pagina? come si comporta la sidebar nei dispositivi mobili?
« Corso SEO & HTML: #16 Tag Article
- Tag Aside (sidebar), cos'è?
- Cosa scrivere nella barra laterale di una pagina web?
- Come si comporta la sidebar su smartphone?
In questa rubrica sulla SEO dedicata alla scrittura di codice HTML ti spiego con parole semplici quali sono i tag HTML fondamentali di ogni pagina web per farti capire come è fatto un sito web in modo da sfruttare al meglio le conoscenze sulla SEO ed essere in prima pagina su Google, senza farti necessariamente diventare un webmaster o un hacker!
Tag Sidebar
Che utilità ha il tag <aside> in HTML5
HTML5 ha portato numerosi nuovi Tag nella descrizione delle pagine web che dal punto di vista sintattico e funzionale sono tutti esattamente identici e sono intercambiabili tra loro e con il tag generico <div>, ma portano con sé un profondo significato dal punto di vista semantico.
L'utilizzo corretto dei tag HTML5 che stiamo analizzando porta notevoli benefici in termini di visibilità sui motori di ricerca, detta anche "ricerca organica".
La "ricerca organica" è molto importante perché conferisce a chi è in prima pagina su Google, sia la possibilità di ricevere numerose visite, ma al tempo stesso un grande prestigio, poiché é in prima pagina chi gode di una buona reputazione agli occhi dei motori di ricerca!
Il Tag <aside> — a differenza dei tag <section> e <article> appena analizzati — è un tag che serve a spiegare al crawler del motore di ricerca che il contenuto al suo interno non riguarda esattamente la pagina web corrente, ma che ha a che fare con l'intero sito.
Cosa mettere nella barra laterale
Tipicamente la Sidebar o Barra Laterale, serve a contenere gli strumenti per utilizzare il sito web, non i contenuti!
Per esempio la Sidebar di un Blog è molto utile per raccogliere strumenti come:
- casella di testo per ricerca libera di articoli nel Blog;
- calendario con le date cliccabili per andare a leggere gli articoli scritti in un giorno preciso;
- elenco degli articoli correlati, spesso appartenenti alla stessa categoria, ma non necessariamente;
- elenco degli ultimi 'n' articoli pubblicati;
- lista della categorie (se più di una);
- archivio degli anni passati;
- Tag Cloud;
- Aforisma del giorno...
Talvolta i Blog sono sponsorizzati da aziende o da banner pubblicitari Google AdSense, perciò non è raro utilizzare le Sidebar per appoggiare dei banner pubblicitari che consentono di "monetizzare il Blog".
Per esempio la Sidebar in un sito di eCommerce è molto utile per raccogliere strumenti come:
- casella di testo per ricerca libera articoli in vendita;
- categorie merceologiche;
- articoli in vendita correlati;
- prodotto simili o venduti insieme al prodotto in evidenza nella pagina web corrente;
- caselle di selezione (Checkbox) per filtrare i prodotti in vendita, per esempio per categoria, per prezzo, per colore, dimensioni, eccetera...
Ecco hai capito che la sidebar ha una utilità più di navigazione che non di contenere parole chiave pertinenti con la pagina web corrente, pertanto non ha senso investire risorse nell'ottimizzazione di una barra laterale (in termini di SEO e parole chiave), bensì — il lavoro da fare sulla sidebar — è di tipo UX (User Experience).
Fatti aiutare dal tuo grafico UX di fiducia a configurare al meglio gli strumenti della sidebar.
La barra laterale deve agevolare gli utenti a fruire al meglio del tuo sito web. Trovandosi a suo agio all'interno del tuo sito e nella navigazione, l'utente sarà più felice di permanere, visitare altri link e leggere altri articoli o fare acquisti se si tratta di un portale di eCommerce.
Tutte queste caratteristiche concorreranno certamente a portare in prima pagina sui motori di ricerca il tuo sito, sebbene lo facciano in modo indiretto.
La sidebar negli smartphone
Dunque la domanda sorge spontanea, dato che il telefonino ha uno schermo alto e stretto, e dunque non ha spazio sui lati: come si deve realizzare la sidebar per dispositivi mobili?
Innanzitutto è possibile creare due diverse tipologie di sidebar: una per PC desktop e l'altra per smartphone, con più o meno strumenti ciascuna, e tramite il foglio di stile CSS si può far apparire una o l'altra versione.
Tuttavia la risposta non è semplice e necessita di distinguere tra i diversi casi:
- eliminare / nascondere completamente la sidebar su smartphone;
- nascondere la sidebar, ma consentire di aprirla con un gesto di swipe laterale o mediante pulsante hamburger;
- visualizzare la sidebar al centro dello schermo piuttosto che di lato, prima e/o dopo dei contenuti.
1. quando conviene eliminare la sidebar
La sidebar deve essere nascosta definitivamente quando non ha una vera utilità ma piuttosto viene usata come riempitivo, dato che lo schermo dei PC è molto ampio e spesso si utilizzano le sidebar solo per scopi estetici.
2. quando conviene usare l'hamburger
Se la sidebar ha utilità nella navigazione, ma non è indispensabile, può essere ristretta o nascosta valorizzando maggiormente il vero e proprio contenuto del sito web.
Il programmatore del sito web può prevedere una comparsa della sidebar dal lato dello schermo mediante swipe (scorrendo il dito sullo schermo del telefonino da sinistra a destra o da destra a sinistra), oppure può realizzare un tasto a forma di Hamburger o di altra natura adibito all'apertura della sidebar.
3. quando conviene tenere aperta la sidebar
Nei portali di eCommerce dove lo strumento della sidebar è fondamentale per la ricerca e la selezione del giusto prodotto da comprare, è opportuno tenere la sidebar all'inizio del flusso di navigazione ben aperto, eventualmente di espandere la barra e visualizzarle tutte.
Conclusioni
Hai capito che la sidebar non ha una grande importanza in termini di SEO in modo diretto, bensì lo diventa grazie alla miglior User Experience che offre agli utenti.
La prossima settimana in questo Corso SEO continueremo a parlare di web semantico per sfruttare al massimo tutti i Tag HTML5, con particolare attenzione al tema SEO, in modo da portare i tuoi siti web in prima pagina su Google, quindi fai click su "Seguimi" per ricevere una notifica!
Ti do appuntamento alla prossima settimana, nel frattempo metti un like 👍🏻 se questo articolo ti è stato utile e condividilo con tutti i tuoi amici che — come te — vogliono essere in prima pagina su Google, te ne saranno immensamente grati.
Se qualcosa non ti è chiaro, fammi le tue domande nei commenti, risponderò a tutti, oppure scrivimi in privato.
Iscriviti al Corso SEO Operativo per poter entrare nel gruppo privato dove parliamo ogni giorno di SEO e di come fare per essere in prima pagina su Google, a presto.