TechBlogSD - Tutto per WordPress e sviluppo WEB
Istruzioni WEB e WordPress, notizie, recensioni di temi e plugin

Tutto quello che dovresti sapere sul pangrattato

4

Breadcrumbs è una struttura di navigazione che contiene una raccolta di collegamenti che aiuta gli utenti a navigare facilmente nel sito web. Questo aiuta l’utente a sapere in qualsiasi momento dove si trova esattamente sul sito e a spostarsi direttamente verso l’alto o verso il basso nella struttura del livello. I siti più piccoli con una singola categoria o pagine indipendenti potrebbero non richiedere una navigazione breadcrumb aggiuntiva poiché il menu del sito può soddisfare le esigenze di navigazione di un utente. Ma i siti più grandi con un numero elevato di categorie e struttura della pagina padre-figlio necessitano di ulteriori breadcrumb per informare gli utenti dove si trova esattamente la pagina corrente rispetto all’intero sito.

Gli utenti interessati possono andare al livello superiore o inferiore per trovare contenuti pertinenti che potrebbero non essere possibili senza breadcrumb in atto.

L’importanza del pangrattato

Oltre ad aiutare gli utenti, la struttura breadcrumb viene mostrata anche nelle pagine dei risultati dei motori di ricerca di Google e Bing. I motori di ricerca come Bing mostrano il collegamento dei breadcrumb nei risultati di ricerca in modo che gli utenti possano accedere direttamente a quella categoria anziché a una pagina specifica.

Tutto quello che dovresti sapere sul pangrattatoTutto quello che dovresti sapere sul pangrattato

Come aggiungere il pangrattato?

Il modo più semplice per aggiungere breadcrumb al tuo sito è utilizzare un tema che offra questa funzionalità per impostazione predefinita. I sistemi di gestione dei contenuti come WordPress self-hosted offrono plug-in per inserire breadcrumb personalizzato sopra l’intestazione dell’articolo. Se il tuo site builder non offre tale funzione, devi aggiungerla manualmente su ogni pagina utilizzando il tag di ancoraggio HTML. Ad esempio, gli strumenti per la creazione di siti come Weebly non offrono temi con breadcrumb predefiniti. Quindi è necessario aggiungerlo separatamente su ogni pagina con HTML / CSS personalizzati.

Esempi di pangrattato

Sebbene il breadcrumb sia generalmente posizionato come collegamento orizzontale sotto o sopra il titolo di una pagina, può avere una struttura verticale o orizzontale a seconda della struttura di navigazione del sito. Di seguito sono riportati gli esempi di breadcrumb che mostrano quanto sia facile per gli utenti navigare nel sito.

Tutto quello che dovresti sapere sul pangrattato

In questo sito utilizziamo il plugin Yoast SEO per mostrare i breadcrumb orizzontali sopra il titolo di ogni post. Poiché abbiamo molte categorie, questo ci aiuta a raggruppare gli articoli nella categoria pertinente e mostrarla nei motori di ricerca. Il vantaggio è che quando un articolo è raggruppato con più categorie puoi scegliere quale categoria deve essere mostrata nel breadcrumb come categoria principale.

Tutto quello che dovresti sapere sul pangrattato

Pangrattato SEO Yoast

Il breadcrumb SEO Yoast sarà semplice basato sul testo e puoi aggiungere box e shadow usando il seguente CSS:

#breadcrumbs { box-shadow: 1px 1px #d5d4d4; background: #eeeded; border: 1px solid #eeeded; border-radius: 5px; padding: 0 5px 0 10px; font-size: 16px; }

Pangrattato CSS personalizzato

Puoi aggiungere breadcrumb CSS personalizzati soprattutto quando il tuo sito ha un numero inferiore di pagine. Di seguito è riportato un breadcrumb CSS orizzontale che può essere aggiunto al tuo sito. Dai un’occhiata al nostro articolo su come aggiungere questo breadcrumb al tuo sito Weebly.

Stile CSS breadcrumb 1

Stile Pangrattato CSS 2

Stile CSS breadcrumb 3

Stile Pangrattato CSS 4

Stile CSS breadcrumb 5

Bonus CSS Breadcrumb Style 6

Il pangrattato viene anche chiamato briciola di biscotti o sentiero di pangrattato.

Fonte di registrazione: www.webnots.com
Lascia una risposta

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More