SEO Optimización móvil
¿Cómo realizar correctamente SEO en teléfonos móviles? La Optimización móvil es el proceso de garantizar que los visitantes que acceden a su sitio web desde dispositivos móviles tienen una experiencia optimizada para el dispositivo.
La gente pasa cada vez más tiempo en sus dispositivos móviles y tabletas, pero muchos sitios web aún no están diseñados para darse cuenta de los diferentes tamaños de pantalla y los tiempos de carga. La Optimización móvil echa un vistazo al diseño del sitio, la estructura del sitio, la velocidad de la página, y más para asegurarse de que no está dando vuelta inadvertidamente a visitantes móviles que son posibles compradores.
SEO Mobile Mejores Prácticas
Si su sitio ya está bien optimizado para los motores de búsqueda, sólo hay un par de cosas adicionales que usted necesita pensar en la hora de optimizar su sitio web para móviles.
Velocidad de Página
Debido a problemas de hardware y de conectividad, la velocidad de la página es aún más importante para los usuarios móviles que los usuarios de escritorio. Más allá de la optimización de imágenes, usted querrá minimizar el código, el almacenamiento en caché del navegador, y reducir las redirecciones. Para más información sobre la velocidad de la página, puede dirigirse a la página Page Speed creada por Google para los webmasters.
No bloquee CSS, JavaScript, o imágenes
En los viejos tiempos, algunos dispositivos móviles no podían apoyar a todos estos elementos, por lo que los webmasters de sitios móviles bloqueban estos puestos. Pero en su mayor parte, que ya no es verdad, el Smartphone GoogleBot quiere ser capaz de ver y clasificar el mismo contenido que los usuarios hacen. Así que ya no es necesario ocultarlo. Estos elementos también son fundamentales para ayudar a Google a entender si usted tiene un sitio de respuesta o una solución móvil diferente.
Diseño del sitio para móviles
Los dispositivos móviles están simplificando y revolucionando las maneras de ver como los sitios están diseñados. "Por encima de la tapa" ya no tiene sentido en un mundo donde nos desplazamos sin fin.
No use flash
El plug-in puede no estar disponible en el teléfono de su usuario, lo que significa que perderá en toda la diversión. Si desea crear efectos especiales, utilice HTML5 en su lugar.
No utilice pop-ups en un sitio móvil
Puede ser difícil y frustrante para tratar de cerrar estos pop-ups en un dispositivo móvil. Esto podría llevar a una alta tasa de rebote.
Diseño para el dedo gordo
La navegación de pantalla táctil puede conducir a los clics accidentales si sus botones son demasiado grandes, demasiado pequeño, o en la trayectoria de un dedo que está tratando de obtener la página para desplazarse.
Optimizar los títulos y descripciones meta
Recuerde que usted está trabajando con menos espacio en la pantalla cuando un usuario busca utilizando un dispositivo móvil. Para mostrar su mejor trabajo en SERPS, debe ser lo más conciso posible (sin sacrificar la calidad de la información) al crear títulos, URLs y descripciones meta.
Utilice Schema.org datos estructurados
Debido al espacio limitado de la pantalla, un resultado de búsqueda con fragmentos enriquecidos es aún más probable que se destaquen que en un escritorio.
Optimizar para la búsqueda local
Si su negocio tiene un elemento local recuerde optimizar su contenido móvil para la búsqueda local. Esto incluye la estandarización de su nombre, dirección y número de teléfono y que incluye su ciudad y nombre del estado en los metadatos de su sitio.
Configuración de sitio móvil
Probablemente la decisión más importante que va a hacer cuando vaya a crear un sitio móvil es decidir si desea utilizar una porción dinámica de respuesta, o configuración del sitio aparte. Cada uno tiene sus ventajas y desventajas. Google prefiere el diseño de respuesta , pero apoya las tres opciones, siempre y cuando usted los haya configurado correctamente.
Diseño web Responsive
Sitios web responsablemente diseñados utilizan preguntas de los medios de CSS3 para servir el mismo contenido a los usuarios móviles y de escritorio usando una cuadrícula de fluidos y un diseño flexible para adaptarse automáticamente al tamaño de la pantalla del usuario.
Diseños Responsive utilizan preguntas de los medios para orientar el diseño basado en el ancho de la pantalla, la orientación y resolución. Por ejemplo, podría utilizar el siguiente CSS para instruir a los navegadores cómo mostrar contenido para una pantalla que tenga 420 o menos píxeles de ancho:
Código de ejemplo
@media screen and (max-width: 420px) {
.class {
[Introducir aquí los estilos]
}
}
.class {
[Introducir aquí los estilos]
}
}
Y para enlazar a una hoja de estilo separada en cambio, puese poner el siguiente código HTML en medio de sus etiquetas <head>:
Código de ejemplo
<link href="mobile.css" type="text/css" media="screen and (max-device-width: 480px)" rel="stylesheet"/>
Los Diseños Responsive le permiten tener una gran variedad de estas preguntas de los medios para que puedan usar los usuarios de pequeñas pantallas de teléfonos móviles, pantallas más grandes que la media, e incluso tabletas pueden todos ver a un sitio que se ve diseñado para sus dispositivos.
Utilice un emulador como el Responsive Web Design Testing Tool , para verificar que su diseño de respuesta tenga el aspecto que desea.
Porción dinámica
Si usted no tiene los recursos para un rediseño completo del sitio o quiere mostrar contenido diferente para los visitantes móviles, diferente a lo que haces en los de escritorio, una solución es utilizar una URL para mostrar diferentes conjuntos de HTML y CSS, dependiendo de qué tipo de dispositivo el visitante está utilizando (también llamado detector de agentes de usuario).
Visualización de contenido diferente, basado en el agente de usuario se llama porción dinámica y se hace uso de la cabecera vary HTTP header, que se ve así:
Vary encabezado HTTP
GET /page-1 HTTP/1.1
Host: www.example.com
(...rest of HTTP request headers...)
Host: www.example.com
(...rest of HTTP request headers...)
HTTP/1.1 200 OK
Content-Type: text/html
Vary: User-Agent
Content-Length: 5710
(... rest of HTTP response headers...)
Content-Type: text/html
Vary: User-Agent
Content-Length: 5710
(... rest of HTTP response headers...)
En pocas palabras, esto significa que el contenido que se muestra puede variar en función del agente de usuario que solicita la página.
La porción dinámica no es el compromiso perfecto que podría parecer. Por un lado, se basa en tener una lista actualizada de los agentes de usuario, lo que significa que cada vez que un nuevo dispositivo móvil llega al mercado esa lista debe actualizarse. Y no es raro que los equipos de escritorio y dispositivos móviles puedan ser erróneamente servidos con el HTML para el otro dispositivo.
URL móvil separada
Otra opción es crear un segundo sitio, paralelo para los usuarios móviles. Esto le permite crear contenido totalmente personalizado para visitantes móviles. Para evitar que la URL tenga se confunda, la mayoría de los sitios móviles paralelos utilizan un subdominio "m". Por ejemplo en el caso de Blogger es automático cuando se activa la plantilla móvil ?m=1
Sitios móviles paralelos pueden ser tan imperfectas como sitios que sirven dinámicas en el envío de los visitantes a la versión correcta, así que asegúrese de hacer más fácil para los visitantes que terminan en el lugar equivocado al hacer clic sobre su experiencia preferida.
Usted también querrá asegurarse de que sus redirecciones de sitio estén en su lugar y tan delgado como sea posible para disminuir la velocidad de la página. Y para evitar problemas de duplicado de contenido, deberá establecer rel = "canonical" .
¿Qué pasa con el uso de una aplicación?
La creación de una aplicación es una manera de adaptar la experiencia móvil para sus visitantes. Pero con la página muchos sitios utilizan para alertar a un usuario móvil que una aplicación está disponible, esto también puede servir como un bloque para buscar rastreadores de motores.
Herramientas relacionadas
Esta herramienta le permite ver lo que su sitio se ve como en una amplia variedad de dispositivos móviles.
Vea cómo su sitio responde a una variedad de tamaños de pantalla estándar.
Revise sus redirecciones mediante el análisis de su sitio con esta herramienta.
La herramienta Firefox add-on le permite ver cómo su sitio se ve cuando se accede desde un agente de usuario diferente.
A ponerlo en práctica.
Recuerda suscribirte:
Obtenga nuestro boletín de noticias diario | Suscríbete gratuitamente SUSCRIBIRSE
Comentarios