ArtigosCategoria

[Guia] Breadcrumbs: o que é? Para que serve? Como configurar?

Tempo de leitura:6 min
Rafael Queiroz Bastos
breadcrumbs o que é

Vários fatores contribuem para melhorar a usabilidade de um site e otimizá-lo para SEO (Search Engine Optimization). Um deles é o breadcrumbs. Você sabe o que esse conceito significa na prática?

Não é intrigante que um termo que, em português, significa “migalhas de pão” impacte na experiência do usuário e nas melhores práticas de marketing digital? 

Caso se lembre da história de João e Maria, os dois protagonistas usam migalhas de pão para não se perder na floresta. Foi a partir dessa referência que o termo ganhou destaque para falar de usabilidade.

No mundo digital, breadcrumbs é uma forma de sinalizar os rastros de navegação do usuário para que ele não se sinta confuso ao navegar pelas diversas páginas de um site.

Além de interessante para a experiência do visitante, esse recurso também é um dos mais de 200 fatores que impactam nos mecanismos de otimização SEO, segundo o Backlinko.

Preparamos esse conteúdo para que você entenda tudo sobre breadcrumbs: o que é, para que serve e como configurá-lo no Wordpress. Ficou curioso? Então leia o artigo até o fim!

Breadcrumbs: o que é e quais são os tipos?

Breadcrumbs são elementos visuais na interface de um site que mostram o caminho que o usuário percorreu até chegar à página em que se encontra. Esse recurso se localiza na parte superior da página, logo abaixo do cabeçalho.

As migalhas de pão fornecem uma trilha de diferentes páginas a partir de uma ordem coerente e, na maioria dos casos, apontam o caminho que o usuário percorreu até chegar àquela em que se encontra.

Assim como no conto de João e Maria, a ideia dos breadcrumbs é fornecer rastros para uma navegação mais intuitiva. Dessa forma, o usuário tem noção do passo a passo que o levou até aquela página.

Veja um exemplo de breadcrumbs na página do livro Dom Casmurro, no e-commerce da Amazon. Sinalizamos esse elemento com um contorno verde:

Repare que os breadcrumbs hierarquizam os silos de conteúdo para facilitar a navegação do usuário. Dessa forma, ele percebe que está na seção “Livros” > “Literatura e Ficção” > “Literatura Clássica”

Nesse modelo, hierarquiza-se o conteúdo do site para dar coerência à experiência do usuário. Veja os principais tipos de breadcrumbs:

  • hierarquia: orienta o usuário na hierarquia de silos de conteúdos do site, desde a página mais abrangente até a mais específica;
  • caminho: sinaliza detalhadamente o caminho que o usuário percorreu até ali, para que siga em frente ou volte com mais facilidade;
  • atributos: funciona especialmente bem no e-commerce, pois sinaliza os filtros que o usuário utilizou ao refinar a busca por algum produto.

Para que servem os breadcrumbs?

Os breadcrumbs servem especificamente para enriquecer e facilitar a navegação do usuário pelo site. Especialmente em domínios com muitas páginas, esse recurso auxilia a localizar o usuário dentro de um site.

Essa funcionalidade torna a navegação bem mais intuitiva e facilita o acesso a outras seções e páginas, o que contribui diretamente para o crescimento das métricas de tráfego da marca.

Como todo bom artifício para aprimorar o UX (User Experience), os breadcrumbs também são preciosos para os algoritmos do Google, que dão pontos de SEO para sites cuidadosos com a navegação do usuário.

Veja como esse recurso é interessante para o SEO:

  • otimiza conteúdos do site para snippets (respostas prontas e objetivas que aparecem em destaque na primeira página do Google);
  • facilita o mapeamento do conteúdo do site para indexação do algoritmo, ou seja, torna o conteúdo mais claro e hierárquico para ranquear da melhor forma possível;
  • aumenta a taxa de cliques em links internos, o que mostra ao Google que o usuário sente-se bem em navegar pelo site.

Quer aprimorar a estratégia de SEO do seu site? Confira no vídeo abaixo quatro dicas essenciais:

Como funcionam os breadcrumbs no Wordpress?

Os breadcrumbs são recursos que integram-se facilmente a sites Wordpress. Afinal, vários plugins do CMS mais famoso do mundo são excelentes alternativas para configurá-los sem a necessidade de conhecimentos em HTML ou em programação.

Além disso, o próprio Wordpress oferece temas com breadcrumbs já inclusos, o que torna a otimização da navegabilidade um processo ainda mais simples pela plataforma.

Para quem prefere plugins para customizar ainda mais os breadcrumbs, aconselhamos o Yoast SEO, o Breadcrumbs Nav XT e o WP SEO Breadcrumbs.

Como configurar breadcrumbs no Wordpress?

Escolhemos o Yoast SEO para ensinar como configurar breadcrumbs no Wordpress. Essa ferramenta oferece uma série de funcionalidades para otimizar o conteúdo de sites e blogs nos mecanismos de busca.

Após instalação e ativação do plugin, siga o passo a passo abaixo:

  1. No Painel de Administração do Wordpress, acesse a opção “SEO” no menu lateral;
  2. Em seguida, vá em “Aparência de Pesquisa”;
  3. Ative a opção “Migalha de Pão” (ou “Breadcrumbs”);
  4. Abaixo da opção “Migalha de Pão”, inicie as configurações necessárias.

Dentre as opções de configuração, estão a definição de caracteres para separar as páginas e quais tipos de breadcrumbs utilizar.

Configure a interface do site com a GoDaddy

Entendeu direitinho o que são breadcrumbs? Maravilha! Deixamos para o final uma dica para organizar os elementos gráficos do seu site, como as migalhas de pão, de forma ainda mais rápida, simples e intuitiva.

Conheça o Criador de Sites da GoDaddy e escolha templates já prontos para customizar as páginas do site.

Obtenha resultados profissionais e conte com os elementos de UX para otimizar e personalizar o design das páginas!

Veja como é simples criar um site profissional do zero com a ferramenta da GoDaddy:

Products Used