Uma nova ferramenta do Google é testar e dar a você a recomendação de melhorar o desempenho, o SEO, a segurança, as práticas recomendadas e a acessibilidade.
O Google lançou recentemente o Lighthouse, uma ferramenta de código aberto para auditar seu site de maneira manual e automática.
O que é o Google Lighthouse?
O Lighthouse é uma ferramenta automatizada que aprimora a qualidade dos apps da Web. Ele pode ser executado como extensão do Chrome ou por linha de comando (NodeJS).
O Lighthouse simula diversas situações que podem afetar a experiência do usuário. Ele executa uma série de teste na página e gera um relatório sobre o desempenho.
No relatório final, você poderá usar os testes que apresentaram falhas como indicadores do que pode ser melhorado no seu site.
Quais métricas são testadas pelo Google Lighthouse?
Existem mais de 75 métricas que são testadas e fornecem pontuação geral. Alguns dos seguintes populares você pode estar interessado em como proprietário de um site, analista de SEO, webmasters.
- Desempenho: tempo para interativo, latência, índice de velocidade, otimização de recursos, TTFB, entrega de ativos, tempo de execução de scripts, tamanho do DOM, etc.
- SEO: Mobile friendly, meta, rastreamento, canônico, estrutura, etc.
- Melhores práticas: Otimização de imagem, bibliotecas JS, registro de erros do navegador, acesso via HTTPS, vulnerabilidades conhecidas do JS, etc.
- Acessibilidade: Elementos da página, idioma, atributos ARIA, etc.
- PWA (Progressive Web Application): redireciona HTTP para HTTPS, código de resposta "ok", carregamento rápido em 3G, tela inicial, viewport, etc.
Se você for um desenvolvedor, poderá usá-lo com o Node.js para executar um teste de maneira programática. Já existem poucas ferramentas no mercado alimentadas pela Lighthouse, que oferecem monitoramento contínuo do desempenho do site.
O relatório do seu site fornecerá uma análise abrangente dos seguintes itens:
- Desempenho: quão rápido está o desempenho do seu site (por exemplo, com que rapidez as páginas estão sendo carregadas, etc.)?
- Progressive Web Application: o seu site fornece uma experiência moderna e semelhante a um aplicativo para os visitantes?
- Acessibilidade: quão acessíveis são as suas páginas da Web? Quais são as suas vulnerabilidades?
- Melhores práticas: o seu site está de acordo com as práticas recomendadas do Google?
- SEO: você precisa revisar ou melhorar o seu SEO para ajudar o seu site a ter melhor classificação?
Vamos descobrir como você é capaz de fazer com o Lighthouse?
Análise com web.dev
O Google lançou o web.dev há alguns meses e ganhou grande popularidade. A ferramenta permite testar seu site de forma fácil.
Vá para a página Web.dev e insira a URL para executar a auditoria. Levará alguns segundos e você deverá ver os relatórios detalhados com a pontuação geral.
Os resultados também mostram o teste de métricas de sucesso, assim como feito para as auditorias aprovadas e o trabalho sobre essas necessidades de atenção.
Não gaste seu tempo para chegar na pontuação 100, os sites do Google não pontuam isso.
Considere-os como diretrizes e tente melhorar o máximo que puder.
[ create-campaign bg_images="https://static.semrush.com/blog/uploads/media/c7/6a/c76aee09eb580b59e6db54c1cf0751a4/banner.png" bg_button="-success" header="Confire a saúde do seu site" text="com SEMrush Site Audit"]
Análise com Chrome
Você sabia que o Lighthouse está disponível em seu navegador Chrome? E a ótima notícia é que você pode optar por analisar usando o Mobile ou o Desktop.
- Abra o navegador Chrome;
- Acesse o site que deseja analisar;
- Abra as ferramentas do desenvolvedor (pressione F12 se estiver usando o Windows) ou clique com o botão direito do mouse na página e clique em Inspecionar;
- Vá para a aba de auditorias.
Como você pode ver, tem a opção de escolher o que deseja testar. Isso é ótimo, pois você pode se concentrar em seu objetivo e obter os resultados da auditoria mais rapidamente e específicas.
Em relação ao Design/Aparência o Chrome e o web.dev são quase semelhantes. Mas, se você observar com atenção, há um grupo de métricas extras - o Progressive Web App. Então aí está um motivo para auditar usando o Chrome.
Instalando o Lighthouse no Ubuntu
A instalação desse tutorial eu testei em um servidor Ubuntu 19.04 local. O Lighthouse requer o Node LTS 8.9 ou posterior.
Você também exigirá que o navegador do Chromium seja instalado no servidor.
Necessário: Node LTS 8.9+ e Chromium.
A instalação do Lighthouse é direta, como você faz com outros módulos, veja:
Atualizar nosso índice de pacotes primeiro:
# sudo apt-get update
Instala o NodeJS
# sudo apt-get install nodejs
Instala o NPM
# sudo apt-get install npm
Para instalar o Lighthouse:
# npm install -g lighthouse
Estou usando -g aqui para que seja instalado como módulo global.
Depois de instalado, execute o comando lighthouse para garantir que ele tenha sido instalado corretamente.
Para executar um teste usando um navegador sem cabeçalho digite:
# lighthouse URL --chrome-flags="--headless"
É preciso fornecer a URL absoluta, incluindo http ou https.
Na segunda última linha, você pode ver que imprimiu o caminho onde posso encontrar o relatório. Por padrão, ele gerará um relatório em formato HTML, que você pode visualizar baixando em seu PC ou servindo-o através de algum servidor web.
Mas, e se você tiver que gerar um relatório no formato JSON ?
É factível como o seguinte.
# lighthouse URL --chrome-flags="--headless" --output json --output-path URL.json
Usando o Lighthouse CLI, você tem total controle para usar da maneira que quiser. Eu recomendaria fortemente verificar o repositório do GitHub para saber mais sobre como usar o CLI ou programaticamente.
Por que o Lighthouse deve fazer parte do seu teste regular do site?
O que o Lighthouse faz é testar os aspectos de web design que o Google considera críticos. A partir desses resultados, você receberá conselhos sobre como corrigir problemas para melhorar o seu desempenho, o que deve resultar em melhores classificações no Google.
Aqui estão algumas razões pelas quais você deve ter o Lighthouse:
- Facilidade de uso: se você é novato, o SEO e métricas de segurança e desempenho podem ser confusas. O Lighthouse é simples de usar, e você pode analisar o seu site com um clique.
- Itens acionáveis: quando o Lighthouse detecta um problema, ele fornece um checklist para correção, a fim de melhorar o desempenho. Geralmente, os relatórios apontam para seções específicas e até mesmo linhas de código que podem ser corrigidas ou melhoradas.
- Atualizado continuamente: o Lighthouse é continuamente atualizado pelos desenvolvedores do Google para garantir que os padrões mais recentes da Web sejam testados. Você não precisa se preocupar com essa ferramenta usando diretrizes desatualizadas, pois quem faz as diretrizes é quem atualiza o programa.
[ create-campaign bg_images="https://static.semrush.com/blog/uploads/media/a4/4f/a44f7a6614c3ee4fc6b627878d5be0ee/website-performance-research-semrush-2018-back-banner.png" bg_button="-success" header="Avalie o desempenho do seu site" text="com Site Audit da SEMrush"]
Conclusão
O Google Lighthouse é uma ótima ferramenta para realizar testes de desempenho, usabilidade e segurança.
Independente a plataforma a ferramenta pode ser útil, recomendo que faça os testes e otimize seu site o quanto antes.
Uma das maiores dores de cabeça para os webmasters é tentar criar um site que atenda a todos os padrões do Google, especialmente porque esses fatores mudam regularmente. Felizmente, o Google Lighthouse permite que você teste o seu site com base em métricas consideradas essenciais pelo Google, e você recebe um checklist para ajudar a melhorar o desempenho do seu site.
Com o Lighthouse, você pode melhorar a velocidade, a acessibilidade e a funcionalidade móvel do site enquanto faz ajustes para garantir que seu site atenda às práticas recomendadas.
Inscreva-se para o Webinar "Tendências de Linkbuilding 2019: Mesa Redonda"