Cada vez que creo un sitio web receptivo, generalmente creo 2 menús: 1 oculto y utilizado para dispositivos móviles y el otro como el menú principal, luego oculto para mostrar el menú móvil. Siempre que se trata de SEO y arañas que navegan por el sitio web, ¿me critican por tener menús duplicados? ¿Hay algo que pueda hacer para indicarle a la araña que este menú es para dispositivos móviles y que este es el principal?
La razón final por la que tengo 2 menús diferentes se debe a la ubicación, generalmente el menú principal está en algún tipo de barra debajo del logotipo, etc., pero el menú móvil que quiero está encima de todo, por encima del logotipo, etc.
seo
web-crawlers
googlebot
navigation
Howdy_McGee
fuente
fuente
position:fixed
oposition:absolute
, además, la mayoría de los frameworks como bootstrap y zurb foundation tienen pulls de consulta que pueden mover elementos según el dispositivo que está accediendo a la página ...<nav>
contenido y le da un estilo diferente dado un punto de interrupción de consulta de medios particular.<nav>
visualización de más elementos en la versión móvil para que sea más fácil de navegar.Respuestas:
No tienes nada de qué preocuparte. Puede usar
display: none;
para cambiar los menús. Los motores de búsqueda son mucho mejores para comprender JS y CSS.Mientras no intentes manipular intencionalmente las cosas para obtener una mejor clasificación. Usando la pantalla: ninguno; ocultar grandes bloques de texto te penalizará. Entonces, si solo está usando para ocultar el menú de su escritorio en el móvil y el versículo de visa, no está en peligro. Echa un vistazo a este viejo hilo de StackExchange:
¿Qué tan malo es usar display: none en CSS?
A Google le gusta mucho el diseño receptivo y lo prefiere a un sitio móvil separado.
Aquí hay un buen artículo sobre " SEO de diseño receptivo "
Además, mira este artículo / video:
Matt Cutts (Google), dijo que no tiene que preocuparse de que haya un inconveniente, relacionado con el SEO, al usar un enfoque de diseño receptivo para sitios web móviles.
fuente
Puede usar
display: flex
y luego especificar unorder: n
valor alternativo para las divisiones que mueve la división de su menú por encima o por debajo de otras divisiones.En otras palabras, no necesita dos menús con el mismo contenido si siempre oculta uno u otro.
fuente
La mayoría de los menús móviles se "abren" mediante un clic en un botón, que se abre esencialmente en una ventana modal de algún tipo u otro. Cuando se trata de un sitio web que cumple con los estándares de accesibilidad, esos menús deben colocarse en el DOM de manera deliberada. No es suficiente simplemente usar un NAV en el encabezado y aplicar CSS diferente para lograr el diseño deseado (en la mayoría de los casos).
En pocas palabras: si su menú no es visible inicialmente y se superpone al resto del contenido, probablemente será necesario tener múltiples elementos de navegación ubicados en diferentes posiciones en el DOM (ocultando uno y mostrando el otro dependiendo del tamaño de la pantalla y el deseo) )
fuente