¿Cómo me aseguro de que mi sitio sea compatible con dispositivos móviles? una lista de control

Como informamos en nuestro resumen de noticias SEM del viernes, el analista de tendencias para webmasters de Google, John Mueller, confirmó que la última ola de cambios en la señal de clasificación optimizada para dispositivos móviles de Google ya ha terminado.

Desde la actualización inicial de ' ^Mobilegeddon ' que debutó el 21 de abril de 2015, la compatibilidad con dispositivos móviles ha sido un factor de clasificación importante en los resultados de búsqueda de Google. En su publicación de blog que presagiaba los cambios de algoritmo dos meses antes, Google dijo que quería que a los usuarios "les resulte más fácil obtener resultados de búsqueda relevantes y de alta calidad que estén optimizados para sus dispositivos [móviles]".

Google ha afirmado y reafirmado su compromiso con la compatibilidad con dispositivos móviles a lo largo de los años, implementando una etiqueta 'apto para dispositivos móviles' para distinguir los sitios web que están adaptados para dispositivos móviles, realizando cambios en la página de resultados de búsqueda móvil, incluidas URL fáciles de usar y enlaces de sitio ampliados, y el lanzamiento de Accelerated Mobile Pages para brindar una experiencia móvil ultrarrápida.

Ahora, con esta última actualización, Google ha fortalecido aún más su señal de clasificación compatible con dispositivos móviles, lo que hace que sea aún más importante para los webmasters tener un sitio que cumpla con los estándares de Google.

Con eso en mente, ¿cómo puede asegurarse de que su sitio esté a la altura? Hemos elaborado una práctica lista de verificación de las cosas que debe hacer (o no hacer) para obtener la factura de salud móvil más limpia posible de Google.

No utilice Flash

La mayoría de los navegadores móviles no pueden generar contenido Flash, por lo que una regla general clara para crear un sitio optimizado para dispositivos móviles es: no use Flash. El informe de usabilidad móvil de Google recomienda descaradamente que utilice "tecnologías web modernas" para mostrar el contenido, las animaciones y la navegación de su página. ¡Ay!

Asegúrese de que su ventana gráfica esté configurada correctamente

Una ventana gráfica es un tipo de etiqueta meta que le da al navegador instrucciones sobre cómo ajustar las dimensiones de la página y escalar a diferentes anchos de dispositivos. Esto debería aparecer en el encabezado de su página web.

Si no hay una etiqueta de ventana gráfica, los navegadores móviles mostrarán la página de forma predeterminada con el ancho de una pantalla de escritorio. Google tiene un tutorial sobre cómo configurar la ventana gráfica para su página y asegurarse de que sea accesible.

Lo que no debe hacer: establezca su ventana gráfica en un ancho fijo. Algunos desarrolladores definirán la ventana gráfica a un ancho de píxel fijo para adaptarse a los tamaños de pantalla móviles comunes, pero esto aún no será adecuado para todos los tipos de dispositivos, por lo que Google no lo considera apto para dispositivos móviles.

Si sigue las instrucciones del tutorial de Google y usa el valor de la ventana gráfica width=device-width , esto permitirá que su página coincida con el ancho de cualquier dispositivo que usen sus visitantes.

Agregar el atributo initial-scale=1 también permitirá que su página llene la pantalla, ya sea que el dispositivo esté en posición vertical u horizontal, y así aprovechar todo el ancho de la pantalla.

Finalmente, asegúrese de que su contenido tenga el tamaño de la ventana gráfica. Si establece anchos de CSS absolutos para elementos de página como imágenes y videos, esto puede causar un problema para los dispositivos que son más estrechos que el ancho que ha especificado. Puede evitar esto utilizando valores de ancho relativo, como ancho: 100% , en su CSS.

Usa letra grande

Si configuró su ventana gráfica correctamente, los tamaños de fuente se escalarán de acuerdo con el dispositivo del usuario, pero Google hace algunas recomendaciones adicionales para la fuente además de eso.

Se recomienda utilizar un tamaño de fuente base de 16 píxeles, con cualquier otro tamaño de fuente (como pequeño y grande) definido en relación con esa línea de base. El espacio vertical entre líneas debe establecerse en 1,2 em.

Intente también evitar el uso de demasiadas fuentes y tamaños de fuente diferentes, lo que genera diseños de página desordenados y complicados.

