Blog
Início » Como funciona o PageSpeed Insights do Google?
jun 07, 2017 |

Como funciona o PageSpeed Insights do Google?

icone google pagespeed insights

Hoje, vamos falar um pouquinho sobre essa ferramenta : o PageSpeed Insights.Mas antes de falarmos dele, precisamos saber um pouquinho sobre o Google Search Console.

Resumidamente, como já vimos em posts anteriores,  o Google Search Console é uma ferramenta simples e fácil de ser utilizada.

Com apenas alguns clicks você consegue visualizar o seu site como um todo ou apenas uma parte específica. Claro, visando seu status e possíveis otimizações.

Para saber mais sobre a ferramenta, sugiro a leitura do nosso post sobre O que é o Google Search Console. Eu espero você voltar aqui, não se preocupe. ; )

Assim como foi dito no post, ele tem uma série de funcionalidades suuuper interessantes para você monitorar o seu site!

Conheça as principais clicando aqui e lendo  nossos dois posts que tratam sobre suas funcionalidades (Primeira parte, Segunda parte).

O importante é que você entenda sobre o que estamos conversando. Para que fique claro a importância do uso do PageSpeed Insights. : D.

 

Podemos prosseguir? Ótimo  ^-^

 

O que é o PageSpeed Insights?

 

Imagem do menu da Ferramenta.

 

O PageSpeed Insights é uma ferramenta do Google Search Console que irá acessar e processar cada elemento do seu site, gerando uma nota para o mesmo.

Como? Avaliando-o em alguns requisitos que são julgados importantes tanto para desktop quanto para mobile visando melhorar a experiência do usuário.

Esta ferramenta é voltada para fins de SEO . Caso você não saiba o que é SEO ou qual sua importância, também temos artigo falando sobre isso bem aqui.

 

Será que essa nota atribuída ao site é baseada puramente em uma codificação perfeita da sua página web?

 

Não, ela vai levar em conta diversos aspectos que influenciam a experiência do usuário. Feito essa avaliação , o PageSpeed Insights irá retornar uma nota, a qual é classificada de 0 a 100. E claro que junto a ela, os erros que foram encontrados.

Esses erros não de fato erros, mas são recomendados para melhorar a experiência do usuário. Afinal, se fossem realmente erros, seu site não ia rodar direitinho né rs.

Menu de melhorias da ferramenta para mobile e desktop.

 

Regras de Avaliação do PageSpeed Insights

 

Exemplo de regras do PageSpeed Insights.

 

Aproveitar cache do navegador : Ele irá apontar quais pontos não estão sendo inseridos com um tempo de duração coerente.  

Dessa forma, o usuário terá um acesso mais rápido ao seu site.  Uma vez que já tem grande quantidade dos arquivos previamente baixados no seu aparelho.

Isso poupa  muito o consumo de dados para o mobile e aumenta o desempenho, independente do aparelho.

 

Ativar compactação: Você tem que ativar a compactação utilizando o cabeçalho HTTP. A compactação usa arquivos menores, que consomem menos dados para baixa-los fazendo o carregamento do site mais rápido.

 

Eliminar JavaScript e CSS de bloqueio de renderização no conteúdo acima da borda: Vamos tratar disso mais adiante. Não se preocupe.  : )

 

Evitar redirecionamentos da página de destino: Redirecionamentos de página são  requisições que atrasam o carregamento da página. Isso ocorre por serem realizados via HTTP.

Então a cada redirecionamento que você tiver a mais, vai ser uma nova requisição. Por isso é bom evitá-las. ; )

 

Otimizar imagens: Você vai redimensionar a imagem em medidas “aceitáveis” caso ela seja muito grande. É possível utilizar softwares para mexer nos pixels da imagem sem diminuir perceptivelmente sua qualidade também.

 

Priorizar o conteúdo visível:  É recomendado que você tenha o carregamento estritamente necessário do CSS e dos  scripts no header. Chamando os que sobrarem apenas no footer.

E acredite, funciona! Pois vocês está facilitando o carregamento do conteúdo que vem antes.

No entanto, não é um erro. Apenas busca melhorar a experiência do usuário deixando o carregamento mais rápido.

 

Reduzir o tempo de resposta do servidor:  Você deve analisar em que ponto  está o atraso de resposta do servidor.  

O uso de ferramentas de monitoramento de tráfego web podem ajudar você a resolver seu problema. (Claro que utilizar um servidor estrangeiro não ajuda né)

 

Menu do PageSpeed Insights

 

Agora suponho que você deva estar se perguntando como é a plataforma. Vamos então fazer um passo a passo para ter uma visão geral dele. Logo abaixo você poderá ver como é feita a classificação das regras do site.

Menu de regras nas quais seu site foi aprovado.

A aba verde indica quais as regras do PageSpeed Insights que o site já obedece. Ou seja, toda vez que seu site for aprovado em uma nova regra, você poderá ver aqui.

Regras que precisam de melhoria no seu site.

A aba amarela indica os possíveis erros que podem e devem ser corrigidos mas que não estão causando um impedimento grave de acesso.

As regras nas quais não está aprovado podem ser causadas por mais de uma ocorrência do mesmo erro. Fazendo com que você tenha que repetir mais de uma vez o processo de resolução do erro.

 

Compactação e os arquivos CSS, HTML e JavaScript

 

A compactação dos arquivos de modo geral, deve ser efetuada. Mas, por quê? Porquê ela irá diminuir o tamanho dos arquivos.

Essa diminuição aumentará o desempenho na hora que os arquivos forem carregados no servidor e posteriormente baixados pelo usuário ao acessar o site.

A questão é, como compactar esses arquivos? De uma maneira prática, você pode começar habilitando a compactação no seu servidor utilizando o cabeçalho HTTP.

Ele permite a compactação de um leque de extensões diferenciadas. No entanto, existem alternativas específicas para a compactação de arquivos com extensões CSS, HTML ou JavaScript.Existem determinadas versões on line de alguns softwares usados para isso.

O PageSpeed Insights recomenda o cssmin.js para CSS  e o Closure Compiler  para JavaScript. Esses programas têm uma versão online gratuita para uso. Já para HTML, ele recomenda utilizar uma extensão própria do PageSpeed Insights.

Usando o de CSS e o de JavaScript, basicamente, você vai pegar todo seu código, copiar e colar ele na plataforma, rodar o algoritmo, e pronto. Difícil? Nem um pouco. : D

 Após isso, basta colar o código de volta no seu arquivo e você terá diminuído o tamanho de todos os arquivos que precisar.

Ou seja, para conseguir subir sua nota no PageSpeed Insights, você precisa desenvolver seu site ou otimizá-lo visando melhorar a experiência do usuário.

Não é uma otimização voltada a melhoria do seu site para que os motores de busca o coloquem seu site em um ranking melhor. O seu melhor ranqueamento será apenas o fruto de você melhorar o seu site para os usuários.

 

Gostaram do post? Conte para nós o que achou nos comentários! Ou se tem alguma dúvida entre em contato com a gente!

 

Até a próxima. : D

 

 

Estudante de Análise e Desenvolvimento de Sistemas na Universidade Presbiteriana Mackenzie e Assistente de Desenvolvimento na Empresa de Estratégias Digitais NoTopo.

..

Deixe uma resposta

O seu endereço de e-mail não será publicado.