Pão ralado ou pão ralado. "Pão ralado" - o que são? Exemplos de navegação Breadcrumbs se o artigo estiver em várias seções

31.07.2023

Tempo de leitura: 6 minuto(s)

Lembra-se do conto de fadas dos Irmãos Grimm “João e Maria”? Lá eles jogaram migalhas de pão na estrada para encontrar o caminho de casa. Claro que no conto de fadas os pássaros os bicaram e eles não puderam voltar, acabaram com a bruxa malvada. O que isso tem a ver com um conto de fadas e um artigo sobre marketing na Internet? É muito simples, o termo “breadcrumbs” é usado por especialistas. E ninguém no local comerá essas migalhas, elas mostrarão ao visitante o caminho certo.

Migalhas de pão- Este é um dos tipos de navegação no site. O exemplo mais simples desta navegação pode ser visto em um computador. Dê uma olhada na foto:

Para voltar à seção sys(C), você não precisa pressionar o botão “Voltar” várias vezes, basta clicar no nome da própria pasta e você estará lá.

Por que você precisa dessa navegação em um site se você pode clicar em “Voltar” algumas vezes e chegar onde precisa? Se você estiver no site de uma loja online, por exemplo, para voltar algumas posições, perderá muito tempo e muito provavelmente os resultados da sua pesquisa não serão salvos. As ferramentas de navegação do navegador são estranhas.

Abaixo está um exemplo de “breadcrumbs” no site BonPrix:

Prós da farinha de rosca:

Simplifique a navegação do site para o usuário.
Os mecanismos de pesquisa classificam melhor um site com navegação.
Inicialmente, você vinculará as páginas corretamente (links internos).
Crie trechos fáceis de ler nos motores de busca. Snippet é um texto usado como descrição de links nos resultados de pesquisa.
Crie o peso de âncora correto para o link.

Neste artigo, você aprenderá no que prestar atenção ao criar uma navegação estrutural.

Peso da página– este é um valor condicional que mostra a “significância” do site.

Peso da página estáticaé o número de links nele. A página principal do site terá o maior peso, pois os links de todas as páginas do site levam à página principal.

Mas também acontece que você é promovido com base em solicitações competitivas. Neste caso, é melhor usar não a palavra “Home”, mas sim a frase ou consulta inteira, por exemplo: Tecnologia > Acessórios > Teclados

2. Comportamento do usuário

A navegação adequada no site ajuda os usuários a encontrar rapidamente as informações de que precisam. E do lado dos mecanismos de pesquisa, esse site tem melhor classificação para consultas promovidas.

Métricas como profundidade de navegação e envolvimento do usuário também melhoram. E isso, por sua vez, tem um efeito positivo não apenas nas posições do site, mas também nas taxas de conversão.

3. Trecho

Trecho– este é um trecho de texto exibido próximo ao link nos resultados da pesquisa.

Usando o mecanismo de busca Google, você pode transmitir dados estruturados e melhorar a classificação do seu site nos resultados de pesquisa. Yandex está um pouco atrás do Google e ainda não sabe como suportar esse tipo de marcação. Mas o próprio Yandex cria uma cadeia de navegação que pode ser vista na pesquisa.

Breadcrumbs formatados e não formatados usando dados estruturados nos resultados do Google:

O Google usa três formatos para transmissão de dados estruturados – JSON-LD, Microdata, RDFa. Os formatos microdados e RDFa são adequados para breadcrumbs. Abaixo está um exemplo de formatação de código no formato Microdata:

Depois de completar o código, você precisa ter certeza de que não há erros. Existe uma ferramenta validadora do Google para isso.

A ferramenta o ajudará a garantir que ocorra o correto processamento e exibição dos dados estruturados.

4. Lembre-se

É uma boa prática não transformar o último elemento de navegação em um link, por exemplo: lar > Blogue> Artigo
Se você usar muitas palavras-chave em sua cadeia de navegação, aumentará a probabilidade de seu site ser filtrado pelos mecanismos de busca.
A implementação ou não de breadcrumbs depende do tipo de recurso que você possui. Se você tem um site de cartão de visita ou há poucas seções no site, você não precisa dessa navegação. Mas se você tem uma grande loja online, obviamente precisa dessa cadeia de navegação.

