Diseño móvil primero: qué es y por qué es importante

El otoño de 2018 fue un período difícil para los especialistas en marketing en línea, los blogueros, las agencias digitales… básicamente para todos aquellos cuyo pan y mantequilla provienen del ámbito en línea. ¿Por qué? Porque fue entonces cuando el gigante de los motores de búsqueda, Google, comenzó a implementar su indexación móvil primero. Esto ciertamente no fue una sorpresa ya que el "Mobilegeddon" en 2015 ya introdujo la priorización de sitios web que se muestran bien en dispositivos móviles. El diseño móvil primero ya era algo, pero Google aún logró causar algo de pánico.

Pero demos un paso atrás por un momento y veamos qué significa realmente "móvil primero".

Explicación del diseño móvil primero

En resumen, el diseño móvil primero es el tipo de diseño que prioriza los dispositivos móviles. En general, esto incluye teléfonos inteligentes y tabletas o cualquier dispositivo con una pantalla más pequeña. Para entender este concepto correctamente, primero debemos hablar sobre el diseño web receptivo o RWB. En RWB, básicamente permitimos que la web y todas sus formas y contenidos se ajusten a pantallas más pequeñas sin perder calidad. También debe hacerse de una manera que las personas encuentren conveniente o cómoda. Cuando se hace correctamente, el diseño receptivo significa que el usuario no tiene que acercar, desplazarse o desplazar la pantalla para ver todo el contenido del sitio.

Obviamente, con el grado en que las búsquedas móviles han superado a las de escritorio, es natural que un sitio web responda. Ni siquiera es una cuestión de supervivencia del más apto. Es más simple que eso. Si su sitio web no responde, es mejor que no exista. La gente no tiene el tiempo ni la paciencia para los sitios web que no responden.

Pero hay más aquí que solo capacidad de respuesta. Al desarrollar un producto, los diseñadores solían tomar la versión de escritorio como punto de partida. Luego, después de finalizar esa versión en particular, básicamente eliminaron ciertos elementos para optimizar el producto para dispositivos móviles.

Hoy en día, el proceso es diferente. El “avance progresivo" es un principio ampliamente empleado en el diseño, que toma la versión móvil como punto de partida. Y eso es exactamente lo que significa "móvil primero". El diseño comienza desde el extremo móvil y luego se expande gradualmente a versiones más avanzadas.

Indexación móvil primero

Como mencionamos anteriormente, en 2018 Google inició una nueva forma de indexar los sitios. La indexación es importante porque es uno de los mecanismos que usa Google para decidir qué tan alto se ubicará su sitio web en las páginas de resultados del motor de búsqueda.

Entonces, básicamente, la indexación móvil primero significa que cuando Google implementa sus robots de rastreo, primero buscarán la versión móvil de su sitio y luego la de escritorio. Tenga en cuenta que la versión móvil no es la única que se indexa y clasifica. Su versión de escritorio también se tiene en cuenta, pero solo después de la versión móvil. Si su sitio web no tiene una versión móvil, tendrá un impacto negativo significativo en el ranking de su sitio web. No solo eso. La calidad de la experiencia móvil que ofrece su sitio web también es un factor.

Y es por eso que cualquier propietario de un sitio web debe tomar muy, muy en serio la prioridad de los dispositivos móviles.

Cómo optimizar para dispositivos móviles primero

Entonces, ¿tienes un tema receptivo genial? Bien. La capacidad de respuesta es extremadamente importante. Pero no crea ni por un segundo que su trabajo de optimización para dispositivos móviles primero termina ahí. Es más complicado que eso.

Ya sea que esté limpiando su antiguo sitio de WordPress o esté creando uno nuevo, hay cosas que puede hacer para que sea más atractivo para los rastreadores de Google y la indexación móvil primero.

• Optimice la velocidad de su sitio web

Google odia los sitios web lentos. No realmente. Tiene un sesgo particular hacia los sitios web que tardan en cargar. Desde el verano de 2018, Google prioriza oficialmente los sitios web rápidos, por lo que definitivamente es algo en lo que pensar.

