Posts Recentes:

Ai Pin lançado com integração do Google Fotos

A Humane está lançando o Ai Pin, um...

Google Chrome muda a forma de acessar Favoritos, Lista de Leitura e Histórico

Surfando na onda da personalização, o Google Chrome...

IA da Samsung chegará ao Galaxy S21 e outros modelos em breve

Depois de lançar seus novos recursos de inteligência...

Como Melhorar e Monitorar a Interação com o Next Paint por DebugBear


Como melhorar e monitorar a interacao com o Next Paint

O Google anunciou que a nova métrica Interaction to Next Paint (INP) se tornará uma das três métricas Core Web Vitals em 12 de março de 2024. Ela está substituindo a antiga métrica First Input Delay.

Isso marca a maior mudança nos sinais vitais da web desde que o Google os introduziu pela primeira vez como um fator de classificação em 2021.

O que é interação com o próximo Paint?

Cada uma das três métricas Core Web Vitals mede um aspecto diferente da experiência que os usuários têm em seu site. O INP avalia a rapidez com que seu site responde às interações do usuário.

Por exemplo, se um visitante clicar em um botão em seu site e levar um segundo para que o conteúdo atualizado da página seja renderizado, isso representa uma experiência ruim para o usuário.

A interação com o próximo Paint mede quanto tempo decorre entre a interação do usuário e a próxima vez que o navegador pode atualizar o conteúdo da tela. Quanto mais processamento de CPU for necessário para lidar com a interação e exibir o novo conteúdo, pior será a pontuação INP.

Classificação de pontuação INP

A interação com o próximo afeta as classificações do Google?

O Google confirmou que Core Web Vitals é um fator de classificação. Isso significa que se o seu site tiver um desempenho pior na pontuação INP, ele poderá ter uma classificação inferior à dos concorrentes que tenham um bom desempenho em todas as três métricas do Web Vitals.

Para obter uma boa pontuação, o INP deve estar abaixo de 200 milissegundos. Um atraso de mais de 500 milissegundos é considerado ruim. Seu SEO é gradualmente afetado à medida que o INP piora entre os limites Bom e Ruim.

Como o Google sabe a rapidez com que seu site responde às interações do usuário? Esses dados são coletados de usuários reais do Chrome como parte do Relatório de experiência do usuário do Chrome (CrUX).

Diagrama de interação com o próximo Paint

Como testar a interação com o Next Paint em seu site

Quer descobrir o desempenho do seu site na métrica INP e em outros Core Web Vitals? Executar um teste gratuito Core Web Vitals em seu site é uma maneira rápida de verificar. Basta inserir o URL da página e aguardar o resultado do teste.

A interação real do usuário com os dados do Next Paint pode ser encontrada no Sinais vitais da web aba. A tendência de 25 semanas permite saber se a página está melhorando ou piorando com o tempo.

Os dados mostrados aqui vêm do relatório Google CrUX.

Histórico de dados do Google CrUX

Para obter uma visão mais ampla dos diferentes grupos de páginas do seu site, você também pode verificar a guia Core Web Vitals no Google Search Console. Aqui você verá quantas páginas são afetadas por problemas de INP ou não passam na avaliação Core Web Vitals.

Interação com o Next Paint no Google Search Console

Infelizmente, os dados que o Google fornece não são muito sutis e, devido ao mecanismo de agrupamento de páginas, talvez você não consiga saber quais páginas específicas são afetadas pela interação lenta com o próximo Paint.

Os dados do Google CrUX também são agregados ao longo de 28 dias. Isso significa que você terá que esperar várias semanas para ver o impacto de qualquer otimização.

Para obter uma visão mais aprofundada, uma ferramenta dedicada de monitoramento Core Web Vitals de usuário real, como o DebugBear, pode ajudar. Dessa forma, você obtém dados detalhados do Core Web Vitals em todo o seu site, atualizados assim que uma alteração é implementada.

Painel DebugBear Core Web Vitals

Como você acelera as interações e melhora o INP?

Para melhorar as pontuações INP em seu site, você precisa saber qual processamento de CPU está envolvido na interação do usuário. O INP pode ser dividido em três componentes:

A guia desempenho no Chrome DevTools mostra quanto tempo demoraram as interações na página e o que foi responsável pelo processamento da CPU.

INP na guia Desempenho do Chrome DevTools