A navegação breadcrumb é um design indispensável e necessário. Antes mesmo de lançar o site, é preciso pensar a navegação nos mínimos detalhes. Também é vital para sites de várias páginas com estrutura complexa. Dê uma olhada nos maiores recursos e lojas online, onde um sistema bem pensado permitirá que você entenda todos os meandros da navegação e suas funcionalidades.

“Breadcrumbs” (do inglês “breadcrumbs”) é uma cadeia de navegação em um site que reflete o caminho da página principal até a página atual. Eles foram usados pela primeira vez em gerenciadores de arquivos como Norton Commander ou Volkov Commander e mostraram o caminho para a pasta raiz.

Por que usar essa navegação duplicada no site? Como isso afeta a usabilidade e o SEO? Como implementá-lo? Encontre respostas para as perguntas mais populares sobre breadcrumbs em nossa nova postagem.

Para que serve a farinha de rosca?

Em 1995, Jakob Nielsen formulou 10 princípios de usabilidade, o primeiro dos quais foi “Visibilidade do status do sistema”. Sua essência é que o usuário sempre saiba em que parte do site se encontra. É para implementar este princípio que são necessárias “migalhas de pão”. O famoso designer Artemy Lebedev escreve em Kovodstvo que a navegação duplicada é apropriada quando há aninhamento lógico de conteúdo, ou seja, em quase todos os sites de informação. Acrescentemos que a cadeia de navegação também é necessária para lojas online e sites corporativos.

Do ponto de vista da usabilidade, a localização atual resolve três problemas:

informar o usuário sobre sua localização atual no site;
demonstrar claramente a estrutura do recurso;
permitem que você passe rapidamente para mais alto nível aninhamento, ignorando o botão "Voltar" do navegador.

Além do impacto positivo na usabilidade, a navegação duplicada tem um efeito SEO:

é um elemento natural de vinculação de páginas;
melhora as métricas comportamentais (tempo no site e profundidade de navegação), simplificando a navegação;
desde que a micromarcação esteja configurada, ela melhora aparência snippet na pesquisa, ou seja, forma uma cadeia de navegação e aumenta sua clicabilidade (suportado apenas no Google).

O que são “migalhas de pão”?

A trilha de navegação pode ser organizada de acordo com diferentes princípios:

Princípio linear. Esta é a opção mais comum - é indicado o caminho completo da página principal até a atual. Um exemplo está na figura abaixo:

Aqui é mostrada a seguinte estrutura de aninhamento: a página principal é “Centro de Móveis”, depois segue a página do catálogo de produtos, depois a seção “Cozinhas”, depois “Conjuntos de Cozinha” e, por fim, o nome de um conjunto específico.

Se a estrutura do site for muito complexa, existe uma versão simplificada de “breadcrumbs”:

Na loja Amazon, as “migalhas” não começam na página principal, mas no nome da seção do catálogo. A imagem mostra que o “início da referência” é a seção “Casa e Cozinha” da loja.

Princípio "voltar". A essência do método é que em vez de uma cadeia de navegação, é colocado um link “Para a página anterior”, “Voltar ao catálogo”, etc., que na verdade duplica o botão “Voltar” do navegador. Essa abordagem é conveniente se o site usar uma função de pesquisa.

Na captura de tela, o botão “Resultados” leva do cartão do produto a uma página com os resultados da pesquisa para a consulta “Calçados”.

Combinação das duas opções anteriores. Nesse caso, uma localização atual linear e um botão Voltar estão disponíveis. EM execução correta Essa combinação é adequada para páginas que os usuários encontraram por meio da função de pesquisa do site. Mas também há uma execução malsucedida quando o botão “Voltar” está presente em todos os cartões, independentemente de terem sido procurados por meio de busca ou não:

Princípio atributivo. Usado por lojas online e catálogos online. O conteúdo e o caminho da página são formados com base em propriedades e filtros especificados pelo usuário.

Ao excluir e adicionar propriedades, o usuário cria sempre um “caminho” exclusivo para a página do produto.

