Progresive Web App

Nos volvemos locos con esto de hablar en inglés en todo momento pero las Progresive Web App lo merecen o las web-aplicación progresivas para móviles.

Vamos a empezar por el principio, aunque si estás en esta web de continuo lo habrás observado que lo tiene y voy a explicarte una manera sencilla de hacerlo en tu web.

¿Qué es una Progresive Web App o PWA?

Este tipo de webs son eso, web que en tu dispositivo móvil o tablet hace la función de aplicación, con lo que ya automáticamente pasa a ser óptimo para tu móvil.

Estas webs funcionan igual que la web en su modo nativo, es decir, que a ti como usuario no dejas de ver la web, de la manera en la que la «verías como tal » en tu móvil, pero con ciertas ventajas

Beneficios de mi Web App

Pues no es que sea jauja pero si tendrás ciertas cosas que mejoraran tu web en estos dispositivos, y son:

Acceso offline a la página

No necesitas de una conexión a internet para poder entrar, pero esto no quiere decir que desde un dispositivo si no tiene ninguna conexión vaya a funcionar.

Podemos decir que tu dispositivo cargará lo último que descargó una vez tuvo conexión a la red y es entonces cuando entres lo que te mostrará.

Carga rápida

Nuestra carga será muy rápida, más incluso que si de la misma web se tratara, aun siendo en este caso una aplicación de web, por decirlo de una manera un poco simplista (tengo que hacer que lo entiendas ).

Y encima es instalable

Con un simple clic tienes la web en todo momento en tu aparato, no sé ya que más quieres.

¿Y como hago esto?

Déjame enseñarte pupilo, que tienes varias maneras de hacerlo.

Una es programando, que para ello necesitas hacerlo con HTML, CSS y JS es un nivel aún difícil para el nivel que llevamos aquí y lo meteré mejor en programación y otro modo de hacerlo por WordPress es con un plugin, yo por ejemplo utilizo el plugin SuperPWA que es muy fácil de utilizar e instalar.

Con más de 20 mil instalaciones activas ya os puedo decir que funciona muy bien.

Funcionamiento de SuperPWA

Bueno pues ahora te voy a explicar cómo se configura el plugin y por favor, presta atención que no lo repetiré muchas veces, ya si eso tu vuelves a leer.

Vamos a ir por trozos aunque no tiene mucho y bastantes cosas son muy obvias.


Nombre de la aplicación; Es el nombre que quieres ponerle a la «aplicación que aparecerá en el dispositivo electrónico cuando se descargue, (uso esa palabra de dispositivo electrónico por la keyword research que hice en su momento).

Nombre corto de la aplicación; es el nombre más que aparecerá de la aplicación en el momento que haya algún problema de espacio, personalmente no he tenido ese problema ni lo he visto con JaviLazaro, así que como puedes intuir admiten nombres bastante largos.

Icono de la aplicación; es la pequeña imagen que aparecerá en la pantalla del equipo en el que lo hemos descargado, tiene que ser en formato PNG y con dimensiones 192×192.

Descripción; aquí escribimos un texto muy corto que hable de nuestra aplicación web, la verdad que es algo que tampoco es que te tengas que comer mucho la cabeza, JaviLazaro Blog era más que suficiente.

Icono de la pantalla de presentación; aquí viene la imagen de cuando está cargando que es poco tiempo y de bienvenida, también tiene que ser PNG y la dimensión es mayor, en este caso 512×512.

El color de fondo; es el color de fondo que tiene la presentación.

Color de tema; aquí solo tienes que elegir en el color en el que quieras que predomine en tu WebApp

Página de inicio; elegimos en que página queremos que empiece, es decir, cuando se abra la aplicación que queremos que sea lo primero que se vea.

Página sin conexión; es la página que queremos que se visualice en el caso de no tener conexión y al mismo tiempo que la caché no haya guardado o descargado alguna actualización

Orientación; es mejor ponerlo «Seguir la orientación del dispositivo», podéis poner para que siempre sea en horizontal o en vertical, pero es raro que en blog necesitemos que esté solo en una orientación.

Visualización; está más enfocado en la interfaz del dispositivo, aquí lo tengo puesto como veis en pantalla completa, por que no hay nada más importante que mi blog.

Estado; te indica si está el estado óptimo para crearlo o no.
Con este plugin ya os he dicho que tenéis una carga más rápida que luego estáis preguntando como hacer para que tu web cargue más rápido en el móvil… pues ale fácil y sencillo

Me gusta poner una Cita de vez en cuandoConclusión:

Una herramienta tan fácil de usar como es esta y que puede ayudarte mucho para el uso del móvil, que con un buen contenido ya tienes gran parte hecha para tener gente fiel en tu canal no tienes que dudarlo, descarga el plugin y ponlo.

Más adelante haremos la clase de programación y lo introduciremos pero tenéis que darme un poco más de tiempo que ya sabéis que estoy muy liado y ando de tiempo más que justo para poder hacer muchas entradas en el blog.

La verdad que tengo muchos deberes y estoy liado con lo que va a ser la crème de la crème del post que os voy a subir paso a paso y seguramente haya video incluido de lo completo que va a ser o incluso tenga que hacerlo por tomos ya os iré dando más información

¿Qué te ha parecido la herramienta y el TIP?

Bueno dame tu opinión sobre la herramienta, estirate un poco y cuéntame

