Este manual ajuda a explicar as 5 principais questões envolvidas na otimização de velocidade e desempenho dos sites em dispositivos móveis.
1. Por Que Se Importar Com a Velocidade?
Os consumidores estão cada vez mais dependentes dos celulares e smartphones para realizar suas transações digitais. Pesquisas, entretenimento, estudos e compras – tudo isso e muito mais são atividades realizadas diariamente pelas pessoas, o que certamente inclui os clientes e público-alvo da sua empresa.
Especialmente para empresas que anunciam nos Links Patrocinados do Google Ads, a velocidade é ainda mais importante. Imagine que os clientes clicam nos anúncios, mas ao chegar às páginas de destino, dão de cara com um site lento, e acabam desistindo. Ou seja, a empresa pagou por este tráfego, mas não conseguiu nem mesmo que os clientes vissem a página de destino totalmente carregada. Dinheiro jogado na lata de lixo!
Sim, os clientes estão muito exigentes, e não estão dispostos a esperar muito. Um estudo da Ericsson mostrou que a espera pode gerar estresse nos usuários. Este estresse pode ser maior do que esperar em uma fila ou resolver uma difícil equação de matemática.
E esta frustração é péssima para os negócios. Segundo o Google Ads, para cada segundo de atraso no carregamento de um site mobile, as conversões podem cair em até 20%.
Por isso, é importante realizar auditorias para estimar e otimizar a velocidade de carregamento das páginas mobile. Há empresas que relataram aumento de 10% nas conversões após esta auditoria.
2. O Que É Definido Como Velocidade do Site?
O que pode ser definido como velocidade? É importante ter em mente que o carregamento de uma página e a velocidade associada são divididos em vários processos. Ou seja, não é o simples fato de iniciar a cronometragem quando a página começa a carregar e interromper o cronômetro quando a página termina o carregamento.
Há diversas etapas durante o processo de carregamento. E isto pode afetar diretamente os usuários quanto ao que eles encaram como sendo “rápido”.
Portanto, não encare a velocidade como sendo uma única métrica. Ao falarmos sobre velocidade do site mobile, precisamos pensar em todos estes processos.
Processo 1
- A página começou a carregar?
- O servidor respondeu?
Processo 2
- Já existe suficiente conteúdo renderizado, permitindo que os usuários comecem a interagir com ele?
Processo 3
- O conteúdo principal da página já está disponível, ainda que alguns elementos secundários não tenham sido carregados?
Processo 4
- O carregamento foi completo, permitindo que as interações sejam naturais e tranquilas?
- Não existem atrasos (lags) durante a comunicação?
É importante definir uma métrica para cada um destes processos. Especialmente se você anuncia no Google Ads, é importante avaliar quando a oferta do seu Link Patrocinado surge na tela do usuário. Por exemplo, se a oferta só aparecer no Processo 4, pode ser tarde demais.
3. Como Medir a Velocidade do Site?
“Se meu site carrega rápido para mim, então, ele deve ser rápido para os clientes”. Este é um mito que pode prejudicar a eficácia do seu site mobile. Por que podemos dizer que se trata de um mito?
É preciso termos em mente que os dispositivos e as redes nas quais os desenvolvedores testam os sites são, na maioria das vezes, mais rápidos que a realidade vivenciada pelos usuários.
É por isso que existem dois campos de métricas para esta medição: dados de laboratório e dados de campo.
- Dados de Laboratório: são os dados coletados em um ambiente controlado, muitas vezes, com redes e dispositivos mais rápidos;
- Dados de Campo: são os dados capturados da verdadeira experiência dos usuários no mundo real.
Cada qual oferece suas próprias vantagens e desvantagens.
Ao realizar testes em campo, é importante avaliar que as circunstâncias dos clientes mudam de uma hora para outra. Por exemplo, imagine que um usuário tenha uma conexão 4G. No entanto, ao entrar em um elevador, ou ao viajar, pode ser que ele enfrente oscilações na sua conexão.
Ferramentas Para Medir Velocidade
Algumas ferramentas úteis para obter Dados de Laboratório.
- Lighthouse: executa diversos testes no seu site e apresenta os resultados em um relatório. São apresentados sugestões de melhoria para otimizar o desempenho, sua acessibilidade, SEO, e outras práticas recomendadas.
- WebPageTest: permite comparar o desempenho de diversas páginas, em vários locais do planeta. Ao realizar o teste, é possível selecionar cidades e navegadores.
Com relação a ferramentas para obter Dados de Campo, uma boa sugestão é a seguinte:
- CrUX (Chrome User Experience Report): os dados apresentados nos relatórios são extraídos de usuários reais. Os dados são coletados de usuários do Chrome.
Mas também existem ferramentas que oferecem, em seus resultados, Dados de Laboratório e Dados de Campo. Como sugestão:
- PageSpeed Insights: é uma ferramenta que reúne dados de outras duas ferramentas (LightHouse e CrUX). Por isso, ele consegue apresentar dados de campo e de laboratório.
- Test My Site: apresenta o desempenho do site em diversos dispositivos. Além disso, oferece sugestões para otimização.
Lembre-se também de verificar a velocidade dos sites dos seus concorrentes. Assim, você terá parâmetros mais claros para comparar com o desempenho do seu website.
4. Como Deixar Meu Site Mais Rápido?
Além disso, não podemos esquecer do AMP (Accelerated Mobile Pages). O AMP é um projeto de código aberto. Como subentendido pelo seu nome, seu objetivo é melhorar a internet por meio de páginas mais rápidas em todos os dispositivos, incluindo os aparelhos mobile. Páginas AMP tem o potencial de carregar instantaneamente.
Deseja criar sua primeira página AMP? Acesse aqui.
E não são apenas páginas de destino mais rápidas. Com o AMP, você consegue criar anúncios de Links Patrocinados que são carregados muito mais rápido que os tradicionais. Isto é feito por meio dos anúncios AMPHTML. Sua rapidez se deve ao fato de que a solicitação do carregamento é feita mais cedo na renderização. Além disso, um arquivo AMPHTML é mais leve que os arquivos gráficos dos anúncios tradicionais.
Além disso, as ferramentas sugeridas acima ajudam a deixar seu site mais rápido. Por exemplo, o LightHouse apresenta uma pontuação para cada uma das métricas, e fornece uma lista de sugestões para otimizar seu site mobile.
5. Como Continuar Rápido?
Este é outro desafio enfrentado pelas empresas. Não basta otimizar o site mobile em uma única ocasião e ponto final.
Lembre-se: as tecnologias mudam a cada dia. Navegadores são atualizados, novos códigos são implantados nos sites, processos de renderização são otimizados.
Por exemplo, surgem formatos de imagem que oferecem maior compactação em relação aos tradicionais PNG e JPG. Os formatos JPEG 2000, JPEG XR e WebP são exemplos disso.
Assim, seu site mobile pode estar rápido hoje, mas talvez amanhã, a realidade seja diferente.
Por este motivo, otimização de websites não deve ser uma tarefa ocasional, mas sim, um comportamento padrão da empresa. Se você anuncia no Google Ads, isto é ainda mais importante. Afinal, você não deseja pagar por um tráfego e, depois, perdê-lo por causa de uma página de destino pesada e lenta.
Por isso, uma boa prática é criar um programa de análise da velocidade do seu site, com apresentação regular de relatórios de desempenho. Se necessário, reserve um orçamento mensal para ser continuamente aplicado à otimização de suas páginas.
Seus clientes, e seu bolso, vão agradecer.
