Os PWAs são o caminho? Tudo o que você precisa saber sobre aplicativos da Web progressivos para comércio eletrônico

Desde a introdução dos Progressive Web Apps em 2015, muitas empresas tiraram grande proveito dessa tecnologia. Eles são capazes de oferecer experiências de usuário altamente envolventes e, ao mesmo tempo, alcançar novas bases de usuários. Os casos de uso mais notáveis ​​vieram de grandes empresas como Twitter, Trivago, Alibaba e Walmart, relatando taxas de conversão dobradas e receitas crescentes mais rápido do que nunca.

As histórias de sucesso de PWA desses gigantes de negócios são logicamente atraentes para várias pequenas e médias empresas. Com o uso de Progressive Web Apps, os comerciantes agora podem fornecer a mesma experiência de aplicativo de alta conversão de um aplicativo nativo para um público muito maior na web móvel, tornando-a uma tecnologia imperdível para empresas de qualquer tamanho .

O que é um Progressive Web App?

Em sua essência, um Progressive Web App (PWA) é um aplicativo da Web que usa os recursos da Web mais recentes para oferecer aos usuários uma experiência semelhante a um aplicativo nativo. É a tecnologia que trará consistência entre aplicativos web e nativos e substituirá ambos por uma única instância.

Historicamente, os aplicativos nativos forneciam uma experiência muito mais rica do que a web móvel, criando alto envolvimento com o usuário final. Um Progressive Web Application é um site que se parece e se comporta da mesma maneira que um aplicativo nativo, o que significa que são incrivelmente rápidos, podem ser adicionados à tela inicial de um smartphone, enviar notificações push e até mesmo trabalhar offline.

Os aplicativos da Web progressivos são:

1. Confiável.

Eles carregam instantaneamente, independentemente do estado da rede. Eles eliminam a dependência de uma conexão de rede, garantindo uma experiência de usuário instantânea e confiável, mesmo com conexão de internet ruim ou inexistente.

2. Incrivelmente rápido.

Se o seu site estiver lento, os clientes vão embora, fazendo com que você perca vendas em potencial. Os PWAs carregam extremamente rápido e respondem rapidamente às interações do usuário. O desempenho aprimorado do site afeta positivamente a conversão, a experiência do usuário e as taxas de retenção.

3. Altamente envolvente.

Eles fornecem uma verdadeira experiência de aplicativo nativo, incluindo recursos da Web, como a opção de enviar notificações por push e aparecer na tela inicial.

Por que sua empresa precisa de um aplicativo da Web progressivo

Com o tráfego móvel superando o tráfego de desktop – atualmente 60% do tráfego vem de dispositivos móveis – é crucial que os comerciantes forneçam a melhor experiência de compra para envolver seu público. Embora o tráfego móvel esteja crescendo, as taxas de conversão não estão:o tráfego móvel ainda representa apenas 16% da conversão total.

O Google relata que, quando uma loja de comércio eletrônico está mudando para um Progressive Web App, eles geralmente testemunham um aumento geral de 20% na receita, com as taxas de conversão em dispositivos móveis dobrando em alguns casos.

Qualquer loja virtual nova e existente deve considerar fornecer seus serviços não apenas como uma loja online padrão, mas como um aplicativo da Web Progressivo. Com a maioria dos sites de comércio eletrônico ainda não adotando essa nova tecnologia, eles representam uma rara e empolgante oportunidade de ficar à frente da concorrência.

1. Melhor adoção do usuário instalando na tela inicial.

Os Progressive Web Apps proporcionam uma experiência de usuário altamente envolvente, com os mesmos recursos dos aplicativos nativos. Os Progresssive Web Apps podem ser instalados na tela inicial, tornando-os diretamente acessíveis aos usuários.

Em um mês típico, a quantidade média de aplicativos baixados por um usuário de smartphone é próxima de zero. As pessoas não baixam aplicativos.

Com um Progressive Web App, ‘baixar’ é tão simples quanto visitar um link da web e aceitar uma solicitação. Do ponto de vista do usuário, o site se transformará em um aplicativo 'real' - e não em um atalho do navegador - ao ser colocado na tela inicial. Isso alcança o mesmo resultado que baixar de uma loja de aplicativos, mas sem o incômodo de passar pelo processo da loja de aplicativos. Além disso, após a instalação do PWA na tela inicial, nenhuma atualização adicional é necessária. Os PWAs são atualizados automaticamente em segundo plano, garantindo que seus clientes sempre vejam o conteúdo mais recente.

