Cómo instalar una página web como aplicación web progresiva PWA – Tips


Cómo instalar una página web como aplicación web progresiva PWA 1

Cada vez usamos más servicios en línea. Gracias a las plataformas en la nube, podemos disponer de todos nuestros datos en cualquier parte del mundo, simplemente disponiendo de una conexión a Internet. Para que esto sea posible, las compañías se esfuerzan, no solo por disponer de aplicaciones potentes, sino de un acceso web que esté a la altura. Y, en este último punto, juegan un papel fundamental las PWA.

¿Qué es una aplicación web progresiva o PWA y para qué sirve?

Antes de mostrarte cómo instalar una aplicación progresiva según tu sistema operativo, te damos algunas pinceladas sobre lo que son exactamente. El término PWA proviene del término inglés progressive web application, que se traduce al español como aplicación web progresiva.

Una PWA es una aplicación completa a la cual se accede a través de un navegador. Por lo tanto, en realidad está desarrollada usando los estándares web actuales, como HTML, CSS o JavaScript. Sin embargo, tiene una serie de características que la acercan más a una aplicación nativa que a un sitio web convencional:

  • Puede funcionar sin conexión. Pese a tener forma de una web, las aplicaciones web progresivas son capaces de funcionar de forma completa sin necesidad de estar conectado a Internet.
  • Tiene notificaciones push. Gracias a esto, un usuario puede saber si han llegado correos electrónicos nuevos a su bandeja de entrada o si hay actualizaciones en su red social favorita. Aunque las notificaciones funcionan incluso cuando la aplicación no está abierta, es necesario que el navegador corra en segundo plano.
  • Tiene acceso al hardware del equipo. Por lo tanto, son capaces de controlar la cámara, la geolocalización y el acelerómetro. Esto brinda una experiencia muy similar a la de las aplicaciones nativas.
  • Usan una interfaz adaptada a cada sistema. En equipos de escritorio se adaptan para ser utilizadas con ratón y teclado. Además, se ejecutan en su propia ventana. En los dispositivos móviles, son compatibles con la entrada táctil.

Queda claro, después de este repaso, que las aplicaciones web progresivas son ideales para disfrutar de cualquier servicio sin necesidad de instalar una aplicación completa y con un consumo de recursos menor.

Algunas de las plataformas más conocidas disponen de una PWA. Aquí tenés algunos ejemplos:

  • Facebook
  • Pinterest
  • AliExpress
  • Telegram
  • Google Maps
  • Google Photos
  • Trivago
  • Airbnb
  • Instagram

Cómo instalar una web como aplicación nativa en 2021

En vista de su utilidad, te contamos cómo puedes instalar cualquier aplicación PWA en tus diferentes dispositivos. En cada caso, te indicaremos qué navegador necesitás. Para elaborar esta guía, hemos utilizado la aplicación web progresiva de Telegram.

En Windows 10

Instala Telegram en Windows 10
Instalando una PWA en Windows 10 con Microsoft Edge.

En Windows 10 puedes usar Microsoft Edge o Google Chrome para instalar tus PWA favoritas. Sigue estos pasos:

  1. Accede a la aplicación PWA.
  2. En la barra de exploración, pincha el icono de instalación ubicado en el lateral derecho. También aparecerá un mensaje con el texto «Aplicación disponible».
  3. En el mensaje emergente, haz clic en Instalar.

Después de hacer esto, la aplicación se agregará al menú de inicio. Cada vez que la ejecutes, se abrirá en una ventana independiente. Acepta los permisos adicionales, como la recepción de notificaciones, para mejorar la experiencia.

¿Y qué sucede si el mensaje «Aplicación disponible» no aparece? En este caso, no te encuentras ante una aplicación web progresiva. Pero, de igual manera, puedes instalar la web como una aplicación dirigiéndote al menú principal del navegador y haciendo clic en Aplicaciones > Instalar este sitio como una aplicación. Ten en cuenta que, aunque se abrirá en su propia ventana, si el sitio no es una PWA, no podrás disfrutar de sus ventajas, como el uso sin conexión.

En macOS

PWA instalada en macos
Diferencia entre la app nativa y la aplicación PWA de Telegram en macOS.

En macOS la instalación de aplicaciones PWA se realiza de forma similar a la de Windows 10. Sin embargo, debes saber que necesitarás instalar Microsoft Edge o Google Chrome. Safari, de momento, no permite la instalación de aplicaciones web progresivas. Después de instalar alguno de estos navegadores, sigue los pasos que ya te mencionamos en el apartado anterior.

En el sistema operativo de Apple, las aplicaciones PWA se agregan al Launchpad, como puedes ver en la imagen que ilustra esta sección. Además, cuentan con algunos añadidos interesantes, como la capacidad de mostrar el número de mensajes o notificaciones sin leer. Por supuesto, las PWA pueden anclarse en el dock e incluso lanzarse al iniciar el sistema.

En Android

Para instalar una aplicación web en Android, debes utilizar Chrome. Si no dispones de este navegador, descárgalo desde la Google Play Store. Entonces, visita la aplicación web progresiva. Nosotros, seguiremos usando como ejemplo Telegram, pero puedes intentarlo con Google Maps, Instagram y muchas otras.

Abre el menú principal de Chrome y toca en Añadir a pantalla de inicio.

2 Añadir PWA al inicio
Añadir web a la pantalla de inicio.

Seguidamente, pulsa en Instalar para realizar la instalación.

3 Instalar PWA
Instalar una PWA desde Chrome en Android.

La web se habrá añadido a la pantalla de inicio en forma de aplicación. Al abrirla, verás que su interfaz se muestra a pantalla completa.

En iOS

Para terminar, te contamos cómo realizar este mismo proceso en dispositivos con iOS. Es válido tanto en el iPhone como en el iPad. Curiosamente, en este caso será necesario que utilices Safari. Ningún otro navegador puede ayudarte a instalar PWA en iOS. Después de visitar la aplicación web progresiva, pulsa en el botón de compartir.

5 botón de compartir
Botón para compartir en Safari.

En el menú emergente de opciones, toca en Añadir a la pantalla de inicio.

6 Añadir a la pantalla de inicio
Añadir página web a la pantalla de inicio.

Especifica el nombre que quieres darle a la aplicación. iOS permite personalizarlo a tu gusto. Cuando hayas terminado, toca en Añadir.

7 Añadir página
Añadir una PWA a inicio.

La aplicación web progresiva se habrá instalado correctamente en tu dispositivo. Su aspecto es idéntico al de cualquier otra aplicación y se ejecuta a pantalla completa, sin los elementos propios de la interfaz del navegador.

8 PWA instalada en iOS
La PWA de Telegram en un iPhone.

Si deseas desinstalarla, mantén pulsado su icono y selecciona la opción Eliminar marcador.






Publicado en TuExperto el
2021-05-03 06:41:40

Autor:
Edgar Otero

Visite el articulo en origen aqui

(Visited 4 times, 1 visits today)

Te podría interesar