El acceso a internet mediante smartphone es cada vez mas común. El año pasado ya fue superior que el acceso a webs con un ordenador. Por esto, en el desarrollo web ha surgido el concepto de «móviles primero», donde se anima a diseñar la web para móvil antes que para versión de escritorio.

En móvil, tenemos funcionalidades extras que no tenemos en un ordenador personal, funcionalidades que las aplicaciones móviles suelen explotar… y ahora la web también, con Progressive Web App

Progressive web app nos permite acceder a funcionalidades extra del smartphone o tablet para ofrecer una mejor experiencia para el usuario. Aunque las posibilidades son muchas, vamos a enumerar unas cuantas.

Funcionalidades de Progressive Web App

Algunas de las posibilidades que nos ofrece Progressive Web App (PWA) son:

  • Cambiar el color de la parte superior del teléfono y otros componentes, para ofrecer una experiencia mejorada de visualización.
  • Mostrar notificaciones en la barra de notificaciones.
  • Controlar la vibración del teléfono para acciones importantes.
  • Hacer uso del acelerómetro y giroscopio del smartphone para saber la posición e inclinación.
  • GPS para geoposicionamiento.
  • Permitir su uso incluso cuando haya cortes de internet.
  • Crear un acceso directo de aplicación, incluso con una pantalla de carga personalizada.
  • Hacer uso de la cámara del teléfono, galería…

Y muchas otras mas.

Que necesitas configurar para seguir las buenas prácticas de Progressive Web App

Las buenas prácticas nos marcan las pautas por las cuales podemos considerar que una web es una progressive web app. Para ello debemos proporcionar:

  • Un manifest, que es un archivo donde se le da información util sobre la web a las diferentes plataformas móviles.
  • Iconos redimensionados para las necesidades de las plataformas móviles
  • Un service worker que es un código que se encarga de manejar las conexiones a la página online, que hacer cuando está offline, hacer uso de la cache…

Adapta tu web a PWA

Esta web usa funcionalidades de progressive web app, por eso es que ves la parte superior del smartphone o tablet de color rosa. Además prueba a darle en «opciones» de tu navegador (en chrome los tres puntos de arriba a la derecha) a «Añadir pantalla de inicio». Te creará un acceso directo y cuando accedas desde el, verás la experiencia web es mas fluida.

No esperes para adaptar tu web, la experiencia de usuario será mucho mejor y además mejora el SEO. ¿A qué estás esperando?

Ya sabes que si necesitas cualquier servicio de consultoría informática, desarrollo o análisis web, puedes contactar con nosotros.