Talvez não seja surpreendente, então, que as empresas estão relatando que seus usuários instalam seus PWAs, enquanto eles rejeitaram anteriormente seu aplicativo nativo.

A Flipkart viu 60% dos clientes que desinstalaram seu aplicativo nativo voltarem a usar o Flipkart PWA. Para a adoção de qualquer site pelo usuário, as instalações rápidas com o PWA provam fazer a diferença no envolvimento e no sucesso do usuário.

2. Aumentando o engajamento do usuário com notificações push.

Semelhante a um aplicativo nativo, o PWA oferece a capacidade de enviar notificações push para dispositivos móveis. Com uma forma muito intuitiva, as empresas podem alcançar seu público onde eles estão mais:diretamente em seu dispositivo móvel, criando uma experiência de usuário altamente envolvente.

Essas pequenas mensagens têm um grande impacto:chamam a atenção, sempre. Comparado ao marketing tradicional, como e-mails, as notificações push têm a grande vantagem de aparecerem diretamente no telefone de uma pessoa; eles se destacam da multidão e, o mais importante, uma empresa não precisa fazer muito esforço para coletar endereços de e-mail ou outras informações antes de poder se envolver com seu público.

Cerca de 96% dos internautas navegam na web anonimamente, não deixam seus endereços de e-mail ou informações de contato em sites e não configuram uma conta. Este é um gigantesco ponto cego que todo negócio sonha em transformar em um ponto ideal.

O limite para permitir uma notificação por push ao visitar um site é muito menor do que o limite para se inscrever em um serviço de boletim informativo. O Google relata que quase 60% dos usuários estão permitindo que seus PWAs enviem notificações, o que aumenta significativamente as oportunidades de promoção de produtos ou serviços. Os benchmarks do setor mostram que 2,7 vezes mais pessoas abrirão e clicarão em uma notificação push da Web em comparação com um e-mail.

3. Custos de desenvolvimento reduzidos, inovação mais rápida e entrega contínua.

As empresas com uma estratégia omnicanal e multiplataforma estão atualmente construindo, mantendo e promovendo até 4 sistemas:seu site (responsivo), seu aplicativo Android, seus aplicativos iOS e, em alguns casos, também aplicativos nativos do Windows 10.

Embora construir, otimizar e manter um site responsivo já seja um processo que consome muitos recursos, o desenvolvimento adicional de aplicativos nativos facilmente quadruplica esse investimento. Isso não se deve apenas à criação de um aplicativo, mas também ao monitoramento contínuo, manutenção, melhorias e processos de revisão da loja de aplicativos (e não vamos esquecer o infame imposto de 30% da Apple).

Um Progressive Web App elimina completamente a necessidade de desenvolvimento, manutenção e marketing de qualquer plataforma que não seja o site PWA. Isso oferece uma oportunidade única de atender a todos os canais de uma plataforma, que é construída, mantida e atendida por uma equipe. Reduz drasticamente os custos e o tempo de colocação no mercado, ao mesmo tempo em que atende à mesma experiência e recursos do usuário para todos os clientes e mantém a estratégia multicanal.

4. Excelente desempenho instantâneo.

Os usuários da Internet estão sempre exigindo mais velocidade, especialmente com o aumento maciço do uso do mobile-first e até mesmo do mobile-online. Pesquisas mostram que 53% dos visitantes saem de um site após apenas 3 segundos de carregamento da página e as taxas de conversão diminuem em 21,8% a cada 1 segundo de atraso na velocidade da página.

É quase inacreditável que o tempo médio de carregamento de páginas da web em dispositivos móveis em redes 3G seja de 19 segundos e 14 segundos em redes 4G.

O relatório, “The Need for Mobile Speed“, descobriu que os sites para celular carregados em cinco segundos tiveram um desempenho muito melhor do que aqueles que levaram 19 segundos para carregar:sites carregados em 5 segundos possuem visibilidade de anúncio 25% maior, sessões médias 70% mais longas e uma taxa de rejeição 35% menor.

