Blog

Mudanças no Pagespeed: entenda algumas solicitações do Lighthouse

mudança do pagepeed e lighthouse
Recentemente o Google uniu o relatório do Lighthouse para o calculo do Pagespeed, e com isso houve uma mudança drástica na pontuação de velocidade especialmente no mobile.entenda o lighthouse
Como muitos desconfiavam, a usabilidade se tornou um tema extramente relevante para a otimização de sites para a busca orgânica, e conseguimos ver isso exatamente com os dados apresentados no Lighthouse.
Unimos nossos analistas de SEO e a equipe de programação, para listar os ajustes solicitados que são mais “fáceis” de se aplicar dentro de um site. Confira o que separamos do relatório do Lighthouse para você aplicar em seu site:

1- Adiar Imagens fora da tela

Aplicar o Lazy-load, é uma funcionalidade carrega apenas o necessário da página, e adia os outros conteúdos que não são necessários no momento.

O que seria Lazy-Load?

Um site normalmente é carregado todo de uma vez, o lazy-load carrega apenas a parte visível ao usuário, diminuindo assim o tempo de carregamento.

2-Disponibilize imagens em formatos de ultima geração

Salvar as imagens em formato JPEG 2000 (JP2) , JPEG XR e WebP.

O que seria imagens de ultima geração?

É um formato de imagem que diminuir o tamanho dos arquivos e garante a transferência mais rápida de dados, facilitando o carregamento em uma internet mais lenta.
Existem diversas ferramentas no mercado que possuem a opção de salvar as imagens nas opções mencionadas acima, aqui na agência  por exemplo, utilizamos o Photoshop.

3- Pré-carregue as principais solicitações

<link rel=preload>
Declare os links de pré-carregamento em seu HTML para instruir o navegador a fazer o download dos principais recursos o quanto antes.
<head>
  …
  <link rel=”preload” href=”styles.css” as=”style”>
  <link rel=”preload” href=”ui.js” as=”script”>
  …
</head>

O que seria a tag preload?

Está tag fornece ao navegador uma sugestão sobre o que deve ser carregado primeiro para melhorar a experiência do usuário. aplicando a técnica correta, podemos fazer com que a página carregue mais rápido com as funções iniciais necessárias.

4- Alteração do carregamento da fonte

Garanta que o texto continue visível durante o carregamento da webfont, incluir as fontes padrões antes do carregamento da webfont.

Como aplicar a alteração do carregamento da webfont?

É preciso aplicar uma regra de CSS chamada @font-face. Nesta regra você fala para o navegador carregar uma fonte padrão, enquanto não carrega a webfonte.

@font-face {
  font-family: 'Arvo';
  font-display: auto;
  src: local('Arvo'), url(https://fonts.gstatic.com/s/arvo/v9/rC7kKhY-eUDY-ucISTIf5PesZW2xOQ-xsNqO47m55DA.woff2) format('woff2');
}

Página de orientação:  https://developers.google.com/web/updates/2016/02/font-display

 

Precisando de auxilio no Marketing Digital da sua empresa? 

agencia-de-links-patrocinados-e-seoA DGAZ é uma Agência focada em Marketing Digital. Somos uma Especialistas em SEO e Google Partner Premierou seja toda nossa equipe é certificada pelo Google.

Nossa meta é gerar resultados para sua empresa. Entre em contato conosco e conheça nossa metodologia:

– Orçamento Online para SEO

– Orçamento Online para Links Patrocinados

– Orçamento Online para PPT

Confira outros Artigos:

Shopping Basket