Incluso si su sitio web es un poco lento, no se preocupe. Hay muchas cosas que puedes hacer para acelerarlo. Por ejemplo, puede usar uno de los excelentes complementos de almacenamiento en caché que crean una versión de su sitio lista para HTML para que se cargue más rápido. También puede comprimir todos sus archivos para que se carguen en el tamaño más bajo y liviano posible. Finalmente, tómese un tiempo para revisar su sitio web y buscar errores técnicos, como enlaces rotos, páginas demasiado saturadas, etc.

Cuando se trata de optimización de motores de búsqueda (SEO), suponiendo que ya esté aplicando todas las mejores prácticas en el campo, hay un par de cosas adicionales que debe tener en cuenta.

Por un lado, debe garantizar la paridad en el contenido entre las versiones de su sitio. Esto se aplica particularmente a enlaces internos, datos estructurados, etiquetas y demás. Además, asegúrese de que sus servidores puedan manejar la tasa de rastreo. Esto solía ser un problema cuando se implementó por primera vez la indexación móvil, pero una cantidad sorprendente de sitios web aún no se ha adaptado a la nueva actividad de rastreo.

Finalmente, controle su estado de indexación regularmente y asegúrese de que robots.txt esté validado y que los archivos de registro de su servidor estén en orden.

• Optar por un marco receptivo

Sí, dijimos anteriormente que usar un tema receptivo, creado en un marco receptivo, no es suficiente para una primera optimización móvil adecuada. Pero sigue siendo uno de los factores esenciales, por lo que pensamos que deberíamos reiterarlo.

Bootstrap y Foundation son actualmente los marcos de trabajo más populares y posiblemente los mejores, así que opta por un tema que use uno de ellos. Son ideales para traducir el diseño de su sitio web a pantallas más pequeñas con un riesgo mínimo de fallos y errores. Además, lo hacen tanto en el front-end como en el back-end, por lo que reducen considerablemente la carga de trabajo del desarrollador.

• Optimice su navegación, contenido e interacción

Encontrar el equilibrio perfecto entre la falta de contenido y el exceso de contenido es el problema común de todos los sitios web móviles. Sin embargo, es una batalla que debemos seguir peleando. Los visitantes necesitan información y necesitan que se presente de forma clara y sencilla. El desorden es inaceptable. Organice su contenido para que pueda decir lo que tiene que decir, crear estrategias para sus llamados a la acción y nada más.

Además, considere la navegación de su sitio web. Si es demasiado complicado, simplemente no funcionará para dispositivos móviles.

A continuación, si su barra de navegación en el escritorio es larga, debe hacerla mucho más corta en su versión móvil. Considere agrandar su texto y transformar sus enlaces en botones que sean fáciles de tocar.

Finalmente, vea si sus diseños están optimizados correctamente para acciones manuales comunes, como tocar y deslizar.

Este es un paso bastante lógico, pero no está de más recalcarlo una vez más. Siempre necesita verificar y probar todo en su sitio. Incluso si no ha realizado ningún cambio recientemente, considere hacer una prueba ocasional solo para ver si todo funciona bien.

La mayoría de las personas en estos días usan navegadores modernos o navegadores optimizados para dispositivos móviles. Sin embargo, un porcentaje asombroso de usuarios de Internet todavía usa versiones anteriores de navegadores, y también debe pensar en ellos. Desea que su sitio web se vea tan bien en un viejo iPhone 4s como en el nuevo Huawei P20.

Simplemente pruebe la capacidad de respuesta del diseño de su sitio web y no olvide las pruebas divididas A/B, especialmente para sus páginas de destino. Eso sí, antes que nada, personaliza la versión móvil de tu sitio, y prepáralo para los usuarios.

Mobile-first es una tendencia que se mantendrá por un tiempo, y esa es la realidad que todos tenemos que aceptar. Por "nosotros" nos referimos a todos los involucrados en la creación y ejecución de un sitio web. Diseñadores, desarrolladores, administradores, expertos en SEO, editores, redactores: todos deben recordar priorizar el dispositivo móvil. Por supuesto, eso no quiere decir que debamos descuidar las versiones de escritorio. Es solo que el diseño móvil primero debe tomarse en serio.

Esperamos que este artículo le haya resultado útil. Si te ha gustado, ¡no dudes en consultar algunos de estos artículos también!