¿Qué tan amigable para dispositivos móviles es su sitio de WordPress?

Mientras que otros se apresuraron a preparar su sitio web para "Mobilegeddon", usted se sentó con aire de suficiencia, descansando en el conocimiento de que su tema de WordPress ya responde completamente, ¡sin penalizaciones en el futuro!

Bueno, tu tema puede verse genial en pantallas más pequeñas ...

… Pero ¿qué pasa con todo lo demás en su sitio?

Piense en todo el contenido de su sitio que no sea su tema: tal vez use algún código personalizado para incrustar videos o formularios de suscripción, o use plugins que agreguen botones para compartir y otras funciones a su sitio.

¿Todos se ven geniales y funcionan bien en dispositivos móviles? ¿O podrían estar costando tráfico y conversiones?

La cantidad de tráfico web procedente de dispositivos móviles superó a las computadoras de escritorio hace más de un año, y sigue aumentando. Verifique sus propios análisis: probablemente se sorprenderá de la cantidad de tráfico que no proviene de usuarios de escritorio.

Por eso es importante no solo tener un sitio que responda a los dispositivos móviles, sino también que sea totalmente compatible con dispositivos móviles.

Desafortunadamente, los sitios web verdaderamente optimizados para dispositivos móviles son raros. ¿Está cometiendo estos errores habituales en dispositivos móviles?

6 errores comunes que hacen que su sitio no sea compatible con dispositivos móviles

1. No centrarse lo suficiente en el contenido

“Los usuarios llegan a un sitio para encontrar la información que necesitan o para realizar una tarea, no para contemplar la belleza de los botones, la navegación, los menús y otros elementos de diseño”, afirman los expertos en usabilidad del Grupo Nielsen Norman señalar.

Cuando alguien visita su sitio en su teléfono inteligente, ¿qué ven primero?

¿Es el contenido real que están buscando o su pantalla está llena de su logotipo, barras de navegación, cuadros de búsqueda, formularios de registro y otros elementos?

En un escritorio, es fácil para los usuarios ignorar estos elementos hasta que los necesiten.

Pero en los dispositivos móviles, el espacio en pantalla es escaso y los usuarios están impacientes por obtener la información que buscan.

Si tienen que desplazarse mucho para llegar a él, es probable que se rindan y prueben otro sitio más fácil de usar.

2. Usar plugins para compartir intrusivos

¿Su sitio tiene botones para compartir en redes sociales que flotan junto con su contenido, siguiendo a los lectores a medida que se desplazan?

Pueden verse muy bien en el monitor de su escritorio, pero ¿sabe cómo se ven en las pantallas de los dispositivos móviles?

No todos los botones flotantes para compartir son un problema, pero hay muchos que simplemente no funcionan bien con diseños receptivos.

Si su contenido está justo al lado de la pantalla (como suele ser el caso en los dispositivos móviles con su espacio de pantalla limitado) y sus botones para compartir están flotando a lo largo del costado de la pantalla, ¿adivinen qué?

Su contenido se vuelve completamente ilegible e inútil ya que está cubierto por esos botones persistentes.

Si usa botones flotantes para compartir en redes sociales, asegúrese de verificar que no cubran su contenido en ninguna pantalla de tamaño.

Si es posible, considere deshabilitar sus botones flotantes en dispositivos móviles, o use un plugin receptivo como Social Warfare que cambia el tamaño de los botones para compartir sobre la marcha y elimina los botones flotantes por completo en las pantallas pequeñas. Lea más en nuestro resumen de los mejores plugins para compartir en redes sociales para WordPress.

Y donde sea que coloque sus botones para compartir para usuarios móviles, es inteligente limitar los botones a solo 2 o 3 de los más populares. Tener un montón de botones diminutos los hace aún más difíciles de usar en una pantalla pequeña.

3. Incrustación de objetos con altura y ancho definidos

Si comparte videos de YouTube en su blog, podría arruinar la experiencia de sus visitantes móviles.

El código que le proporciona YouTube para insertar un video se parece a esto:

<iframe width="560" height="315" src="https://www.youtube.com/embed/KhI_PG518Ow" frameborder="0" allowfullscreen></iframe>

Eche un vistazo de cerca: ¿ve esos atributos de "ancho" y "alto"?

Eso significa que su video incrustado mantendrá ese ancho y alto, sin importar el tamaño de pantalla en el que se esté viendo, incluso si la pantalla tiene menos de 560 píxeles, lo que ocurre con muchos teléfonos inteligentes.

