En digitalDot, tras el nombramiento en 2019 como primera empresa en España avalada por Google para el desarrollo de PWA (Aplicación Web Progresiva), seguimos trabajando y apostando por este tipo de concepto que consistía, básicamente, en crear un diseño web adaptado para una usabilidad móvil con recursos y servicios en Background (segundo plano) que permitieran aprovechar las funcionalidades de nuestro móvil.
Ahora bien, esto ha ido evolucionando, y ya no solo debemos “pensar” una PWA para móviles, porque, con la llegada del navegador Edge, por parte de Microsoft, las aplicaciones progresivas llegarán a nuestro ordenador, permitiendo, entre otras cosas, la creación de iconos.
En Mac ya era posible gracias a su opción de anclar en Safari.
¿Qué novedades encontramos en las PWA en 2020?
La evolución ha permitido que ya no solo tengamos nuestra solicitud de instalación en el navegador sino que tiendas oficiales de aplicaciones, como Apple, Microsoft, Samsung y por supuesto Android Play Store te permiten que aparezca tu PWA como aplicación instalable, ¡¡una gran ventaja para SEO, imagen de marca y diferenciación no creéis!!
Funcionalidades ya implementadas sobre PWA
WebAssembly
WebRTC
WebPush
WebAuthn
WebShare
WebXR
RequestPayment
Una de las novedades que más nos ha gustado es el uso de la huella dactilar como forma de validación, esto puede ser un gran avance para las aplicaciones progresivas ya que intranet y tiendas online automatizarán el proceso de login o registro con tan solo un único movimiento de dedo.
¿Qué sistemas operativos puede soportar nuestra PWA?
Pues aquí prácticamente todos han decidido apoyar a las aplicaciones web, algunos más actualizados que otros, unos con más visión de futuro y adaptabilidad, y un gran diferenciador como la disponibilidad de aprovechamiento de hardware, todo ello marcado evidentemente por el uso de políticas internas de las empresas que lo desarrollan.
Android
iOS
iPad-OS
Windows 10
Windows 7
Windows 8
Xbox One
macOS
Linux 64 bits
Chrome OS
kaiOS
Los grandes alejados de estas funcionalidades han sido los televisores, y relojes con su Wear OS, así como los vehículos con su Android Car o IOS que no han apostado o al menos de momento por la tecnología PWA.
Entre los soportes con Android podremos disfrutar de nuestra PWA a través de la instalación desde el navegador en:
1. Chrome (WebAPK)
2. Firefox
3. Samsung Internet (WebAPK solo en dispositivos Samsung)
4. Y Android, como diferenciador, sigue siendo la única plataforma que admite los tres modos de "aplicación" en la especificación del Manifest:
Standalone
Minimal
Fullscreen
Como veremos más adelante, tendremos el aporte de plugins que permitirán distribuir la PWA más fácilmente, para ello podemos aprovechar el uso de las tiendas oficiales.
Desde Google Play Store podremos crear una aplicación de Android con al menos una actividad web confiable (TWA)
Samsung Galaxy Store enviando la URL a una dirección de correo electrónico que utilizará el servicio WebAPK Samsung.
Amazon App Store tiene una forma de publicar aplicaciones web también para tabletas Amazon Fire, aunque algo limitada y desactualizada con poco soporte.
Respecto a iOS, OS 13 e iPad-OS 13 es la versión elegida por Apple para hacer una verdadera apuesta en las PWA mejorando la experiencia del usuario y acercando funcionalidades.
Como no todos somos perfectos existen aún algunos errores aún sin solucionar, por ejemplo:
Los problemas derivados del uso de las API de WebRTC para abrir la cámara, para la captura de datos, recientemente estuvimos inmersos en un proyecto de este tipo y esperamos que Apple pueda aportar pronto una solución
O como, en sistemas iOS que podemos contar con instalación mediante navegador Safari 11 o superior, o bien mediante archivos distribuidos empresarialmente, pero que, de momento, Apple no está por la labor de publicar en su Apple store pwa.
Por último diremos que, el sistema Windows, como ha venido haciendo a lo largo de su historia siempre ha buscado la compatibilidad, y por ello, ha permitido la instalación de PWA a través de navegadores como Chrome, Edge y Firefox y posibilidad de distribución en tiendas oficiales. Tal es así que veremos más adelante una propia herramienta de Microsoft para la compilación de PWA.
¿Cómo publicar una PWA con Apple?
Tendremos que hacer uso del Apple Configurator 2, puede crear un icono de pantalla similar a la PWA e incrustar una URL y firmar el archivo de configuración.
Pero debemos tener en cuenta que Apple no apuesta por este tipo de PWA y que, como ya publicó en 2019, su tienda no pretende la publicación de aplicaciones html5 con actualizaciones por JavaScript.
Por lo que la única salida debe seguir siendo los iframe o webview como lo reconoce IOS.
¿Cómo publicar una PWA en Play Store?
Google Play Store con Chrome ha comenzado la aceptación de PWA, y permitirá procesar la aplicación desde la tienda compartiendo datos como la información de la app y las cookies de navegación gracias a Trusted Web Activities.
Con la adaptación de la librería de pestañas personalizadas podremos no solo publicar nuestra PWA en la tienda oficial sino elegir con que motor queremos que se ejecute.
¿Cómo publicar una PWA en Samsung?
Aquí parece que Samsung se ha querido complicar poco, y solo con enviar un email a la dirección pwasupport@samsung.com, podremos pasar su proceso de validación y aparecer en su tienda online.
¿Cuál es el futuro de las PWA?
Chromium ha sacado este 2020 el proyecto Fugu donde pretende llevar a la API de las PWA funcionalidades como:
Contacto
WebNFC
Aplicaciones con pestañas, entre otras funcionalidades
Otras diferencias para este 2020 son la aparición y la concienciación de las PWA para el ahorro y cuidado del medioambiente con su funcionalidad de Modo Oscuro, aunque podemos implementar fácilmente un cambio de estilos, el Manifest no permite este tipo de asignación de iconos diferenciales.
Un punto a tener en cuenta en el diseño Web para PWA es el uso de diseño para móviles plegables una nueva evolución de hardware, que nos diferencia de lo que antes teníamos en cuenta como distintas pulgadas para la resolución de una aplicación web, deberemos ahora poder detectar los posibles cierres y aperturas de la pantalla.
Apple apadrinando el proyecto WebKit, está más centrado en la privacidad de navegación y seguridad, dejando un poco de lado funcionalidades que ya están implementadas en Firefox, por ejemplo, el uso de WebPush o la ejecución en segundo plano para PWA.
¿Qué software destacaríamos para desarrollar PWA?
Maskable.app
Tools for Progressive Web Apps
PWA2APK
Lighthouse
Con pwa2apk, ya no necesitaremos Android Studio para generar nuestro apk y poder generar una subida a la tienda oficial de Play Store, con esta página online podremos lanzar y precompilar todo lo necesario.
Os dejamos el enlace para convertir tu PWA en apk: Appmaker
Microsoft también ha creado su PWA Builder de Microsoft, una herramienta similar a PWA2APK que podremos obtener en el siguiente enlace: Pwabuilder.
Con ella, podremos ver cómo hace un análisis s de nuestro Manifest, puntos de seguridad y el Service Worker para posteriormente generar nuestra compilación de APP para cada uno de los entornos MAC, Windows, Android e incluso Samsung.
Una de las evoluciones es la mejora en iconografía por parte de las PWA como los iconos enmascarables. Con Maskable.app podremos generar un icono que se adapte y permitir que esté centrado dentro de la PWA
Lighthouse, seguirá siendo una de las herramientas por excelencia para validar nuestras aplicaciones PWA, pero ahora con opción de poder analizar el icono para IOS que es diferente al que estábamos generado para Android/Chrome.
¿Podría tener la PWA un aporte de SEO?
Evidentemente sí. Nuestra Aplicación Web Progresiva aparecerá en portales de tiendas oficiales como PlayStore, Apple Store, Samsung o Windows Store.
Esperamos que este articulo puede aportar algo más de visión de lo que Apple reconoce como aplicaciones html 5 o aplicaciones en pantallas de inicio, desde digitalDot nos seguiremos acercando a las PWA, donde el móvil es el rey de los dispositivos.
DigitalDot Servicios Informáticos, S.L. utiliza cookies propias y de terceros para mejorar nuestros servicios y mostrarte publicidad relacionada con sus preferencias mediante el análisis de tus hábitos de navegación. Puedes aceptarlas con el botón "Aceptar", rechazarlas en el botón "Rechazar" o configurarlas con el botón "Gestionar preferencias". Puedes consultar más información detallada sobre las cookies utilizadas en este sitio web desde nuestra política de cookies.
Funcional
Siempre activo
Las cookies funcionales son absolutamente imprescindibles para que el sitio web funcione correctamente. Estas cookies garantizan las funcionalidades básicas y las características de seguridad del sitio web, de forma anónima.
Preferencias
El almacenamiento o acceso técnico es necesario para la finalidad legítima de almacenar preferencias no solicitadas por el abonado o usuario.
Estadísticas
El almacenamiento o acceso técnico que es utilizado exclusivamente con fines estadísticos.Las cookies estadísticas se utilizan para entender cómo interactúan los visitantes con el sitio web. Estas cookies ayudan a proporcionar información sobre las métricas del número de visitantes, la tasa de rebote, la fuente de tráfico, etc.
Marketing
Las cookies de marketing son necesarias para crear perfiles de usuario para enviar y personalizar publicidad, o para rastrear al usuario en una web o en varias web con fines de marketing similares.