Melhore seu SEO indiretamente com PWA

Os aplicativos web progressivos ou Progressive Web Apps (PWA) são um dos conceitos mais interessantes que surgiram no final de 2015. Desenvolvido pelo Google, a ideia é criar um site aprimorado que tenha qualidades semelhantes aos aplicativos.

PWA: o que é?

Há toda uma série de vantagens na implementação de um aplicativo web progressivo em soluções de sites existentes. Essas vantagens vão desde um melhor desempenho e melhores taxas de conversão até funcionalidades off-line e notificações por push.

Não só as velocidade das páginas sendo mais aprimoradas e as taxas de rejeição sendo mais baixas afetarão positivamente as classificações do ponto de vista SEO, mas também aumentarão a experiência do usuário e fornecerão outro canal para o marketing de conteúdo para os visitantes com notificações por push.

Comparado a um site convencional, um PWA trabalha em harmonia com ele, mas age como uma camada entre o site e a conexão à Internet, roteando todas as solicitações do navegador através de um script chamado Service Worker, que exibirá os resultados desejados, tornando possível adicionar mensagens off-line ou até mesmo conteúdo de páginas da web off-line especificamente adaptado para usuários sem acesso à Internet.

Tecnicamente, um PWA salvará todas as páginas do seu site no armazenamento local de um visitante e somente atualizará o conteúdo quando necessário.

A maneira como isso é conseguido é usando o serviço Worker para servir todas as páginas, folhas de estilo CSS, imagens e JavaScript etc. Tudo isso será armazenado no que é geralmente chamado de shell do aplicativo.

Significa que tudo o que é necessário para renderizar a página será armazenado localmente para um ótimo desempenho.

Em seguida, quando um usuário navegar até uma nova página ou uma página com conteúdo atualizado (em comparação com a última visita do usuário), o serviço mostrará o novo conteúdo e o armazenará no shell do aplicativo.

Embora não seja necessário, é assim que a maioria das implementações atuais prefere lidar com o conteúdo em cache, e é como o Google sugere que os desenvolvedores também o manipulem.

Algumas das vantagens do PWA

Abaixo está uma lista de alguns dos benefícios da implementação PWA:

  • O layout responsivo funciona em todos os dispositivos
  • Responde como um aplicativo para dispositivos móveis
  • Funciona no modo offline
  • Solicita que o usuário adicione à tela inicial
  • Notificações via push
  • Performance melhorada

O layout responsivo funciona em todos os dispositivos

O PWA significa que todos os usuários devem experimentar o mesmo conteúdo e interface visual.

Enquanto os usuários com navegadores suportados pelo service worker verão todos os aspectos positivos do PWA, os usuários que navegam sem suporte para o PWA ainda verão o mesmo layout, independentemente de seus dispositivos, embora não possam aproveitar os vários benefícios, como modo offline ou notificações push.

Esse é um passo na direção certa em relação aos aplicativos web e de dispositivos móveis, já que muitos pacotes de software, no passado, tinham um histórico de más dependências. Lembram-se do Flash?

Responde como um aplicativo para dispositivos móveis

Como o PWA armazena tudo em cache em um chamado “shell de aplicativo”, temos a opção de imitar a aparência de um aplicativo para dispositivos móveis normal, completo com elementos de interface do usuário, animações como as conhecidas de aplicativos populares e assim por diante.

As diretrizes para desenvolvedores do Google recomendam seguir um conjunto de práticas que garantirão que todos os aplicativos da web sejam testados e experimentados em termos de interface do usuário, melhorando assim a experiência do usuário, já que o usuário comum já estará acostumado com os layouts e ícones.

Funciona no modo offline

A primeira vez que um usuário visita um site com um PWA instalado, um conjunto completo ou parcial de conteúdo em cache será armazenado localmente nesse dispositivo do usuário.

Isso garante que as visitas posteriores sirvam as páginas próximas instantaneamente e adiciona a possibilidade de os usuários visitarem as páginas no modo off-line.

Dependendo de como os PWA’s individuais são desenvolvidos, é possível armazenar em cache todo o conteúdo, ou alguns deles, e também é possível mostrar uma página offline personalizada simples ou mostrar a versão “ao vivo” com conteúdo em cache offline.

As inúmeras possibilidades são o que torna esse recurso tão interessante e que pode ser adaptado para praticamente todos os tipos de necessidades.

Solicita que o usuário adicione à tela inicial

Depois que um site atende a alguns requisitos apresentados pelo Google, vários navegadores solicitam que os visitantes instalem o PWA em suas telas iniciais, semelhante à instalação de um aplicativo e à obtenção de um ícone para facilitar o acesso.

Embora já tenhamos essa possibilidade com o uso de marcadores, agora que podemos acessar o PWA no modo off-line, isso adiciona uma nova dimensão ao conceito e, juntamente com o próximo item (abaixo), pode ser uma inestimável inovação.

Notificações via push

Sempre que um visitante adiciona o PWA a suas telas iniciais, pode ser solicitado que ele também aceite notificações por push e, assim, receba mensagens em seus dispositivos automaticamente.

Isso abre a oportunidade para você explorar o potencial de marketing que os aplicativos móveis.

Performance melhorada

Aprimoramentos bastante significativos foram feitos ao comparar tempos de carregamento de página e tamanhos de página em comparação com sites sem um service worker instalado, em clientes móveis e de desktop.

Lembre-se de que o serviço armazena em cache o conteúdo na primeira visita, mas como os usuários precisam fazer o download de tudo nessa visita, os aumentos de desempenho ocorrem apenas em cargas subsequentes.

Verifica-se um aumento de quase 30% no desempenho em dispositivos de desktop e mais de 22% em dispositivos móveis devido aos métodos eficientes de armazenamento em cache.

Conclusão

Estes são tempos empolgantes para desenvolvedores web e sites que não têm intenção de desenvolver um aplicativo nativo para dispositivos móveis, já que aplicativos web progressivos podem ser comparativamente baratos.

Além disso, o fato de que os navegadores que atualmente não suportam aplicativos web progressivos ainda mostram aos usuários conteúdo regular significa que as empresas não precisam ter medo de investir nesta tecnologia agora, já que ninguém ficará com páginas quebradas ou mensagens de erro.

Fernando Gallas

Desenvolvedor web desde 2001. WordPress, PHP, Python.

Comente