Os Progressive Web Apps são projetados por design para experiências de usuário extremamente suaves e rápidas. Aproveitando os benefícios de velocidade da web e o cache do lado do cliente de 'estilo nativo', ele supera os carregamentos de página. Os PWAs podem ser carregados em apenas 1 segundo, criando uma verdadeira experiência de velocidade 'instantânea', envolvendo o usuário desde o início.

Além disso, os Progressive Web Apps estão usando significativamente menos espaço em disco – tanto no servidor da empresa quanto no dispositivo do usuário – oferecendo benefícios como tempos de carregamento mais rápidos, menos uso de dados e menos espaço de armazenamento necessário.

O PWA do BookMyShow leva menos de 3 segundos para carregar e aumenta as taxas de conversão em mais de 80%. O PWA é 54x menor que um aplicativo Android e 180x menor que um aplicativo iOS.

5. Os PWAs podem melhorar seu SEO.

Como um PWA é baseado na web, tudo pode ser descoberto pelos mecanismos de pesquisa. Qualquer conteúdo dentro de um PWA pode ser vinculado, compartilhado e classificado pelo Google e Bing. Isso contrasta com aplicativos nativos, que não permitem ser rastreados por robôs de mecanismos de pesquisa. Ao quebrar as barreiras entre web e nativo, os usuários podem ser vinculados diretamente aos produtos digitais mais sofisticados, em qualquer dispositivo, a qualquer momento.

Tempos de carregamento super rápidos, taxas de rejeição reduzidas, uso mínimo de dados e experiências altamente envolventes são, por padrão, impulsionadores para classificações de SEO. Com o PWA oferecendo vantagens como essas prontas para uso, é lógico raciocinar que o uso de um PWA resultará automaticamente em classificações de SEO mais altas. Se bem feito, isso é absolutamente verdade. O Google classificará os PWAs bem projetados mais altos do que qualquer outro site regular.

No entanto, o SEO técnico é muito importante. É fundamental garantir que a tecnologia dos Progressive Web Apps seja atendida da maneira certa. Os Progressive Web Apps usam a flexibilidade do JavaScript, o que significa que o Google vê a única página publicada como um site JavaScript. O Google rastreia sites PWA da mesma forma que rastrearia um site AJAX ou JavaScript, mas a capacidade dos mecanismos de pesquisa de descobrir, rastrear e indexar corretamente o conteúdo com precisão - que depende muito do JavaScript - tem sido historicamente ruim.

Felizmente, não há necessidade de se preocupar. Os desenvolvedores que criam PWAs precisam estar cientes de como otimizar o site para garantir que a página seja indexada adequadamente, o que pode ser feito facilmente com técnicas como renderização do lado do servidor – fornecendo aos PWAs a arquitetura certa para obter as principais classificações de SEO que eles merecem.

Aqui estão alguns ótimos recursos para PWA SEO:

• SEO de PWAs:desenvolvendo PWAs otimizados e como validá-los
• SEO e aplicativos da Web progressivos:olhando para o futuro
• Crie aplicativos da Web progressivos que não destroem seu SEO
• Os Progressive Web Apps ajudam na otimização orgânica do mecanismo de pesquisa?

6. Maiores taxas de conversão.

É lógico que uma melhor experiência do usuário resulta em taxas de conversão mais altas. Se os atritos e frustrações são removidos de uma loja online, fica mais fácil para os clientes atingirem seus objetivos – e, portanto, os objetivos do negócio.

Os PWAs apresentam grandes oportunidades para oferecer melhores experiências, em todos os aspectos.

A Lancôme viu um aumento de 17% nas conversões, um aumento de 53% nas sessões móveis no iOS e um aumento de 8% nas taxas de conversão em carrinhos recuperados por meio de notificações push.

O Alibaba viu conversões 76% maiores em navegadores, 14% mais usuários ativos mensais no iOS, 30% mais usuários ativos mensais no Android e uma taxa de interação 400% maior de 'Adicionar à tela inicial'.