Os dados na guia de desempenho do DevTools podem ser difíceis de ler, então geralmente você desejará o envolvimento de um desenvolvedor. Mas fornece uma explicação para cada milissegundo que o navegador gasta ao lidar com o evento.

Por exemplo, você pode descobrir que:

O monitoramento real do usuário com DebugBear mostrará qual componente INP contribui mais para a baixa capacidade de resposta do seu site.

Detalhamento do componente INP

Você também descobrirá frequentemente que as interações demoram mais durante o processo de carregamento inicial do site. Isso ocorre porque quando uma página começa a carregar, muitas pequenas tarefas são executadas em segundo plano para configurar a página, por exemplo, carregar anúncios ou inicializar um formulário ou widget de chat.

O DebugBear mostra um detalhamento da rapidez das interações em diferentes estágios e da frequência com que as interações ocorrem nesses períodos de tempo (indicado pela altura da barra).

Detalhamento do estágio de carga INP

Se o seu site suportar a API Long Animation Frames, você também poderá ver scripts específicos e funções JavaScript que estão causando interações lentas para seus visitantes.

Dados de atribuição DebugBear INP

Como posso saber quais interações de páginas são afetadas pelo INP lento?

Se você deseja otimizar seu código e testar interações em seu site, você precisa saber com quais elementos os usuários interagem com mais frequência em seu site e quais interações geralmente causam INP lento.

Esses não são dados que você pode obter dos relatórios do Google CrUX, mas uma ferramenta dedicada de monitoramento do Core Web Vitals, como o DebugBear, coletará essas informações para você.

Detalhamento do elemento DebugBear INP

Você pode filtrar os dados por página, tipo de dispositivo e muitos outros fatores para entender melhor como os visitantes experimentam seu site. Os relatórios do DebugBear podem fornecer conselhos direcionados sobre como melhorar a interação com o Next Paint.

Como monitorar a interação com o Next Paint e outros Core Web Vitals

Uma solução de monitoramento de usuário real (RUM) pode ajudá-lo a se preparar para a nova métrica Interaction to Next Paint e ajudá-lo a manter o controle de seus Core Web Vitals ao longo do tempo.

Experimente o DebugBear com uma avaliação gratuita de 14 dias. Avalie continuamente os sinais vitais da sua web e veja quais páginas se beneficiariam mais com as otimizações.

Linha de tendência e histograma do DebugBear INP

Basta instalar o snippet analítico DebugBear para obter informações sobre as experiências dos visitantes. Evite o atraso de 28 dias que acompanha os dados vitais da web do Google e obtenha relatórios detalhados que você pode usar para oferecer uma melhor experiência no site e obter uma classificação mais elevada no Google.

DebugBear INP detalhado por página

Últimas

Ai Pin lançado com integração do Google Fotos

A Humane está lançando o Ai Pin, um...

Google Chrome muda a forma de acessar Favoritos, Lista de Leitura e Histórico

Surfando na onda da personalização, o Google Chrome...

IA da Samsung chegará ao Galaxy S21 e outros modelos em breve

Depois de lançar seus novos recursos de inteligência...

Gmail prepara ‘Assinaturas’ para dar fim à bagunça na caixa de entrada

Cansado de ter a caixa de entrada do...

Assine

spot_img

Veja Também

Ai Pin lançado com integração do Google Fotos

A Humane está lançando o Ai Pin, um...

Google Chrome muda a forma de acessar Favoritos, Lista de Leitura e Histórico

Surfando na onda da personalização, o Google Chrome...

IA da Samsung chegará ao Galaxy S21 e outros modelos em breve

Depois de lançar seus novos recursos de inteligência...

Gmail prepara ‘Assinaturas’ para dar fim à bagunça na caixa de entrada

Cansado de ter a caixa de entrada do...

Atualização da Busca não afeta os sistemas de indexação

Em meio a tantas dúvidas e questionamentos sobre...
spot_img

Ai Pin lançado com integração do Google Fotos

A Humane está lançando o Ai Pin, um dispositivo vestível que promete ser o seu assistente pessoal discreto e cheio de recursos incríveis....

Google Chrome muda a forma de acessar Favoritos, Lista de Leitura e Histórico

Surfando na onda da personalização, o Google Chrome está mudando a forma como acessamos funções como Favoritos, Lista de Leitura e Histórico....

IA da Samsung chegará ao Galaxy S21 e outros modelos em breve

Depois de lançar seus novos recursos de inteligência artificial, o Galaxy AI, a Samsung finalmente atendeu aos pedidos dos fãs e confirmou que...