What is a progressive web app (PWA)? Porque queres um?
faz anos desde o início da Idade do smartphone. Com isso veio a era das aplicações nativas. Os aplicativos continuam a desempenhar um papel massivo em nossa vida diária, e muitos proprietários de empresas têm se perguntado várias vezes: devemos ter um aplicativo? Claro que a única resposta a isso é — depende. Construir e manter um aplicativo nativo é complicado e muitas vezes bastante caro. Felizmente, há outra opção. Esta opção combina as alegrias de uma aplicação nativa com a tecnologia que usamos na web: a aplicação web progressiva, T. C. PWA.o que é uma PWA?
PWA significa progressivo web app. Este é um aplicativo construído a partir das tecnologias web que todos conhecemos e amamos, como HTML, CSS, e JavaScript, mas com uma sensação e funcionalidade que rivaliza com um aplicativo nativo real. Graças a um par de adições inteligentes, você pode transformar quase qualquer site em uma aplicação web progressiva. Isto significa que você pode construir um PWA bastante rapidamente, em relação a um aplicativo nativo que é muito difícil de desenvolver. Além disso, você pode oferecer todas as características de aplicativos nativos, como notificações push, suporte offline, e muito mais.
muitos sites que você encontra online são, na verdade, uma aplicação web progressiva. Toma. twitter.com por exemplo. Se você visitar esse site em seu smartphone, você pode instalá-lo na sua tela de casa. Agora, ao abrir o site do Twitter salvo, você vai notar que ele parece e executa exatamente como um aplicativo nativo. Não há janela de navegação nem nada. Não há diferença em executá-lo a partir de um iPhone ou um smartphone Android. Basta entrar e está pronto. Isso é um grande benefício de construir a sua aplicação web com um PWA em mente.
PWAs estão ganhando popularidade. Muitos sites grandes são PWAs, como Starbucks.com, Pinterest.com, Washingtonpost.com e Uber.com são realmente instaláveis em sua tela de casa e oferecem uma experiência comparável aos seus aplicativos nativos.
Qual é a diferença entre um aplicativo nativo e um PWA?
um aplicativo nativo, como os que você descarrega da Apple App Store ou da Google Play Store, é muitas vezes construído em uma linguagem de programação específica a essa plataforma. Então, para aplicativos iOS, Isso seria rápido e para aplicativos Android, Java. Se você quer construir um aplicativo para essas plataformas, você precisa conhecer a tecnologia. Sim, há atalhos, mas estes vêm com as suas próprias limitações. Se você quer ter um aplicativo em todas as plataformas móveis, você precisa conhecer todas as diferentes tecnologias. Não há uma maneira fácil de construir um e publicá-lo em todas as lojas lá fora.
é claro, existem maneiras de obter o melhor de ambos os mundos. Uma aplicação web progressiva, por exemplo. Isto é executado no navegador e — uma vez gravado na tela inicial — funções como um aplicativo nativo. Ele até tem acesso ao hardware e software subjacentes que o navegador não pode acessar por razões de segurança. Se a PWA tem um ótimo desempenho, os usuários nunca vão saber que eles estão usando um aplicativo baseado na web em vez de um nativo.há algumas ressalvas, claro. Embora os navegadores tenham sido rápidos a adotar a tecnologia para isso, ainda existem algumas limitações. No iOS, a tecnologia necessária funciona mal no Safari. A Apple não (quer) suportar tudo ainda, tornando-se um pouco uma tarefa para obter a mesma experiência exata em todos os lugares.quais são os benefícios de um PWA?
a principal razão pela qual todos estão perseguindo aplicativos é porque eles oferecem maior engajamento. Os usuários que instalam o seu aplicativo são seus maiores fãs e eles são mais propensos a transformar o seu uso em vendas ou inscrições. Graças às notificações push é muito mais fácil voltar a se envolver com os usuários. Os aplicativos podem oferecer uma excelente experiência que pode fazer bem para uma marca.
falamos sobre algumas das vantagens da PWAs neste artigo, mas aqui está uma breve visão geral:
- Você não tem que ir através do processo para obter as diferentes app stores
- Você pode construir pessoas vivendo com o sida comum com tecnologias web
- Eles são muitas vezes mais barato para construir
- uma vez que você está transformando seu site em um aplicativo, você terá menos código-bases para a manutenção
- pessoas vivendo com o sida são receptivos e trabalhar com diferentes tamanhos de tela
- pessoas vivendo com o sida são simples, rápido e leve
- Não há necessidade de entregar grandes pedaços de dinheiro para o Google e a Apple
- Eles trabalham off-line, ao contrário de seu site normal
- pessoas vivendo com o sida são detectáveis através de motores de busca (que têm uma muito maior público do que lojas de aplicações. Além disso, se você quiser, você ainda pode obter o seu PWAs distribuído através de lojas de aplicativos)
- você pode usar notificações push para re-envolver os usuários
- A instalação de um PWA pode levar a um maior engajamento
ainda assim, as aplicações nativas ganham às vezes. A pw tem acesso cada vez mais profundo ao sistema operativo de um smartphone, mas uma aplicação nativa pode ir ainda mais fundo. Além disso, há limites para o que um PWA pode fazer. Por exemplo, PWAs não são a melhor escolha quando você quer construir jogos de alto desempenho.ao todo, faz muito sentido pensar em ter uma PWA na sua estratégia móvel. Mas, a pergunta principal que você deve fazer a si mesmo é: meu público quer isso?para quem é isto?
todos devem simplesmente construir um PWA e ser feito com ele? Não, considere o seu negócio e — mais importante-o seu público-alvo. Estão a usar aplicativos? Não é uma forma demasiado complexa de chegar ao que queres alcançar? Mais uma vez, como tudo, você precisa pesquisar as necessidades do seu público. Pergunta a ti mesmo, o que queres que esta tecnologia Faça? Onde estão os teus utilizadores? Eles têm uma boa conexão de dados e hardware sólido? Como e onde eles estão usando seu conteúdo? E achas que uma aplicação pode ajudá-los a fazer melhor o seu trabalho?a PWAs é fantástica e implementá-la não tem de ser assim tão difícil. Mas só porque é fácil, não quer dizer que o devas fazer. Se o seu público não precisa disso, porque construiria um?
quais são as preocupações de SEO de uma PWA?
a PWA é inerentemente centrada na web. Ele nasceu da web e desenvolvido com motores de busca em mente para tornar a descoberta fácil. É claro, você pode fazer um aplicativo de Web progressivo a partir de qualquer site antigo e não é preciso muito para fazê-lo. No entanto, muitos PWAs usam JavaScript para construir funcionalidades mais complexas e enquanto os motores de busca se tornaram apt em renderizar JavaScript, ele ainda pode ser um motivo de preocupação.
ao configurar um PWA, você tem que se certificar de que o seu JavaScript está acessível. Não bloqueie arquivos para bots e certifique-se de que os links estão disponíveis. Para melhorar o processo de renderização, você pode fazer com que o seu framework JavaScript use a renderização do lado do servidor.transformar seu site em um PWA não significa que você melhore diretamente o SEO desse site. Se faz sentido transformar o seu site em um PWA, fazê-lo, mas não fazê-lo para quaisquer benefícios SEO percebido. Se você tem um grande PWA, você está oferecendo aos seus usuários uma experiência de usuário fantástica, o que pode torná-lo one-up sua competição. A este respeito, é uma boa idéia dar uma olhada neles para sua estratégia móvel SEO.quais são os três principais blocos de construção?
não é preciso muito para configurar uma PWA. Há três coisas que você precisa fornecer antes que seu site se transforme em um PWA válido.
- uma ligação segura( HTTPS): o PWAs só funciona em ligações de confiança, pelo que terá de As servir numa ligação segura. Isto não é apenas por razões de segurança, mas também é um fator de confiança muito importante para os usuários.
- um trabalhador de serviço: um trabalhador de serviço é um pedaço de script que corre em segundo plano. Isso ajuda você a determinar como lidar com os pedidos de rede para o seu PWA, tornando possível fazer um trabalho mais complexo.
- o ficheiro Manifesto: este ficheiro JSON contém informações sobre como a sua PWA deve aparecer e funcionar. Aqui, você determina o nome, descrição, ícones, cores, etc.
Aqui está um manifesto de exemplo do Google:
ele não parece muito difícil, certo? Um par de coisas interessantes nesta lista:
-
start-url
: isto determina onde a sua aplicação deverá começar. É melhor deixar os usuários pousarem em uma página específica para você PWA. -
display
: isto ajuda-o a determinar o tipo de UI do navegador que deseja mostrar. As opções sãofullscreen
standalone
minimal-ui
e o padrãobrowser
interface.
estas três coisas listadas acima são os requisitos mínimos para executar uma PWA. Você pode expandir a funcionalidade através de JavaScript (frameworks).como criar uma PWA?
há uma abundância de recursos para tentar a sua mão na construção de uma PWA simples. Isso permite que você sinta o processo. O Google tem um excelente, fácil de seguir tutorial sobre PWAS na web.dev site. Mozilla tem muita documentação sobre a construção de aplicativos web progressivos. A Microsoft também tem Docs de desenvolvimento rico na construção da PWAs. A Microsoft até construiu uma ferramenta chamada PWABuilder que vai ajudá-lo a transformar o seu site em um PWA. Claro, há plugins WordPress que ajudam a fazer um PWA do seu site. Além disso, o Google está trabalhando em trazer suporte base para PWAs para WordPress Core.
envolver os seus utilizadores com uma aplicação web progressiva
aplicações web progressivas podem ser uma grande adição ao seu kit de ferramentas móvel. Feito bem, eles são rápidos, trabalhar offline e executar como um aplicativo nativo. Em suma, eles podem oferecer aos seus usuários uma experiência de usuário incrível. Utilizadores envolvidos São utilizadores felizes, certo?