Espaciar enlaces y botones

Los enlaces y botones, también llamados "objetivos táctiles" por Google, son más difíciles de presionar en un dispositivo móvil que en un navegador de escritorio, porque los dedos son más anchos y generalmente menos precisos que el cursor del mouse.

Google penalizará las páginas en las que los objetivos táctiles sean demasiado pequeños y estén muy juntos para presionar con precisión.

La yema del dedo de un adulto promedio mide aproximadamente 10 mm de ancho, por lo que Google recomienda un tamaño de destino de toque mínimo de aproximadamente 7 mm, o 48 píxeles de ancho, al menos para los objetivos de toque más importantes, como botones de uso frecuente, enlaces de navegación, barras de búsqueda y campos de formulario.

Los objetivos que se usan con menos frecuencia pueden ser más pequeños, pero aún deben estar lo suficientemente separados para que un usuario que intente presionar uno no golpee accidentalmente otro objetivo en su lugar. El espacio recomendado alrededor de los objetivos táctiles más pequeños es de al menos 5 mm.

No utilice ventanas emergentes de pantalla completa

Las superposiciones y ventanas emergentes grandes o de pantalla completa, también llamadas "intersticiales", como un formulario de registro en una lista de correo o la promoción de una aplicación, pueden ser más perjudiciales en un dispositivo móvil.

Si bien una gran ventana emergente que llame la atención puede parecer una buena idea desde el punto de vista de una empresa, Google reconoce que interfiere con la experiencia de navegar un sitio en un dispositivo móvil y penalizará a los sitios que las usen.

En lugar de una ventana emergente de pantalla completa, Google recomienda usar un banner o implementar la indexación de aplicaciones, lo que permitirá que el contenido de su aplicación aparezca en los resultados de búsqueda, lo que lo convierte en un método de promoción muy efectivo.

Haz una comprobación con las herramientas de Google

La forma más fácil de verificar dos veces si su sitio está alcanzando todos los objetivos correctos para la compatibilidad con dispositivos móviles es utilizar las herramientas que Google ha proporcionado para realizar una verificación.

La Consola de búsqueda de Google, anteriormente conocida como Herramientas para webmasters, tiene una sección de 'usabilidad móvil' que diagnosticará cualquier problema persistente con su sitio, generalmente uno de los errores enumerados anteriormente.

También puede comprobar el estado móvil de las páginas web individuales pegando la URL en la prueba de compatibilidad con dispositivos móviles de Google. Y Google Developers tiene una sección que enumera los errores comunes que se cometen al diseñar para dispositivos móviles, que tiene algunos detalles adicionales sobre cosas como contenido que no se puede reproducir, redireccionamientos defectuosos y 404 y cómo solucionarlos.

La necesidad de velocidad

En sus recomendaciones para trabajar con un desarrollador para crear un sitio optimizado para dispositivos móviles (si no puede realizar los cambios necesarios en su sitio web usted mismo), Google sugiere pedirle a su desarrollador que "se comprometa con la velocidad".

Si bien Google no incluye una velocidad de carga lenta como uno de sus problemas de optimización móvil "debe corregir", sabemos que la velocidad es un factor de clasificación, y las estadísticas muestran que la velocidad de carga lenta con frecuencia puede hacer que los usuarios abandonen las páginas web.

Entonces, si desea brindar la mejor experiencia de usuario y también darle a su sitio optimizado para dispositivos móviles la mejor oportunidad de una clasificación más alta, considere acelerarlo tanto como sea posible.

PageSpeed ​​Insights de Google tiene una pestaña "móvil" que le dará a su página una calificación de velocidad móvil de 100, con consejos sobre cómo corregir los elementos que podrían estar ralentizándola.

También le dará a su página móvil una clasificación de experiencia de usuario de 100 y señalará cualquier problema de compatibilidad con dispositivos móviles de la misma manera que las otras herramientas de Google.

También están las páginas móviles aceleradas, las páginas web móviles ultrarrápidas de Google que se ejecutan en una versión reinventada de HTML. Crear una versión AMP de su sitio para dispositivos móviles es otra forma de asegurarse de que sea rápido y compatible con dispositivos móviles, aunque muchos SEO todavía se están reteniendo de implementar AMP por varias razones. Es una opción, pero no una necesidad, para tener un sitio móvil rápido y compatible con Google.

___
por Rebecca Sentance