Tudo sobre PWAs é mais rápido, mais enxuto, mais liso e mais eficiente, e é sentido pelo usuário. Desde o carregamento instantâneo em segundo plano na tela inicial até a navegação em tela cheia, carregamentos instantâneos de páginas e uso mínimo do espaço do dispositivo. O usuário tem uma experiência muito melhor, conclui suas tarefas e voltará com prazer no futuro - acionado ou não por uma notificação push altamente envolvente.

Anatomia de um aplicativo da Web progressivo

Em sua essência, um PWA é um aplicativo da Web que usa os recursos da Web mais recentes para oferecer aos usuários uma experiência semelhante a um aplicativo nativo.

Em 2015, Alex Russell introduziu o termo “aplicativo web progressivo”. Ele contou uma conversa entre ele e Frances Berriman, na qual eles “enumeraram os atributos de [uma] nova classe de aplicativos” baseados na evolução gradual e poderosa dos navegadores modernos.

Eles criaram um conjunto de webapps de ‘atributos’ que devem constituir para serem qualificados como um Progressive Web App. Esses atributos são:

1. Progressivo —O PWA deve funcionar para todos os usuários, independentemente da escolha do navegador, pois foi desenvolvido com aprimoramento progressivo como princípio central.
2. Responsivo — O PWA deve funcionar em qualquer dispositivo, em qualquer tamanho:desktop, celular, tablet ou qualquer outro.
3. Independente de conectividade — Os PWAs não dependem da disponibilidade da rede.
4. Semelhante a um aplicativo — O usuário desfrutará de uma verdadeira experiência de aplicativo nativo, em termos de velocidade e interação do usuário.
5. Fresco — O PWA está sempre atualizado, nenhuma atualização é necessária
6. Seguro — Sempre veiculado via HTTPS.
7. Descobrível — Em contraste com aplicativos nativos reais, um PWA é identificável como um “aplicativo” e permite que os mecanismos de pesquisa o encontrem e indexem.
8. Reativável — O PWA oferece aos profissionais de marketing a possibilidade de reengajar facilmente com os visitantes por meio de recursos como notificações push, que antes estavam disponíveis apenas para aplicativos nativos.
9. Instalável — Um PWA permite que os usuários adicionem aplicativos que consideram mais úteis à tela inicial sem o incômodo de passar por uma loja de aplicativos.
10. Ligável — Um PWA tem uma estrutura de URL real, facilitando o compartilhamento do aplicativo via URL, mas também disponibiliza as páginas do PWA para serem usadas para fins de marketing, como SEA.

Esse conjunto de “atributos” é sobre a experiência do usuário e como usamos a web:segurança, velocidade, engajamento e compartilhamento. No entanto, tecnicamente falando, um Progressive Web App pode ser definido por três critérios.

Os três critérios básicos que um site deve cumprir para se qualificar como PWA são:

1. HTTPS — um PWA precisa ser servido por HTTPS para garantir um ambiente seguro e a transmissão de dados.
2. Manifesto do aplicativo da Web — um PWA precisa de um Web App Manifest, um arquivo JSON contendo todos os metadados que o dispositivo precisa saber sobre a página para poder instalá-lo na tela inicial. O arquivo contém informações como ícones, cores, fontes, URL da página de destino etc.
3. Trabalhadores de serviço — o ingrediente mais importante de um PWA é o Service Worker. Estes são tecnicamente recursos de desbloqueio de 'proxies javascript', como modo offline, velocidade instantânea e a capacidade de enviar notificações push.

Fazer coisas como notificações por push e o modo offline eram anteriormente impossíveis na web devido às limitações do navegador – mas com o uso de Service Workers, esses recursos agora foram desbloqueados. O Service Worker é uma tecnologia introduzida pelo Google que permite controlar solicitações de rede programaticamente, o que, por sua vez, permite criar experiências off-line e fornecer velocidade instantânea. Além disso, você pode executar tarefas em segundo plano, o que permite enviar e exibir notificações push mesmo quando o navegador está fechado.

Você precisa de um PWA para sua loja?

