- A fim de otimizar o uso dos aplicativos, surgiu no mercado uma nova metodologia de desenvolvimento, o PWA.
- Porém, os desenvolvedores precisam estar cientes de como otimizar o site para garantir que a página seja indexada adequadamente.
- Os aplicativos PWA são ótimos para SEO, pois eles podem oferecer as melhores experiências na Web para o usuário.
Os últimos anos deixaram algumas coisas bem claras, se você tem um negócio online,o primeiro passo é torná-lo móvel. Um levantamento realizado pela Liftoff, revelou que o uso dos aplicativos correspondem a 80% de todo o tempo que os usuários gastam em seus celulares.
O segundo passo, é tornar a experiência dos usuários com esses dispositivos suave e sem atritos. E por fim, fazer com que eles ocupem o menor espaço possível na memória dos celulares. Dado que a média de aplicativos é cerca de 80 instalações por aparelho.
A fim de otimizar o uso dos aplicativos, surgiu no mercado o PWA(Progressive Web App), e além de seus claros benefícios de usabilidade. Muitos gestores estão apostando nas suas vantagens para melhorar as técnicas de SEO implementadas nas empresas.
O que é PWA ?
PWA ou Progressive Web Apps, segundo a Google, pode ser definido como:
Um aplicativo Web progressivo usa recursos modernos da Web para oferecer uma experiência de usuário semelhante a um aplicativo.
Portanto, é uma metodologia de desenvolvimento, que torna a experiência de uso de uma página web pelo celular semelhante a de um aplicativo mobile.
Isto dispensa a instalação de um aplicativo, estando acessível através do típico URL, o que poupará recursos e memória no dispositivo. Além disso, alterações e atualizações num web app são facilmente aplicados e aprovados para implementação junto do utilizador.
Principais características de um PWA
Segundo a Google, os Progressive Web Apps são aplicativos da web que foram projetados para serem capazes, confiáveis e instaláveis. E para que um aplicativo PWA funcione e cumpra essas características, é necessário a aplicação de algumas tecnologias.
Sendo as quatro principais tecnologias:
Acesso à tela inicial
Um dos principais requisitos para os PWAs é que eles estejam disponíveis para instalação direta em um site que já foi visitado, sem a necessidade de uma loja de aplicativos. Para que o Chrome mostre o prompt Adicionar à tela inicial, o aplicativo precisa fornecer um arquivo manifest.json.
Este é um arquivo JSON com informações sobre o PWA e permite que seu desenvolvedor controle como ele é iniciado e como ele é exibido.
Nele, é possível definir propriedades como o nome do aplicativo, especificar ícones da tela inicial e cores primárias, a página a ser carregada quando o aplicativo for iniciado, orientação padrão da tela etc.
Suporte offline
O suporte offline é o que torna o PWA diferente dos aplicativos comuns. É um arquivo JavaScript que é executado em segundo plano independentemente do navegador e separado de uma página da web.
Eles têm a capacidade de interceptar e manipular solicitações de rede, armazenar em cache ou recuperar recursos do cache e entregar mensagens push conforme necessário.
Isso permite que o PWA mostre dados recuperados em sessões anteriores quando um usuário não está conectado à Internet ou, alternativamente, mostre o shell do aplicativo e informe ao usuário que eles não estão conectados.
Em seguida, quando o usuário estabelecer uma conexão de rede posteriormente, o aviso será desativado e os dados mais recentes serão recuperados. Além disso, ao armazenar em cache todos os recursos estáticos com o responsável pelo serviço, ele poderia reduzir drasticamente as solicitações de rede e melhorar o desempenho consideravelmente.
TLS (Transport Layer Security)
Esse é um dos pré requisitos usados para garantir a segurança dos dados. Para implantar o trabalhador de serviço em um site, basta ter o HTTPS configurado no servidor. Isso se deve à capacidade do trabalhador de serviço de sequestrar conexões e fabricar e filtrar respostas.
Por esse motivo, e para proteger a integridade dos dados, você só pode registrar funcionários de serviço em páginas veiculadas por HTTPS.
Arquitetura de shell de aplicativo
Uma arquitetura de shell de aplicativo (ou app shell) é uma forma de se criar um Progressive Web App que carrega de forma confiável e instantânea na tela do usuário, muito parecido com o que se vê em aplicativos nativos. O shell do aplicativo é o HTML, CSS e JavaScript mínimos necessários para alimentar a interface do usuário do PWA.
Para garantir bom desempenho e tempos de carregamento rápidos, os arquivos do shell do aplicativo devem ser armazenados em cache na primeira visita usando o responsável pelo serviço, para que possam ser carregados rapidamente em visitas repetidas.
Sempre que o usuário abrir o aplicativo, os arquivos do shell serão carregados do cache do dispositivo local e o PWA precisará recuperar apenas os dados necessários, em vez de carregar tudo.
Essa abordagem permite que os usuários tenham experiências mais rápidas, principalmente quando ele retorna ao aplicativo, e permite navegação e interações nativas iguais aos aplicativos offline.
O ideal é que o shell do aplicativo seja o mais simples possível, mas, que tenha incluso conteúdo suficiente no download inicial. Um shell de aplicativo deve principalmente:
- Carregar rápido
- Usar o mínimo de dados possível
- Usar ativos estáticos de um cache local
- Separar conteúdo da navegação
O Google rastreia sites PWA ?
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. Um novo URL pode ser criado para o PWA, para que o Googlebot vá em frente e rastreie a página como faria em qualquer outra página publicada na Web.
Ou seja, o Google rastreia sites do PWA da mesma forma que rastreia um site AJAX ou JavaScript, mas há alguns problemas que podem impactar a rastreabilidade.
Portanto, os desenvolvedores precisam estar cientes de como otimizar o site para garantir que a página seja indexada adequadamente.
Práticas de SEO usadas em PWA
John Mueller, analista sênior de tendências para webmasters do Google, forneceu uma atualização detalhada sobre como o Google lida com sites PWAs e JavaScript em geral em março de 2016.
- Não se esconda no Googlebot. É importante que o desenvolvedor use a técnica de detecção de recursos e aprimoramento progressivo para que todos os usuários tenham acesso ao conteúdo. Também não é uma boa ideia redirecionar para uma página do navegador não suportada.
- Use rel = canonical ao veicular conteúdo de vários URLs para que você não seja culpado de violações de conteúdo duplicado.
- Evite o esquema de rastreamento AJAX em novos sites.
- O Googlebot não indexará URLs com # neles. Muitos aplicativos Web progressivos usam o símbolo de hash em sua estrutura de URL , o que significa que os mecanismos de pesquisa eliminarão tudo além do #. A única maneira de contornar isso é implementar uma estrutura de URL usando as regras tradicionais de SEO. Isso pode ser complicado para alguns sites e empresas, mas é uma etapa necessária à medida que avançamos.
- Teste para ver como o Googlebot vê a página. Você pode usar a ferramenta Buscar e renderizar do Google Search Console para ver seu site exatamente da maneira que o Google o vê.
- Verifique se os recursos necessários não estão bloqueados pelo robots.txt.
- Reduza o número de recursos incorporados na página (especialmente o número de arquivos JavaScript necessários para renderizar a página), pois esses podem não estar totalmente carregados.
- Use um arquivo de mapa do site preciso para sinalizar qualquer alteração no seu site ao usar o AMP (Accelerated Mobile Pages) .
- Lembre-se de que alguns mecanismos de pesquisa e provedores de serviços da Web que acessam conteúdo podem não suportar JavaScript ou podem suportar um subconjunto diferente.
Afinal, como o PWA ajuda o SEO?
Os aplicativos PWA são ótimos para SEO, pois eles podem oferecer as melhores experiências na Web para o usuário. Veja como ele pode influenciar diretamente nos resultados da sua empresa.
Pesquisa Orgânica
Um PWA, pode, de fato melhorar significativamente seu perfil de pesquisa orgânica, tornando a experiência do usuário melhor do que em sua concorrência. Bem, pelo menos, melhor do que era antes de atualizar para um aplicativo da web progressivo.
Quando você oferece uma ótima experiência do usuário, as pessoas desejam visitar seu site sobre as opções concorrentes. Quando eles veem sua marca nos resultados, lembram que você deu o que eles queriam e a experiência foi positiva.
Os SEOs sabem que a taxa de cliques influencia a posição da pesquisa . Mais cliques ou votos dos pesquisadores para obter um resultado e, com o tempo, ele sobe.
Mas essa é apenas uma métrica que você pode medir. Todas as pequenas coisas que você faz para melhorar o seu site criam a experiência que se eleva acima das informações. Isso influenciará indireta e diretamente seu SERPS e, normalmente, em uma direção positiva.
Velocidade do Site
Este é sem dúvida um dos recursos mais interessante do PWA, principalmente porque as empresas podem segmentar usuários que possam estar em uma conexão de dados lenta ou mesmo aqueles que estão offline com um PWA.
Sendo assim, a maior vantagem dos PWAs é a maior velocidade em comparação com outras plataformas móveis e aplicativos nativos. E não é apenas o Google que exige sites mais rápidos, mas os próprios usuários.
Pesquisas mostram que 53% das visitas são abandonadas se um site móvel demorar mais de 3 segundos para carregar.
A Forbes viu uma grande melhoria de velocidade depois de mudar para os PWAs, reduzindo a velocidade de carga móvel de 3 a 12 segundos, até 0,8 segundos.
Portanto, para garantir que sua marca esteja o mais próximo possível do topo da lista de pesquisa do Google, é hora de pensar no PWA como uma estratégia.
Maior envolvimento dos usuários
Uma experiência suave do usuário, incluindo navegação fácil, notificações por push oportunas, compatibilidade entre navegadores, páginas responsivas em todos os dispositivos, são alguns requisitos importantes que também levam a um aumento no envolvimento.
Além disso, um PWA pode ser salvo na sua tela inicial, onde aparecerá como um ícone no dispositivo, mas não precisará passar pelo processo de download da loja de aplicativos. E como não há download, os PWAs exigem menos armazenamento que os aplicativos móveis nativos.
Continuando com o exemplo da Forbes, em seu PWA, os usuários eram notificados toda vez que novo conteúdo estava disponível por meio de notificações push.
Com tempos de carregamento de página extremamente rápidos, transições rápidas e design de página leve. O PWA da Forbes gerou resultados promissores, pois o envolvimento dobrou para leitores avançados e triplicou para leitores casuais.
Conclusão
Os Progressive Web Apps marcam uma nova tendência na geração de interatividade online, além de fornecerem uma nova experiência ao usuário.
Por ser uma nova tecnologia, as empresas que desenvolvem essas novas interfaces de aplicativos, precisam estar cientes das limitações existentes à página que está sendo indexada pelo Google e garantir que estejam codificando corretamente.
Mas, com as práticas de SEO corretas, a empresa pode desenvolver uma forte presença online com o site existente, para que os usuários que procuram informações possam encontrar o site ou a marca facilmente.
