O quão importante são os Bread Crumbs?

O uso de bread crumbs é uma das estratégias de SEO que ajuda a melhorar o posicionamento de sites com muitas seções e níveis hierárquicos de informação, como blogs e e-commerce. Para otimizar a experiência do usuário e garantir um bom posicionamento do Google, é preciso que a estruturação de site seja bem organizada e pautada nas categorias e subcategorias de palavras-chave relevantes e com alto volume de busca.

Um website sem o devido planejamento estratégico de navegação frustra o usuário, fazendo com que sua experiência seja confusa. Por mais atraente e inovador que seja o produto ou serviço oferecido no ambiente digital, tanto o Google quanto o usuário não conseguirão encontrá-los facilmente, e isso implica em perda de receita, altas taxas de rejeição e outros problemas.

Por isso, é preciso entender a importância do uso inteligente de breadcrumbs e como a tática é valiosa para a experiência do usuário.

O que são bread crumbs?

Bread crumbs ou trilhas de navegação nada mais é do que um esquema de navegação de um site, baseada em estruturação de conteúdo e capaz de indicar de forma simplificada aos visitantes onde eles se encontram na hierarquia de páginas de um site. O recurso breadcrumb de um e-commerce é posicionado no topo das páginas de produto e de acordo com suas categorias.

Origem do termo

Termo amplamente conhecido no Design e Front-End de lojas virtuais, o breadcrumb é um recurso cujo objetivo é proporcionar a melhor e mais simples usabilidade aos seus visitantes.

As “migalhas de pão” se referem à fábula de João e Maria dos Irmãos Grimm. Assim como as crianças do conto de fadas, os bread crumbs oferecem aos usuários uma maneira de rastrear o “caminho de volta” ao seu ponto de origem. As migalhas são links de texto segmentados horizontalmente e separados pelo símbolo “maior que” (>), indicando o nível dessa página em relação aos links da página vizinha.

Quais são os tipos de breadcrumbs?

Os breadcrumbs consistem em três fatores para categorizar informação:

• Localização

Breadcrumbs baseados em localização mostram estaticamente ao usuário onde eles estão na hierarquia do site. São utilizados para estruturas de navegação com mais de dois níveis. Este breadcrumb é independente da navegação realizada pelo usuário faz e basicamente responde a questionamentos como: onde está o que estou procurando neste website?

• Atributo

As trilhas de navegação pautadas em atributos mostram ao usuário e aos mecanismos de busca as propriedades de itens exibidos em uma página específica, fornecendo meta-informações de cada um dos conteúdos encontrados.  

• Caminho

Bread crumbs que consideram o percurso do usuário exibem de forma dinâmica as páginas visitadas antes de chegar à página de origem. Este tipo de trilha é semelhante à trilha baseada em localização, porém, com funcionalidade diferente.

Quais são os benefícios dos bread crumbs?

• Otimiza a experiência do usuário
• Reduz a fricção na navegação, diminuindo cliques ou ações para retornar às páginas de nível superior
• Garante que os mecanismos de pesquisa entendam a estrutura de um site e localizem todas as páginas que devem ser rastreadas
• Melhora o CTR (Click Through Rate)
• Não ocupam muito espaço na página

5 boas práticas na implementação de bread crumbs

Não substitua menus de página pelas trilhas de navegação

A navegação por breadcrumb é um plus, portanto, não deve substituir menus de navegação primários eficazes. Trata-se de um recurso de de navegação secundário, que permite aos usuários estabelecer onde eles se encontram.

Não inclua links para a página visitada

Indicar para o usuário onde ele está com um link não é aconselhável, pois ao clicar o usuário será redirecionado para o mesmo lugar.

Utilize separadores

Utilize símbolos separar uma categoria da outra em uma trilha. O mais conhecido é o de “maior que” (>), contudo, barras, setas e outros também podem ser utilizados.

Cuidado com o tamanho e o espaçamento dos bread crumbs

Ao formatar as trilhas de navegação do site, é preciso considerar o tamanho e o espaçamento entre texto e símbolo, para não comprometer a identificação e a legibilidade do conteúdo.

Evite fontes e cores chamativas

Como já mencionamos, os bread crumbs cumprem o papel de navegação secundária, por isso, evite o uso de cores fortes e fontes chamativas, caso contrário, o recurso destacará no visual do site, tirando foco no conteúdo e nos produtos.

Viu como bread crumbs é uma técnica simples, porém valiosa para a experiência do usuário? Compartilhe suas experiências ou dúvidas com a gente nos comentários!