Breadcrumbs
10 mar 2022

Breadcrumbs

Uma excelente forma de introduzirmos o tema breadcrumbs é através de um conto de fadas. Lembra-se da história “Hensel & Gretel”? Um clássico dos irmãos Grimm, no qual duas crianças conseguem voltar a casa ao percorrem um caminho marcado por migalhas de pão.

Aliás, breadcrumbs traduz-se literalmente para “migalhas de pão” e é um nome bastante apropriado, uma vez que representam o caminho percorrido pelos utilizadores dentro da estrutura de um site.

Para os utilizadores, os breadcrumbs ajudam a melhorar a sua experiência de navegação.

Para as empresas, significam uma oportunidade para melhorar o SEO – Search Engine Optimization. Como é que os breadcrumbs se encaixam aqui? É isso mesmo que vamos ver.

 

O que são Breadcrumbs?

Na prática, os breadcrumbs são uma forma de estruturar ou hierarquizar a informação, de modo a facilitar a navegação dos utilizadores, por um lado; e, por outro, facilitar o modo como os motores de pesquisa entendem os conteúdos apresentados.

Por isso mesmo, há quem prefira chamar aos breadcrumbs de “estrutura de navegação”. Faz sentido, claro.

Por estrutura de navegação, entenda-se a criação de uma hierarquia de informação organizada por categorias e subcategorias. Para chegar ao topo das páginas de resultados dos motores de pesquisa, isso é tão importante quanto tudo o resto. 

Além disso, os breadcrumbs permitem melhorar a experiência do utilizador.

Imagine uma loja de vinhos online. Um e-commerce no qual o utilizador começa por escolher uma categoria – uma região de Portugal, por exemplo – e depois uma subcategoria – a marca do vinho na qual tem interesse em comprar, ou saber mais.

Esta é uma estrutura de navegação simples, certo? Agora, no caso de um utilizador quiser voltar à página na qual opta por uma das regiões de Portugal, os breadcrumbs tornam-se imprescindíveis para a sua experiência de navegação.

Por outras palavras, os breadcrumbs deste exemplo estariam estruturados assim: homepage > regiões > marcas de produto.

Sempre que o utilizador quiser, pode voltar atrás na sua experiência de navegação em apenas um clique. 

E se para os utilizadores os breadcrumbs são importantes para a experiência de navegação, o que significam para as empresas?

 

A importância dos breadcrumbs

Para as empresas, a importância dos breadcrumbs está diretamente associada ao SEO

O SEO ou Search Engine Optimization visa a otimização dos elementos de um site, de modo a levá-lo até às primeiras posições das SERPs – Search Engine Results Page (em português: Página de Resultados do Motor de Pesquisa).

Neste caso, os breadcrumbs ajudam os motores de pesquisa como o da Google a compreenderem melhor a estrutura de informação e navegação dos sites e a forma como os conteúdos são apresentados aos utilizadores.

Isto é feito através de uma comparação entre as pesquisas feitas pelos utilizadores e as palavras-chave utilizadas ao longo da estrutura de informação de um site.

Voltando ao exemplo e-commerce em cima: os breadcrumbs dizem ao Algoritmo do Google que esta loja online tem a estrutura “X” e com estas categorias e aquelas subcategorias.

Mais tarde, quando os utilizadores pesquisarem no motor de pesquisa por alguma das palavras-chave que utilizámos para definir categorias e subcategorias, o Google já sabe para onde os encaminhar.

 

Como funcionam os Breadcrumbs?

Para colocar os breadcrumbs a funcionar são precisos quatro passos. Tudo começa com o diagrama de navegação do seu site.

Na prática, importa saber qual o caminho que o utilizador (e o Algoritmo do Google) devem fazer para ir de um Ponto A ao Ponto B ou C – as boas práticas de navegação recomendam que não existe um ponto D!

Ou seja, o utilizado deve ser capaz de chegar a qualquer página do seu site em não mais do que três cliques.

Com esse diagrama à nossa frente, o segundo passo para colocarmos os breadcrumbs a funcionarem exige a categorização e subcategorização das páginas.

Por outras palavras, queremos “arrumar” a informação de uma forma relevante para os utilizadores. 

Idealmente, a nomenclatura utilizada para a criação destas categorias e subcategorias tem também em conta as boas práticas de SEO, nomeadamente as relacionadas à seleção de palavras-chave.

Chegados até aqui, o terceiro passo implica a criação de código HTML para cada um dos breadcrumbs. Ou seja, para cada um dos caminhos que vão do Ponto A ao Ponto B e C. 

Nestas linhas de código, os links devem estar separados de acordo com a hierarquia de informação previamente estabelecida, mantendo o cuidado de manter as linhas dentro de uma “div” chamada breadcrumb, para que os motores de pesquisa os identifiquem mais facilmente.

O quarto e último passo consiste na aplicação dos breadcrumbs no site. Ou seja, consiste na forma como são apresentados ao utilizador, seja no topo da página, seja mais junto ao rodapé.

Nesta questão não existe certo ou errado. O importante é que facilitem a navegação e a experiência do utilizador.

 

Vantagens dos Breadcrumbs

Para além de todas as vantagens dos breadcrumbs que fomos elencando ao longo do texto, há uma vantagem que acaba por se destacar.

Os breadcrumbs não só melhoram a experiência do utilizador e otimizam o seu site para os motores de pesquisa, como são uma ótima ferramenta para reduzir a taxa de rejeição.

Por outras palavras, o utilizador não precisa de ir ao Menu de um site para ver as opções de navegação que tem à sua disposição.

Por exemplo, talvez o utilizador não esteja interessado num produto específico, mas esteja interessado em ver mais produtos dentro da mesma categoria.

Os breadcrumbs despertam a curiosidade dos utilizadores e convidam à navegação do site.

Além disso, os breadcrumbs no website praticamente não influenciam o tempo de carregamento das páginas e a verdade é que os utilizadores já estão habituados a navegar através destas “migalhinhas de pão”.

Por isso, se ainda não as utiliza no seu site, está na hora de falar com a Bluesoft.


Tiago Simonette Teixeira | Bluesoft

partilhe