Como criar a farinha de rosca certa?

Você pode criar uma trilha de navegação jeitos diferentes: usando PHP, CSS, plugins para o popular CMS WordPress, Joomla! e outros motores - você pode encontrar muitas soluções na Internet. Seja qual for o método que você escolher, siga estas dicas:

“Breadcrumbs” são criados principalmente para visitantes do site, para sua conveniência, portanto, use-os quando forem realmente úteis; você não é obrigado a adicioná-los a todos os sites - por exemplo, sites de uma página funcionam perfeitamente sem localização atual;
“breadcrumbs” não substituem o menu principal, mas apenas uma ferramenta auxiliar de navegação;
Você não deve ajustar especificamente as âncoras de texto nos links de navegação para frases-chave; exceção - se as frases-chave se enquadrarem harmoniosamente na lógica de navegação;

se você usar navegação linear, escreva o caminho até o final para não confundir os visitantes:

Uma estrutura de site clara e descomplicada é o que você deve buscar ao desenvolvê-lo e posteriormente mantê-lo. É necessário otimizar a estrutura não só para comodidade dos usuários, mas também para evitar problemas com sua indexação por robôs de busca.

Componentes da estrutura do site

A estrutura de um site é a hierarquia de seções, subseções e páginas nas quais está localizado o conteúdo postado nele. A estrutura deve ser clara, conveniente e consistente com o tipo de informação contida no recurso.

Existem vários tipos de estruturas, em cada uma das quais os elementos estão dispostos de uma determinada forma:

Estrutura linear – apresentação sequencial da informação. O usuário abre uma página após a outra, familiarizando-se gradativamente com as informações nelas apresentadas. A navegação padrão para esses sites de livros é ir para a página principal, anterior ou seguinte. Uma estrutura linear pode ter vários ramos da página principal.
Estrutura em árvore - neste caso, é construída uma hierarquia na qual o usuário passa da página principal para as seções. As subseções podem ser abertas para qualquer seção, e suas próprias subdivisões do próximo nível, bem como as páginas internas finais, podem ser abertas para elas.
Estrutura treliçada - semelhante à anterior, mas é uma opção mais complexa, quando de qualquer seção, de qualquer página você pode ir para qualquer parte do site, para ramos completamente diferentes.

Na maioria das vezes, uma estrutura em árvore é considerada a mais ideal e conveniente - não complica o trabalho das pesquisas, se tudo for feito corretamente, e ajuda a tornar a navegação confortável e compreensível para os visitantes.

Como otimizar a estrutura do site?

Para que nem os visitantes nem os bots dos motores de busca percam muito tempo pesquisando no site as informações necessárias, a estrutura deve ser construída de acordo com certas regras. Você deve evitar os erros mais comuns que surgem ao desenvolver um mapa do site e como navegar nele.

Requisitos da página inicial

A página inicial é a cara do site e da marca a que pertence. É muito importante trabalhar aqui cada pequeno detalhe e garantir que o visitante continue conhecendo o site e as informações nele contidas. No que diz respeito ao SEO, os requisitos para este elemento da estrutura são os seguintes:

É necessário excluir a presença de duplicatas da página principal, disponíveis em diferentes endereços. Para encontrar duplicatas, você pode inserir o título principal entre aspas na barra de pesquisa do Yandex ou do Google.
A página inicial é utilizada como ponto de partida para a navegação, uma apresentação do recurso com breves informações sobre ele. É melhor não postar pedidos aqui e não promovê-la através deles.
O número de telefone e endereço da organização devem estar em local visível (caso suas atividades exijam que o cliente possa comparecer ao seu local), o nome escrito em texto (não uma foto ou não apenas uma foto). Normalmente, essas informações são colocadas no topo, no cabeçalho do site.
A página principal deve ter um diretório de navegação conveniente para passar para outras seções e páginas individuais.
Elementos como metatags devem conter o nome da organização. Devem ser curtos, concisos, sem sinais que não contenham qualquer informação.

Otimização de partição

As seções do site permitem dividir as informações em grupos correspondentes a diferentes áreas, temas, unindo bens ou serviços homogêneos.