Fuente: este post proviene de javilazaro, donde puedes consultar el contenido original.
¿Vulnera este post tus derechos? Pincha aquí.
Creado:
¿Qué te ha parecido esta idea?

Esta idea proviene de:

Y estas son sus últimas ideas publicadas:

Seguimos con nuestro curso de SEMrush y vamos con el tercer bloque que creo que también tiene su chicha además es muy importante de tener en cuenta además que hay muchos trucos que veremos como podemo ...

Volvemos a nuestro curso de SEMrush y esta vez si hay video y empezamos dando caña como al primer módulo de la parte SEO, muy importante en el que quiero dejarlo lo más claro posible y explicando algú ...

Parece que llevo tiempo sin escribir por aquí y debéis perdonarme pero estoy hasta arriba para prepararos aún más contenido y sobre todo más PRO, por eso vengo hoy con un curso gratis de SEMrush y lo ...

¿Hey, que tal lector? (siempre quise empezar así) soy Javi Lázaro vuestro seo de Guadalajara aunque otros me llaman Pichu ;p. Vengo a hablaros sobre el enlace interno en el que ya se habló aquí hace u ...

Etiquetas: CMS

Recomendamos

Relacionado

Aplicaciones Chollos anime ...

Hoy traigo una app fantástica para aquellos fans de los Animes. Se trata de una aplicación no oficial creada por los fans del sitio web AnimeFLV. Con la app podremos descargar o ver online facilmente en nuestro dispositivo cualquier capitulo o película de la web sin publicidad. Descargar AnimeFlv App para Android Para descargar la aplicación es muy sencillo tan solo hay que hacer click aquí. Una v ...

Blog Posicionamiento web optimiza tu web ...

Como contábamos en nuestro post anterior donde te hablábamos de los mejores plugin de posicionamiento para SEO en wordpress, hoy nos gustaría enseñarte unos plugin que te ayudarán a optimizar tu web, y de esta forma conseguirás posicionar mejor tu web en google. ¿Te animas a descubrir que cosas te van a ayudar a posicionar tu web de wordpress en SEO? ¿Qué razones hay para usar WordPress para hacer ...

Tecnología e Internet

eyeZy Opiniones: Revisión completa de la App eyeZy es una App diseñada para monitorear de forma remota cualquier móvil. El funcionamiento de la aplicación es totalmente confidencial y te permite supervisar las actividades de tus hijos, con el fin de resguardar su seguridad antes las amenazas de la web. ¿Quieres conocer de qué se trata? A continuación, preparamos una revisión completa de las caract ...

Si tienes una página web, seguramente te gustaría tener una aplicación para tel móvil también, pero habitualmente esto es algo caro y complejo. Sin embargo, ahora es super sencilo hacerlo, sin tener ningún conocimiento técnico. En este vídeo verás cómo convertir tu página web en una app para android en menos de lo que has tardado en leer este texto ;)

general aplicaciones móviles internet ...

Hace poco conocíamos, a través de un post que vimos en Facilisimo, una aplicación de gran utilidad para aquellos que gustan de ver la televisión en cualquier lugar y momento, nos pareció interesante, y es por eso que hemos creído interesante compartirla con todos nuestros lectores, ya que, seguramente son muchos los que en mayor o menor medida acostumbran a ver programas de televisión, boletines d ...

móviles google market market.android.com

En la presentación de hoy en las oficinas centrales de Google, ha aprovechado la oportunidad para presentar su versión del Market de Android sobre plataforma web. Ahora ya podemos comprar y bajar a nuestros dispositivos Android directamente desde nuestro explorador en nuestro PC. Una vez nos validamos en market.android.com, y seleccionamos qué aplicación queremos descargar, nos pedirá en qué dispo ...

wuaki television iphone ...

Wuaki lanza la primera app iOS7 compatible para iPhone gracias al rediseño de su reproductor, solamente apto para iPad hasta la fecha. De este modo, Wuaki.tv Player, la app de Wuaki.tv, es ahora compatible con iPad, iPhone y iPod Touch actualizados con esta versión. La nueva app se puede descargar muy fácilmente desde la App Store. Una vez instalada en alguno de los dispositivos Apple, los usuario ...

Emprender Negocio On-line bancos de imágenes ...

¿Por qué insertar imágenes en tu Web? Como ya habrás escuchado muchas veces, una imagen vale más que mil palabras. Siempre llama más la atención una página Web con imágenes que vayan acompañando los textos. Si quieres que tu Web y Blog, luzcan profesionales y que atraigan la atención de tus lectores (potenciales clientes), te tendrás que trabajar la parte visual de tus páginas y artículos. Cuando ...

¡Bienvenidos a este post! Desde hace unos cuantos años WhatsApp, además de con su aplicación para móvil, nos permite comunicarnos a través del PC, independientemente del sistema operativo que usemos en el mismo. WhatsApp Web es el cliente de escritorio del servicio de mensajería, herramienta que posibilita el estar pendientes a la aplicación de mensajería sin necesidad de estar mirando el móvil. U ...

Ayuda para tu blog video

El otro día hice una emisión en directo dentro de mi grupo gratuito en Facebook y estuve hablando de la usabilidad del menú web. A continuación te dejo la grabación y un poco más abajo un resumen de los puntos más importantes. Cuando hablamos de usabilidad web nos referimos a la facilidad que tiene un usuario para interactuar en la página web de manera sencilla, segura, intuitiva y agradable. ...