Qualquer empresa que vende online se beneficiaria de um PWA. Quando o tempo de carregamento da página móvel passa de 1 segundo para 5 segundos, a probabilidade de rejeição aumenta em 90%. Quando os clientes são retidos por um checkout lento, a venda está em risco. A experiência aprimorada do usuário e as velocidades de página rápidas de um Progressive Web App permitem que o cliente conclua a tarefa desejada com rapidez e eficiência. Os PWAs oferecem velocidades de página duas a quatro vezes mais rápidas, garantindo que os usuários conquistados com muito esforço permaneçam envolvidos e convertam.

Se um site de comércio eletrônico dobrar sua taxa de conversão ao implementar um Progressive Web App, é claro que é difícil prever. Uma coisa é certa:com essa nova tecnologia, as empresas agora podem fornecer a mesma experiência de aplicativo de alta conversão de um aplicativo nativo para seu público muito maior na web móvel. Os primeiros usuários provam que os Progressive Web Apps realmente mudaram seus negócios.

1. Como criar um aplicativo da Web progressivo.

Transformar seu site de comércio eletrônico em um Progressive Web App é um processo que qualquer loja virtual deve definitivamente considerar fazer no próximo ano. Não só lhe proporcionará todas as grandes vantagens, como também garantirá que se mantenha à frente da concorrência.

No entanto, um grande equívoco é que, se você deseja se beneficiar dos recursos do PWA, precisa substituir completamente o front-end, fazendo com que as empresas acreditem que a adoção do PWA é um processo altamente intensivo e caro.

Felizmente, o oposto é verdadeiro! A tecnologia PWA permite a implementação modular, aproveitando as vantagens com um tempo mínimo de colocação no mercado. Por exemplo, se você quiser começar dando ao seu público a oportunidade de instalar seu PWA em sua tela inicial, a única coisa que você precisa fazer é instalar um Web App Manifest. Além disso, começar com aplicativos nativos como notificações push pode ser feito em apenas 5 minutos com extensões disponíveis na loja BigCommerce.

Aplicar tais técnicas em lojas existentes é o primeiro passo para melhorar a experiência do usuário e aumentar as taxas de conversão, em um tempo mínimo de comercialização e com baixo custo de implementação.

2. Construindo um aplicativo web progressivo com BigCommerce e DEITY Falcon.

A plataforma headless SaaS aberta e altamente extensível da BigCommerce oferece às empresas um mundo de possibilidades com integrações de classe empresarial, APIs flexíveis e webhooks. Usando as mesmas tecnologias, a DEITY Falcon construiu uma plataforma de lançamento de código aberto para vitrines PWA altamente envolventes.

Combinado com o DEITY Falcon, o BigCommerce está oferecendo a oportunidade para todas as lojas lucrar com as vantagens dos Progressive Web Apps. Usando BigCommerce como o principal mecanismo de back-end de comércio eletrônico, combinado com o DEITY Falcon como front-end de PWA, empresas de todas as formas e tamanhos diferentes podem começar a oferecer experiências da Web robustas, altamente escaláveis ​​e surpreendentes para seus usuários, lucrando com todas as vantagens do aplicativo enquanto minimiza o tempo de colocação no mercado – e tudo isso a um custo total de propriedade menor do que qualquer outra plataforma líder de comércio eletrônico.

Resumo executivo:o que você deve fazer em seguida

Com os telefones celulares sendo fortemente incorporados na maioria dos aspectos de nossas vidas, o dispositivo está mudando fundamentalmente a forma como fazemos compras. Nossa demanda por experiências de usuário melhores e altamente envolventes, tempos de carregamento instantâneos, acesso instantâneo a informações e independência de rede está crescendo rapidamente.

Como empresários, não podemos ignorar a combinação da experiência imersiva oferecida pelos aplicativos nativos com o alcance e a facilidade de acesso à internet que os PWAs estão nos proporcionando. Começar com Progressive Web Apps não é algo que deve ser adiado por mais tempo.

Se você optar por usar o PWA completo ou dar pequenos passos começando com, por exemplo, notificações push e 'adicionar à tela inicial' primeiro, a adoção de uma estratégia de PWA deve ser uma prioridade para qualquer tipo de negócio, grande ou pequeno.

Com investimentos mínimos necessários e um tempo recorde de lançamento no mercado, qualquer pessoa pode começar a mudar drasticamente a experiência que oferece ao seu público hoje, aumentando as taxas de conversão e, por fim, melhorando seus resultados finais.