Blog

Nuestro grupo de expertos en diferentes disciplinas, te actualizan sobre las tendencias y temas relevantes en Marketing Digital.

Manteniéndonos en la corriente de beneficios que JavaScript nos provee y cómo su evolución constante impulsa el avance de la web y el contenido que nuestros usuarios reciben mediante ella, hablemos un poco de Progressive Web Apps, una manera de mejorar la experiencia de los usuarios.

En esta ocasión no es JavaScript o algún otro lenguaje en particular quien impulsa la web, es el turno de los Navegadores Web, utilizando herramientas que hemos tenido a nuestra disposición por un tiempo ya, consolidándolas en un nuevo concepto, las Progressive Web Apps.

¿Qué es una Pogressive Web App y cómo funciona?

En términos simples una PWA (Progressive Web App) es la capacidad que posee una Aplicación Web/Sitio Web de ser consistente cuando se pierde conexión con el servidor, además de mejorar la experiencia de usuario.

¿Qué quiere decir esto?

Cuando navegas por un sitio web y al hacer click un enlace interno habiendo perdido conexión con internet vemos una pantalla de error o en el caso de Chrome el mini juego con el T-Rex.

Pues con las PWA’s se trata de remediar esto de dos maneras, mostrando una página para notificar al usuario que ha perdido conexión o mediante cache permitir que el usuario pueda seguir navegando o consumiendo parte del contenido del sitio web.

Pero el modo offline no es todo lo que se logra con PWA’s, ya que mediante el manejo de cache podemos mejorar los tiempos de carga de los usuarios después de su primer visita, lo que quiere decir que podemos disminuir el tiempo de carga así como el tiempo de respuesta a las interacciones del usuario.

Lo que hemos comentado hasta el momento cubre tanto entorno web en nuestras computadoras como en nuestros smartphones, pero hay más, porque no se les llama

Progressive Web “App’s” sin un motivo, la razón de ello es que tenemos la capacidad de hacer una implementación que se acerca a la experiencia nativa de una aplicación, similar a como agregamos sitios web a los bookmarks del navegador, podemos agregar nuestra PWA al Home del dispositivo móvil, cuando el usuario haga click en nuestro icono no abrirá una pestaña en el navegador por defecto, en su lugar se mostrara tal cual lo hacen el resto de aplicaciones, dando no solo la sensación sino la interactividad de estar usando una aplicación y esto sin la necesidad de instalarse en el dispositivo.

Progressive web apps (PWA)

Pros y Contras

Las Progressive Web Apps poseen tres características que las hacen destacar:

  • Confiables: Proveen carga rápida y disponibilidad offline en redes inestables.
  • Rapidez: Animaciones más fluidas, scrolling sin tirones y navegación impecable.
  • Enganche: Pueden ser lanzadas desde el Home de los smartphones, entre otras funcionalidades.

Hay algunos aspectos que debemos mantener en cuenta.

El primero es que no se trata de una aplicación nativa del dispositivo, por lo que existen limitaciones, principalmente la interacción con el hardware del dispositivo, ya que siendo web posee las mismas limitaciones actuales que cualquier sitio web.

Además no es soportado en todos los dispositivos móviles, estamos refiriéndonos a dispositivos con sistema operativo IOS, esto se debe a que Apple, más específicamente Safari no soporta esta implementación y pensar que con instalar otro navegador en el dispositivo corregiremos esto, es un error ya que por ejemplo el navegador Google Chrome no es más que una versión de Safari “camuflado” como Chrome.

Pero hay buenas noticias ya que Apple ya se encuentra investigando al respecto (PWA’s), de modo que en un futuro no muy lejano IOS contara con la posibilidad de implementar Progressive Web Apps.

Otro aspecto a tener en consideración es que es indispensable contar con HTTPS en nuestro servidor ya es un requisito para poder hacer uso de PWA’s para mantener código malicioso fuera de nuestro entorno.

Algunos ejemplos de Progressive Web Apps

Habiendo ya explicado en que consiste y como funciona una PWA, veamos algunos ejemplos que muy probablemente tú ya conoces, pero no sabías que podías utilizar de esta manera.

TWITTER MOBILE

Sin duda, uno de las PWA más llamativas y con más tráfico ahora mismo es el sitio web móvil de Twitter. – Twitter Mobile

WASHINGTON POST

Washington Post es un gran ejemplo de una agencia de noticias que usa Progressive Web Apps para sacar el máximo provecho de la web. – Washington Post

FLIPBOARD

Flipboard ha construido una gran experiencia móvil para la web usando las características de Progressive Web Apps. – Flipboard

ALIEXPRESS

Ha demostrado que incluso sitios de compras online pueden sacar provecho de lo que nos ofrecen las Progressive Web Apps. – Aliexpress

En conclusión las Progressive Web Apps nos ofrecen muchos beneficios para nuestra aplicación web, sitio web o blog.

Se planea seguir desarrollando las características actuales y agregar muchas más, por lo que no es solamente una tendencia sino el próximo paso en el desarrollo de la web como la conocemos.