Sin duda ha oído hablar de la próxima ola de la web móvil. Lo más común que probablemente haya escuchado es que el acceso a la web móvil está aumentando rápidamente, y aproximadamente la mitad de todo el tráfico web ahora se realiza a través del teléfono o tableta. UNA Informe 2018 de febrero del Centro de Investigación Pew tenga en cuenta que 95% de todos los estadounidenses posee un teléfono celular, mientras que la proporción de estadounidenses con teléfonos inteligentes es 77%.
No tiene que ir muy lejos para ver el impacto de los dispositivos móviles. Observe su propio comportamiento y el de su familia. En diciembre de 2016, comScore informó que el estadounidense promedio mayor de 17 años pasa dos horas y 51 minutos al día en su teléfono (Englais).
Statcounter.com señala que el tráfico web global proviene principalmente de dispositivos móviles durante al menos un año (51,95% en febrero 2018).
Si bien puede pensar que no puede permitirse desarrollar una aplicación nativa para que los usuarios móviles la almacenen en sus teléfonos, existe una excelente alternativa disponible para todas las empresas: las aplicaciones web progresivas. Tal vez haya oído hablar de las aplicaciones web progresivas (PWA) y cómo las personas las utilizan para hacer crecer sus negocios. En este artículo, aprenderá un poco más sobre las PWA y por qué debería pensar más en su uso en 2018.
Algunas definiciones
Las aplicaciones web progresivas (PWA) son una colección de estándares web desarrollados originalmente por Google para mejorar el rendimiento del sitio web en dispositivos móviles. Como resultado, los sitios web funcionan más como aplicaciones móviles dedicadas que puede encontrar en la App Store de Apple o en Google Play.
Otra definición desarrolladores de la cadena hotelera india Treebo: “Las PWA son aplicaciones de una sola página que se mejoran gradualmente con características que brindan una experiencia nativa más inmersiva. »
Reduciendo eso un poco, las PWA en dispositivos móviles permiten a sus lectores y clientes cargar rápidamente la página de inicio de su sitio y usar muchas de las mismas funciones en el dispositivo móvil que usaría una aplicación nativa. Su sitio puede existir fuera del navegador, incluso cuando el dispositivo no está conectado a Internet.
Otras definiciones
Algunas de las partes técnicas clave de una PWA incluyen:
Trabajadores de servicios son la tecnología clave asociada con las PWA. Estos permiten que las PWA operen fuera de la red.
Archivos de manifiesto contener el icono y el nombre que vincula la aplicación en el dispositivo con el Sitio web. El desarrollador también puede agregar elementos de diseño aquí para mejorar la experiencia del cliente.
Notificaciones push comuníquese con sus usuarios (con su permiso), para que regresen.
Algunas razones
Entonces, ¿por qué su sitio debería incluir una PWA? Es bastante sencillo.
Mejor rendimiento, ¡incluso en el escritorio!
Sabes que tienes un tiempo limitado para ganar un visitante por primera vez: seis segundos de carga antes de que un cliente potencial se vaya y visite el siguiente sitio en los resultados de búsqueda. Los usuarios de dispositivos móviles son aún más impacientes: ¡la mitad de sus usuarios potenciales se marcharán si un sitio tarda más de 3 segundos en cargarse!
Buenas noticias: los cambios que realice para crear una aplicación web progresiva acelerarán su sitio.
Ejemplo: la empresa hotelera india Treebo redujo el tiempo de carga de su dispositivo móvil de seis segundos a 1,5 segundos al crear su PWA. ¡El sitio ahora se carga en el escritorio en un segundo! Su equipo técnico informó que la clasificación de búsqueda del sitio ha mejorado y la tasa de conversión mensual se ha más que duplicado.
Capacidad fuera de línea
PWA no necesita estar en Internet para hacerlo. Sus usuarios pueden acceder a todo el contenido de la aplicación desde su dispositivo o escritorio.
De hecho, una de las mejores cosas de una PWA es que su cliente puede guardar el sitio en la página de inicio de su dispositivo y usarlo más tarde para comprar su producto u obtener más información. .
Por ejemplo, CNET Tech Today ofrece un resumen diario de las noticias relacionadas con la tecnología que es el pan de cada día del sitio. Si abre el sitio con Google Chrome en un dispositivo Android y se desplaza hacia abajo hasta la parte inferior de la pantalla, verá esto:
Prensa Añadir a la pantalla principal para descargar la aplicación web progresiva Tech Today en su dispositivo. Toque el icono para cargar las 10 mejores historias actuales. Desliza el dedo hacia la izquierda para leer cada historia. Toque el logotipo de CNET para abrir la página de inicio de CNET en su navegador.
Observación : En Firefox, los sitios con PWA tienen un ícono "Agregar a la página de inicio" (un signo más en un cuadro pequeño) directamente en la barra de direcciones. Si la PWA ya está instalada, el logotipo de Android en la barra de direcciones lo llevará a la PWA.
Una cosa que su sitio no necesita: los widgets "Descargar nuestra aplicación" ocupan espacio en su página (generalmente con los logotipos de iTunes y Android que distraen a los usuarios). Si Chrome nota que un usuario ha abierto su sitio de PWA varias veces a la semana, le solicita que agregue su PWA. Las actualizaciones también son automáticas.
Sin necesidad de lenguajes de programación complejos
Es posible que haya considerado crear una aplicación móvil nativa para su empresa, pero se dio cuenta de que crear una aplicación móvil es algo diferente a crear una Sitio web. Si está trabajando con una agencia de diseño/desarrollo web para mantener su sitio, no necesariamente tendrán las habilidades para crear una aplicación para los principales proveedores de dispositivos móviles.
Para que su software aparezca en la App Store de Apple, sus desarrolladores deben registrarse en la Red de desarrolladores de Apple, usar la Herramienta de desarrollo de Apple (que funciona solo en Mac) y conocer un idioma de Programación aprobada por Apple: Swift u Objective C.
La programación para Android es un poco más fácil (no se requiere la aprobación del desarrollador), pero la gran mayoría de las aplicaciones de Android están escritas en Java, que puede ser un lenguaje difícil de aprender.
Para que la aplicación aparezca en las tiendas en línea de Apple o Android, la aplicación completa debe obtener la aprobación de los custodios de la tienda correspondiente.
Por el contrario, las aplicaciones web progresivas se crean utilizando lenguajes web populares: HTML, CSS (hojas de estilo en cascada) y JavaScript. En resumen, incluso los desarrolladores web novatos pueden crear PWA de alta calidad.
Específicamente, no necesita mucha educación informática para hacer una PWA para su sitio de WordPress. Si ya ha cambiado el formato de su sitio con un tema secundario, también puede crear un archivo PWA. Cubriremos los problemas de codificación en otro artículo.
Aumentar el apoyo de los gigantes de la tecnología.
Los estándares tardan mucho en convertirse en estándares. Google promovió las PWA por primera vez en 2015.
Durante mucho tiempo, Chrome fue el único navegador compatible con PWA, pero eso está a punto de cambiar. En meses recientes:
- Mozilla ha agregado soporte PWA en Firefox 58
- Apple anunció recientemente soporte para aplicaciones web en iOS
- Microsoft admitirá PWA en la próxima versión de Windows 10, que estará disponible a finales de este año (2018).
Yendo más lejos que otros proveedores de sistemas operativos, Microsoft ha dicho que los PWA de "alta calidad" pronto se integrarán en la tienda de aplicaciones de Windows 10 en móviles y computadoras de escritorio.
WordPress y PWAs
WordPress aún no es totalmente compatible con la creación de aplicaciones web progresivas en la aplicación base. El equipo de Jetpack se compromete a agregar la funcionalidad PWA el próximo año. Esto es ayudado por la Javascript-ificación de WordPress.
Jetpack "presenta gradualmente las funciones de PWA tan pronto como están listas", dice el desarrollador Dan Walmsley en un artículo en el blog VIP de WordPress . Los desarrolladores pueden agregar archivos de manifiesto utilizando el módulo de manifiesto de Jetpack desde la versión 5.6.0, y han introducido la carga de imágenes progresiva, lo que hace que el sitio se cargue más rápido incluso cuando hay muchas imágenes en él. la página. Más funciones vendrán este año.
Algunos complementos buscan agregar funcionalidad PWA, pero no se han adoptado en gran medida.
- La herramienta de optimización de WordPress proporciona una herramienta de trabajo y de manifiesto.
- Super Progressive Web Apps genera un manifiesto y un botón Agregar a la pantalla de inicio, entre otras características.
- El paquete móvil de WordPress también agrega características PWA
¿Cómo vas a usar el PWA?
En este tutorial aprendiste un poco sobre las aplicaciones web progresivas y por qué deberías agregar una en el Sitio web de su empresa:
- La creciente ola de tráfico de dispositivos móviles
- Mejor rendimiento para su sitio web: dispositivos móviles y de escritorio
- Disponibilidad incluso cuando el dispositivo está desconectado
- Utiliza funciones web estándar: HTML, CSS y Javascript. Más barato de construir
- Mayor soporte para navegadores y sistemas operativos
¿Quizás ahora quieras saber cómo hacer una PWA en WordPress? ¿O mostrar a sus desarrolladores cómo hacerlo? Este será el tema de otro tutorial.