Nas seções, é aconselhável começar a promover consultas de alta frequência sobre temas relevantes. Eles devem ser incluídos tanto no texto quanto nas meta tags e URL.

Mesmo os portais comerciais devem criar seções com conteúdo informativo sobre o tema do site para atrair mais visitantes. Por exemplo, no site de uma loja de dispositivos móveis você pode publicar análises e notícias sobre novos produtos que serão lançados no mercado.

As seções do sistema e as seções não destinadas aos visitantes devem ser ocultadas da indexação, proibindo sua visibilidade em “robots.txt”. Isto não se aplica às seções responsáveis pelo design adaptativo (se o layout adaptativo foi usado ao criar o site). Periodicamente, você deve monitorar se essas seções foram excluídas ou renomeadas para atualizar as informações do arquivo.

Trabalhando com referências circulares

Adicionar links para eles nas páginas levanta dúvidas entre os especialistas em SEO. Você pode deixar um link circular no menu de navegação, mas utilizá-lo no texto não se justifica e não traz nenhum efeito.

Mapa do site dinâmico

O uso de um mapa de site dinâmico em formato XML pode aumentar significativamente a velocidade e a eficiência da indexação de recursos por robôs de pesquisa. Para configurar esse mapa, você pode usar o plugin All in One SEO Pack.

Controlando o nível de aninhamento de páginas

Um grande grau de aninhamento de páginas torna a estrutura do site mais pesada. Páginas com muito aninhamento são pior indexadas pelos motores de busca. Para identificar páginas altamente aninhadas, você pode usar o recurso Xenu Link Sleuth.

O que são trilhas em SEO?

Breadcrumbs são entendidos como um elemento de navegação que é exibido em cada página e representa uma descrição do caminho para uma determinada página a partir da página principal, ou uma hierarquia de níveis que levam da página principal até aquela em que o visitante está localizado. Por exemplo: Home/Carros/Toyota/Toyota Land Cruiser 200.

Isso permite que o usuário navegue melhor no site e possa retornar ao nível desejado na hierarquia a qualquer momento.

Uso do símbolo de copyright

Para mostrar que o site está protegido contra cópia, você pode instalar o ícone de direitos autorais - ©. Esta é uma letra estilizada "c" de palavra em inglês copyright, que significa "direitos autorais".

Este símbolo geralmente é colocado na parte inferior do site, no elemento “rodapé”. Para que a sua utilização tenha o efeito pretendido, e no futuro possa utilizar o facto da sua existência para proteger os seus direitos exclusivos de propriedade do site, é necessário formalizá-lo nos termos da lei. Os padrões para design de sinalização são regulamentados no documento GOST R 7.0.1-2003 e no artigo 1271 do Código Civil da Federação Russa.

Para cumprir todos os requisitos, as seguintes informações devem ser colocadas no site:

O próprio ícone no formato exigido pelo GOST (a letra latina “c” colocada em um círculo);
Dados do titular dos direitos do objeto (neste caso, o site) - sobrenome, nome, patronímico se for pessoa física, e o nome indicado conforme nos documentos oficiais de registro das organizações;
O ano em que o site foi publicado na Internet.

O tipo correto de aviso de direitos autorais: © Kisel LLC, 2000-2017. Tudo é importante aqui - até mesmo os sinais de pontuação. O intervalo de datas é indicado caso novos dados e materiais apareçam periodicamente no site. Se não houver atualizações, você só poderá indicar o ano em que o site foi postado. A indicação de direitos autorais agregará credibilidade ao site e, se não espantar golpistas, sua presença pode aumentar a confiança no portal de clientes e parceiros.

Vamos primeiro descobrir o que é - migalhas de pão no site e por que elas são necessárias.

A localização atual foi originalmente usada para facilitar a navegação dos usuários. Essencialmente, este é um bloco de links no topo da página que exibe a hierarquia do site. Aqueles. o usuário pode retornar, por exemplo, à página anterior do catálogo de uma loja online.
Aqui está um exemplo claro:

O impacto da localização atual no SEO

