SEO - site responsivo e menus duplicados

15

Sempre que crio um site responsivo, geralmente crio 2 menus: um oculto e usado para dispositivos móveis e o outro exibido como menu principal; depois, oculto para mostrar o menu móvel. Sempre que se trata de SEO e de aranhas que navegam no site, sou enganado por ter menus duplicados? Há algo que eu possa fazer para indicar à aranha que esse menu é para celular e esse é o principal?

A razão final pela qual eu tenho 2 menus diferentes é por causa da localização, geralmente o menu principal está em algum tipo de barra abaixo do logotipo, etc.

seo web-crawlers googlebot navigation Howdy_McGee
fonte
11
Por que não usar consultas responsivas e criar o menu position:fixedou position:absolute, adicionalmente, a maioria das estruturas, como o bootstrap e o zurb foundation, possui puxamentos de consulta que podem mover elementos com base no dispositivo que está acessando a página ...
Simon Hayter
Se você criar 2 menus, isso não é Responsivo. Os menus responsivos usam o mesmo <nav>conteúdo e o estilizam de maneira diferente, considerando um ponto de interrupção de consulta de mídia específico.
HexalysAbr
@hexalys não necessariamente. Eu poderia ter um menu parcial para uma "Navegação principal na área de trabalho" e depois um "Menu móvel" com uma navegação mais completa, ambos <nav>exibindo apenas mais itens na versão móvel, para facilitar a navegação.
precisa saber é o seguinte
@Howdy_McGee Sure. Mas isso não é realmente o que você descreve na pergunta. A problemática de transformar uma barra de navegação do meio em um menu superior ou de hambúrguer para dispositivos móveis, por exemplo, pode ser difícil, mas é viável através de alterações no layout CSS. Eu consegui ok aqui: goo.gl/v8HdLD. E estou aqui agora, porque também estou extremamente preocupado com esse tipo de abordagem preguiçosa e deliberada do pobre homem para dois plug-ins do "menu responsivo" do wordpress e suas implicações em termos de conformidade, acessibilidade e desempenho do mecanismo de pesquisa.
Hexalys:
@hexalys Acho que existem prós e contras; ambos têm o seu lugar, respectivamente, depende apenas da situação. Desde que eu perguntei isso, eu vi mais a favor de um único menu, mas não vi nada que diga que ter dois menus separados é uma coisa ruim ou está sendo dinged em SEO.
Howdy_McGee

Respostas:

8

Você não tem nada com o que se preocupar. Você pode usar display: none;para alternar menus. Os mecanismos de pesquisa são muito melhores para entender JS e CSS.

Contanto que você não esteja tentando intencionalmente manipular as coisas para obter uma melhor classificação. Usando display: nenhum; ocultar grandes blocos de texto, você será penalizado. Portanto, se você estiver usando apenas para ocultar o menu da área de trabalho no celular e vice-versa, não estará em perigo. Dê uma olhada neste thread antigo do StackExchange:

Quão ruim é usar display: none em CSS?

O Google gosta bastante de design responsivo e prefere um site móvel separado.

Aqui está um bom artigo sobre " SEO do Design Responsivo "

Além disso, confira este artigo / vídeo:

Matt Cutts (Google), disse que você não precisa se preocupar com a desvantagem relacionada ao SEO ao usar uma abordagem de design responsivo para sites para celular.

dasickle
fonte
11
A maioria de suas citações e artigos se refere a ter um site responsivo e ter um site móvel, o que não é necessariamente o que estou pedindo (desculpe a confusão), mas mais a respeito das desvantagens ou uso de 2 menus, um menu para celular menu principal e um para o menu principal da área de trabalho. Parece ter dois menus, e os rastreadores que leem o código-fonte os interpretam separadamente.
precisa saber é o seguinte
Eles estavam lá para apoiar minha segunda declaração sobre design responsivo em geral. Eu incluí outro link no topo para você e existem alguns deles por aí.
Dasickle dasickle
11
@dasickle Dada essa abordagem com vários menus, ao pesquisar um domínio específico no google (por exemplo, pesquise "warmane"), ele incluirá no resultado da pesquisa a navegação desse site, isso será afetado de alguma maneira?
Dragos Rizescu
2

Você pode usar display: flex e especificar um order: nvalor alternativo para as divisões que movem sua divisão de menu acima ou abaixo de outras divisões.

Em outras palavras, você não precisa de dois menus com o mesmo conteúdo se sempre ocultar um ou outro deles.

RedGrittyBrick
fonte
1

A maioria dos menus móveis é "aberta" através de um clique no botão, abrindo essencialmente em uma janela modal de algum tipo ou de outro. Quando se trata de um site que atenda aos padrões de acessibilidade - esses menus precisam ser colocados no DOM de maneira deliberada. Não basta simplesmente usar um NAV no cabeçalho e aplicar CSS diferente para obter o layout desejado (na maioria dos casos).

Conclusão - se o menu não estiver visível inicialmente e sobrepor o restante do conteúdo - provavelmente será necessário colocar vários elementos de navegação em posições diferentes no DOM (ocultando um e mostrando o outro, dependendo do tamanho da tela e do desejo) )

Cody
fonte