Hasta el momento, el paradigma del diseño web, es desarrollar un sitio para escritorio y compatible con dispositivos móviles. Descartando los casos en que se ha optado por URL independientes (m.dominio.com), para los desarrolladores y webmasters, la llegada del diseño adaptativo o responsive design, fue en su momento una solución rápida para salir del paso y sacarse de encima un problema: Cumplir con la compatibilidad con dispositivos móviles requerida por Google
Sin embargo ese tipo de diseño ha quedado como norma establecida, de hecho todas las plantillas que se ofrecen gratis y de pago en la web, son “responsive design”. Incluso Google lo recomienda.
¿Es responsive design la solución ideal para compatibilidad con smartphones y tablets?
Parece una solución, pero es solo el principio de los problemas, la realidad es que solo un escaso porcentaje de plantillas se comporta satisfactoriamente en todos los dispositivos. Me refiero la experiencia del usuario y puntualmente a la velocidad de descarga en un dispositivo móvil.
La razón es simple: Una plantilla adaptativa, está pensada para un monitor de escritorio y como complemento, se adapta a una tablet o un smartphone. Pero una conexión domiciliaria es aceptable a partir de los 12 Mbps, mientras que 3G con suerte puedes navegar en promedio a 1 Mbps
De tal modo que los mismos recursos de esa plantilla, necesariamente demoran mucho más tiempo en cargar en un dispositivo móvil.
Si un usuario visita una de tus páginas y debe esperar más de 3 segundos a que se cargue en su dispositivo, la abandona antes de ese tiempo y seguramente no vuelve…
Ya has visto que partir de la indexación centrada en móviles, la velocidad de carga es un factor de clasificación, es decir que los robots rastreadores de Google no valoran positivamente una página lenta.
Ya sé… me vas a decir que con las redes 4G las velocidades máximas de transmisión de datos andan por los 100 mb y hasta 1gb
Pero la herramienta PagSpeed Insights indica una valoración basada en 3G , y Google toma esa métrica como factor de clasificación
Por eso en la práctica, la carga de la página en tu dispositivo 4G está dentro de valores aceptables, pero la herramienta insiste que es lenta.
Cambiando el paradigma del desarrollo web
Que pasa si “cambiamos el chip” y diseñamos sitios web pensados para móviles, pero también compatibles con dispositivos de escritorio. El primer boceto del sitio lo deberíamos hacer sobre un móvil y luego pensar en el monitor de una PC
Es muy común encontrar sitios web donde más del 75% de las visitas llegan desde smartphones. En ese escenario no queda otra alternativa que pensar el desarrollo sobre un dispositivo móvil y luego en segundo plano, la compatibilidad con escritorio.
Pero vamos a dar otro paso siguiendo esta lógica… ¿que te impide desarrollar tu sitio web solo con AMP tanto desktop como móvil? porque no sé si te diste cuenta que AMP también es responsive, pero mucho mas veloz… Algunos llaman a ese concepto AMP first, yo prefiero Full-AMP, porque propone un solo sitio (AMP), para todos los dispositivos y garantiza una excelente velocidad de carga en todos ellos.
¿Eso significa que debo tirar a la basura todo lo que sabía hasta ahora de diseño web?
Afortunadamente no, pero tampoco es una tragedia. Ya sé que te la estoy complicando cada vez más pero no te alteres, siempre hay recursos para echar mano, veamos:
- Diseño propietario: Si te gusta desarrollar tus sitios desde cero, y no quieres un nuevo período de aprendizaje con AMP, te entiendo… ¿ahora otra vez a “melonear”?.
Claro que no, aquí tienes la solución con AMP Creator, una herramienta en línea que te permite convertir tus páginas html a la versión AMP y desarrollar un sitio alternativo en ese protocolo. Además puedes crear páginas AMP desde cero, con su editor visual sin tener ningún conocimiento de programación. - Gestor de contenidos (CMS): Pero si eres práctico como yo, y hace tiempo que desarrollas todos tus proyectos en WordPress, entonces Felicidades no tiras nada a la basura!!. El plugin AMP for WordPress te permite trabajar exclusivamente sobre ese protocolo, utilizando su propio editor independiente, incluso puedes dejar de lado el nuevo editor Gutenberg de WordPress. El plugin suma en cada actualización, más plantillas elegantes para elegir, gratis o de pago.
Una vez que lo has instalado, activas AMP Take over en configuración general, Y de esa forma la versión AMP quedará activa también para escritorio. OK, es una versión Beta, pero qué puede ocurrir para que no se convierta en definitiva?
Espera… Accelerated Mobile Pages tiene limitaciones en cuanto a diseño, no se pueden incluir animaciones, slides, presentaciones, etc.
Veamos: Si voy caminando con mi smartphone buscando un restaurante, o deseo comprar un producto online, lo necesito ya!!, no tengo tiempo para perder en animaciones y efectos visuales, sencillamente porque tengo que prestar atención por dónde camino!!
Ademas, mi móvil no tiene una pantalla de más de 17 pulgadas para que se aprecien correctamente.
Las animaciones, popup y otras hierbas, no te garantizan el éxito de una página web.
¿Que te impide desarrollar tu sitio web solo con #AMP tanto desktop como móvil?, porque no sé si te diste cuenta que AMP también es responsive. Clic para tuitear¿Puedo usar AMP con Woocommerce?
Claro que si!! la plataforma de e-commerce mas utilizada tiene su alternativa AMP. Los mismos creadores del plugin tambien han desarrollado AMP WooCommerce. Un complemento que genera una interface AMP con la estructura y los productos de la tienda del plugin original.
La ventaja de usar AMP en una tienda online es obvia, cuando un cliente está dispuesto a comprar debe ser en ese instante, si la página del producto se demora demasiado en cargar en la pantalla de su móvil, la intención de compra baja hasta desaparecer.
En cambio, si carga instantáneamente no le das tiempo a pensar y concreta la operación.
Conclusiones
- El crecimiento del número de usuarios móviles, quienes buscan agilidad y rapidez, se incrementa año tras año.
- Google por su parte premia a las páginas que cargan velozmente.
- Accelerated Mobile Pages, te permite alcanzar ese objetivo.
- Full-AMP, (aka AMP First), propone utilizar ese protocolo como única versión del sitio, para todos los dispositivos. https://amp.dev es un ejemplo de ello
¿Podemos suponer que en un futuro se oficialice el protocolo AMP en reemplazo del estándar html actual?…. Piénsalo!!
Muy de acuerdo con el artículo, es lo más lógico se me había ocurrido lo mismo desde el momento en que supe de AMP html, La idea es ir al grano, satisfacer las necesidades del usuario de manera rápida y sencilla, posteriormente se puede pensar en la espectacularidad sin afectar lo más importante el requerimiento principal del usuario.
Gracias por tu comentario.
Salu2
todo un tema… prácticamente vamos a empezar a ver paginas con cero diseño, como nos vienen ofreciendo todos los seudo “diseñadores wordpress” que solo usan un Drag-and-Drop, algun elementor, divi o simil y el 90% tiene cero conocimientos de estética y diseño (y así quedan las páginas también) salvo algunas excepciones de agencias o desarrolladores que cuentan con un gráfico en sus filas o algún diseñador web mas completo (o mejor dicho un diseñador web!).. en fin, debería ser todo lo contrario a mas tecnología y mejores conexiones deberíamos poder ver cosas mejores en un móvil y no al revés… simplifican todo sin necesidad… google nos quiere obligar a prácticamente vivir todo en segundos… no esperar.. no disfrutar ni dar tiempo a plasmar nada… aparte eso de “el usuario espera 3 seg y se va” es una falacia… una si quiere ver algo puede esperar 4 segundos… tampoco es tanto tiempo… eso lo dijo algún loquito de internet de esos que no salen nunca de casa y se multiplico en la red y ahí quedo… no sean tan exagerados…
Hola Paul
Interesante tu punto de vista, pero creo que no es Google el que quiere todo en segundos, es el usuario que no puede esperar a que se cargue una página en su móvil. Me he tomado el trabajo de seguir las métricas en Analytics de una página web con problemas de carga, y el incremento en la tasa de rebote en móviles, es muy evidente.
El uso de AMP no implica necesariamente una limitación en el diseño, hay aplicaciones de maquetado disponibles para ese protocolo, qué logran excelentes resultados.
Tampoco lo veo como una falacia el hecho que el usuario no quiere esperar 3 seg, personalmente me molesta cuando demora la carga de una página, como también me molestan los popups y anuncios que tapan toda la pantalla de mi smarphone.
OK, me puedes decir que son estudios hechos por Google, con herramientas y estadísticas de Google, pero todos vivimos del buscador y queremos que nuestras páginas y la de nuestros clientes, se vean beneficiadas en el ranking desde todos los dispositivos.
Agradezco tu opinión
Salu2