Com o tempo, os otimizadores de SEO perceberam que esse bloco de links tem um efeito positivo na promoção do recurso. E é por isso que funciona:

1. Vinculação interna

De acordo com a hierarquia de quase todos os sites, quanto menor o nível de aninhamento de uma seção, mais importante ela é. Portanto, é necessário garantir que a estrutura do site seja tal que os links das páginas mais profundas levem às mais superficiais. É mais fácil explicar com um exemplo.

Como você pode ver na imagem, cada produto está vinculado a uma categoria, e cada categoria está vinculada à página principal do site.
Essa vinculação tornou-se uma espécie de padrão na área de promoção e por isso os motores de busca passaram a utilizá-la diretamente em seus próprios resultados. Isso é feito usando a marcação Schema, mas falaremos mais sobre isso mais tarde.

2. Fatores comportamentais

Há vários anos, os motores de busca começaram a analisar o comportamento do usuário no site e, dependendo disso, colocar as páginas em uma posição ou outra para consultas. Como você pode imaginar, um desses fatores comportamentais— o número de transições internas no site. A farinha de rosca pode melhorar seriamente este indicador em alguns casos.

Marcação de esquema para localização atual

A micromarcação permite que os mecanismos de pesquisa identifiquem a localização atual com mais precisão e até mesmo os adicionem aos resultados como um bônus. Vai parecer algo assim:

E embora a localização atual seja geralmente instalada por padrão em sites, a micromarcação geralmente precisa ser adicionada manualmente. Portanto, escreveremos uma breve instrução sobre como implementar isso.

lar

Agora vamos ver o que é.

A primeira coisa que precisamos fazer é agrupar cada link em uma tag e escreva na própria tag
itemscope="" itemprop="itemListElement" itemtype="http://schema.org/ListItem"

LINK

Essa tag continua sendo o padrão. Nele informamos aos mecanismos de pesquisa que esta é uma marcação de esquema e o elemento dessa marcação é chamado itemListElement. Esta construção é usada em todas as referências.

lar

Assim, se tivéssemos um segundo nível de aninhamento, teríamos que escrever content=”2″.

Uma boa navegação é extremamente importante para um site. E aqui as migalhas de pão virão em seu auxílio. Vamos ver o que são e como usá-los.

Breadcrumbs são um tipo de navegação secundária de site que mostra a localização de um usuário em um site ou aplicativo da web.

Normalmente, a localização atual pode ser encontrada em sites grandes, onde todas as páginas são organizadas de acordo com uma hierarquia estrita. Em sua forma mais simples, a localização atual são links de texto posicionados horizontalmente, separados por um símbolo maior que - ">" . Este símbolo indica o nível desta página em relação a outras páginas do site.

Quando você deve usar migalhas de pão?

Na verdade, nem sempre há necessidade de utilizar este elemento de navegação. Mas vamos ver quando você ainda precisa usá-los.

Use a navegação estrutural para sites grandes e sites que possuem páginas organizadas hierarquicamente. Um excelente cenário são os sites de comércio eletrônico onde uma grande variedade de produtos são agrupados em categorias lógicas.

Você não deve usar trilhas para sites de nível único que não possuem hierarquia ou agrupamento lógico. Uma ótima maneira de determinar se um site se beneficiaria da navegação estrutural é construir um mapa do site ou diagrama que represente a arquitetura de navegação do site e, em seguida, analisar se a localização atual melhorará a capacidade do usuário de navegar dentro e entre categorias.

A navegação estrutural deve ser considerada apenas um recurso opcional e não deve substituir menus de navegação primários eficazes. Este é um recurso útil; um esquema de navegação secundário que permite aos usuários determinar onde estão; e uma forma alternativa de navegar em seu site.

Tipos de migalhas de pão

Existem três tipos principais de migalhas de pão. Vamos dar uma olhada neles.

1. Baseado em localização.

Este é provavelmente o tipo de pão ralado mais reconhecível. Mostra ao usuário onde ele está na hierarquia do site. Esse tipo é normalmente usado para projetos de navegação que possuem vários níveis (geralmente mais de dois níveis). No exemplo de loja online abaixo, você pode ver os níveis da hierarquia.