Esto también podría suceder con otros objetos incrustados, como infografías. Asegúrese de verificar de cerca los códigos de inserción para los atributos de ancho y alto.

Si desea que sus objetos incrustados respondan, considere usar este código de Smashing Magazine.

4. Uso de formularios de participación estáticos

Si usa formularios de suscripción voluntaria en su sitio web, asegúrese de que respondan junto con su tema. Si copia y pega el código desde otro lugar (como el proveedor de su lista de correo electrónico como AWeber o MailChimp), es posible que no esté optimizado para dispositivos móviles. Puede verificar el código para los atributos de ancho y alto, como en el ejemplo de video incrustado de YouTube anterior.

Asegúrese de que sus formularios de suscripción sean fáciles de usar en todos los aspectos:

• ¿Todos los campos son absolutamente necesarios?
• ¿Está la etiqueta encima del campo (no use marcadores de posición)?
• ¿Son lo suficientemente grandes para dedos grandes?
• ¿Utiliza el teclado correcto para cada campo (por ejemplo, números para códigos postales y números de teléfono)?

Completar formularios es difícil en los dispositivos móviles, así que asegúrese de hacerlo lo más fácil posible para esos usuarios para que no se rindan por la frustración.

5. Ventanas emergentes del tamaño de un escritorio

¿Utiliza ventanas emergentes en su sitio web? No te culpamos; una ventana emergente bien diseñada puede ser una excelente manera de crear su lista de correo electrónico.

Pero puede estar volviendo loco a su audiencia al incluir esas ventanas emergentes en su sitio móvil.

A menudo, las ventanas emergentes diseñadas principalmente para una pantalla de escritorio son demasiado grandes para los dispositivos móviles.

Si son "receptivos" y se reducen de tamaño cuando se ven en la pantalla de un móvil, es posible que sean demasiado pequeños para que los lectores entiendan lo que intentan decir.

O peor aún, si no responden en absoluto, podrían estar cubriendo todo su sitio, haciendo imposible que sus visitantes vean su contenido real. A menudo, la pequeña "x" en la esquina está fuera de la pantalla, por lo que los usuarios ni siquiera pueden deshacerse de la ventana emergente si quieren seguir intentando leer su contenido.

Si puede, desactive las ventanas emergentes en los dispositivos móviles o pruebe cuidadosamente una ventana emergente que responda para asegurarse de que funciona bien en el dispositivo móvil.

(¡Muchos de los plugins enumerados en nuestros plugins de creación de listas principales para WordPress son compatibles con dispositivos móviles!)

6. Tiempos de carga lentos

Ya sabes que es importante tener un sitio web rápido, pero en dispositivos móviles es aún más importante.

La gente realmente percibe los tiempos de carga como más lentos en dispositivos móviles, pero al mismo tiempo, esperan que los sitios se carguen más rápido en dispositivos móviles que en sus computadoras de escritorio. Si solo tarda unos segundos en cargarse, sus visitantes impacientes harán clic y encontrarán un sitio de carga más rápida para ayudarlos.

Vea estas formas sencillas de acelerar WordPress y considere usar también un plugin de almacenamiento en caché.

Cómo probar su sitio para una completa compatibilidad con dispositivos móviles

Por supuesto, es fácil navegar a su sitio con su propio teléfono inteligente o tableta para probar todas sus funciones, pero probablemente no posea todos los tamaños de pantalla posibles.

Para probar cómo se ve y funciona su sitio en una variedad de dispositivos, puede usar una herramienta como:

• Prueba de optimización para dispositivos móviles de Google: La prueba de Google analizará rápidamente su sitio en solo unos segundos y le informará sobre cualquier problema. También puede utilizar el Herramienta de usabilidad móvil en la Consola de búsqueda de Google (anteriormente Herramientas para webmasters).
• Screenfly le permite ver cómo se ve su sitio en una tonelada de diferentes tamaños de pantalla, incluidas tabletas, Kindles, teléfonos inteligentes e incluso televisores.
• MobileTest.me emula el aspecto de su sitio web en una variedad de diferentes marcas de teléfonos inteligentes y tabletas. En lugar de simplemente mostrar una imagen, en realidad carga su sitio como se cargaría en ese dispositivo y le permite interactuar con él, perfecto para probar ventanas emergentes, formularios, etc.

Terminando

El tráfico móvil es enorme, especialmente para los sitios B2C, por lo que es más importante que nunca asegurarse de que su sitio esté bien optimizado.

La experiencia del usuario es muy importante, por lo que mantener una experiencia positiva garantizará que las personas sigan volviendo a su sitio web.