Painel de auditoria de experiência experience-audit-dashboard
Saiba como a Auditoria de experiência valida seu processo de implantação e ajuda a garantir que as alterações implantadas atendam aos padrões básicos de desempenho, acessibilidade, práticas recomendadas e SEO, por meio de uma interface de painel clara e informativa.
Visão geral overview
A Auditoria de experiência valida o processo de implantação e ajuda a garantir que as alterações sejam implantadas:
-
Atenda aos padrões básicos de desempenho, acessibilidade, práticas recomendadas, SEO (otimização do mecanismo de pesquisa) e PWA (Aplicativo Web Progressivo).
-
Não introduza regressões.
A Auditoria de experiência no Cloud Manager garante que a experiência do usuário no site seja do mais alto padrão.
Os resultados da auditoria são informativos e permitem que o gerente de implantação veja as pontuações e as alterações entre as pontuações atual e anterior. Essa informação é valiosa para determinar se foi introduzida uma regressão com a implantação atual.
A Auditoria de experiência é viabilizada pelo Google Lighthouse, uma ferramenta de código aberto do Google, e é ativada em todos os pipelines de produção do Cloud Manager.
Disponibilidade availability
A Auditoria de experiência está disponível para o Cloud Manager:
- Pipelines de produção de sites, por padrão
- Desenvolvimento de pipelines de pilha completa, opcionalmente
- Pipelines de front-end de desenvolvimento, opcionalmente
Consulte a seção Configuração para obter mais informações sobre como configurar a auditoria para os ambientes opcionais.
As auditorias são executadas como parte do pipeline. As auditorias também podem executar sob demanda fora dos pipelines.
Configuração configuration
A Auditoria de experiência está disponível por padrão para pipelines de produção. Ele pode ser ativado opcionalmente para pipelines de pilha completa e front-end de desenvolvimento. Em todos os casos, é necessário definir quais caminhos de conteúdo são avaliados durante a execução do pipeline.
-
Dependendo do tipo de pipeline que você deseja configurar, siga as instruções para:
- Adicionar um novo pipeline de produção, se desejar definir os caminhos que serão avaliados pela auditoria.
- Adicionar um novo pipeline de não produção, se quiser ativar a auditoria em um pipeline de front-end ou de pilha completa de desenvolvimento.
- Ou você pode editar um pipeline existente, e atualize as opções existentes.
-
Se você estiver adicionando ou editando um pipeline de não produção para o qual deseja usar a Auditoria de experiência, é necessário selecionar o Auditoria de experiência caixa de seleção na Código-fonte guia.
- Isso só é necessário para pipelines de não produção.
- A variável Auditoria de experiência é exibida quando a caixa de seleção é marcada.
-
Para pipelines de produção e não produção, você define os caminhos que devem ser incluídos na Auditoria de experiência no Auditoria de experiência guia.
- Os caminhos da página devem começar com
/e são relativos ao seu site. - Por exemplo, se o site for
wknd.sitee gostaria de incluirhttps://wknd.site/us/en/about-us.htmlna Auditoria de experiência, insira o caminho/us/en/about-us.html.
- Os caminhos da página devem começar com
-
Toque ou clique Adicionar página e o caminho é preenchido automaticamente com o endereço do ambiente e adicionado à tabela de caminhos.
-
Continue a adicionar caminhos, conforme necessário, repetindo as duas etapas anteriores.
- É possível adicionar no máximo 25 caminhos.
- Se você não definir nenhum caminho, a página inicial do site será incluída na Auditoria de experiência por padrão.
-
Clique em Salvar para salvar o pipeline.
Resultados da auditoria de experiência results
Os resultados da Auditoria de experiência são apresentados na Teste de preparo fase do pipeline de produção através da página de execução do pipeline de produção.
A Auditoria de experiência fornece as pontuações medianas do Google Lighthouse para o páginas configuradas e a diferença na pontuação da verificação anterior.
A partir desta exibição resumida no Teste de preparo do pipeline, você tem duas opções:
Além do resumo apresentado nos detalhes de uma execução de pipeline, você também pode acessar diretamente os resultados completos da auditoria usando o Relatórios do painel do Cloud Manager para acessar o o relatório completo diretamente.
- Se quiser obter detalhes sobre como a auditoria funciona, consulte a seção Detalhes de avaliação da auditoria de experiência.
- Se quiser saber como executar uma auditoria de experiência sob demanda, consulte a seção Relatórios de auditoria por solicitação.
- Se tiver problemas com a auditoria, consulte a seção A Auditoria De Experiência Encontrou Problemas.
- Para obter dicas gerais de desempenho, consulte a seção Dicas gerais de desempenho.
Exibir páginas mais lentas view-slowest-pages
Tocar ou clicar Exibir páginas mais lentas abre o 5 páginas mais lentas , mostrando as cinco páginas de menor desempenho que você configurado para auditar.
As pontuações são divididas por Desempenho, Acessibilidade, Práticas recomendadas, e SEO junto com o desvio de cada métrica em relação à última auditoria.
Por padrão, a caixa de diálogo é aberta com as pontuações dos dispositivos móveis. Você pode alterar isso para pontuações da área de trabalho usando o Dispositivos alterne na parte superior da caixa de diálogo.
A caixa de diálogo tem como objetivo fornecer uma visão geral rápida. Para obter detalhes completos, toque ou clique Exibir relatório completo.
Exibir Relatório Completo view-full-report
É possível exibir o relatório completo de Auditoria de experiência por:
- Tocar ou clicar Exibir relatório completo no 5 páginas mais lentas diálogo.
- Tocar ou clicar Exibir relatório completo ao visualizar o execução de um pipeline.
- Tocar ou clicar no Relatórios no Cloud Manager.
A variável Relatórios é aberta, mostrando a Auditoria de experiência.
O relatório divide-se em duas áreas:
Pontuações de páginas: tendência trend
Por padrão, a exibição selecionada para Pontuações da página - tendência é pontuações medianas para o Últimos 6 meses.
Use o Selecionar e Exibir menus suspensos na parte superior e inferior do botão do gráfico para selecionar detalhes específicos da página e diferentes intervalos de tempo, respectivamente. Toque ou clique no e no atualizar tendência botão na parte superior do gráfico para aplicar as seleções e atualizar o gráfico.
Ao mover o mouse sobre o gráfico, uma dica de ferramenta exibe os valores das categorias do Google Lighthouse em pontos específicos do tempo.
Se você tocar ou clicar no gráfico em um ponto no tempo, um popover será aberto com detalhes dessa verificação. Toque ou clique no abrir verificação de auditoria de experiência para carregar os resultados da varredura na Resultados da verificação de auditoria de experiência seção.
Resultados da verificação de auditoria de experiência scan-results
A variável Resultados da verificação de auditoria de experiência A seção fornece recomendações sobre como melhorar a pontuação e os detalhes de todas as páginas digitalizadas. Ele está dividido em duas seções:
Recomendações recommendations
A variável Recommendations mostra um conjunto agregado de insights. Por padrão, recomendações para desempenho são exibidos. Use o menu suspenso ao lado da guia Recommendations para alterar para outra categoria.
Toque ou clique na divisa de qualquer recomendação para revelar detalhes sobre ela.
Quando disponíveis, os detalhes expandidos da recomendação também contêm a porcentagem do impacto das recomendações para ajudar a se concentrar nas alterações mais impactantes.
Toque ou clique no exibir páginas na visualização de detalhes para ver as páginas às quais a recomendação se aplica.
Páginas digitalizadas scanned-pages
A variável Páginas digitalizadas fornece pontuações detalhadas em todas as páginas digitalizadas. Você pode usar o Anterior e Próxima botões para percorrer os resultados e escolher em quantos a exibição deve paginar.
Tocar ou clicar no link de uma página específica atualiza o Selecionar filtro do Pontuações da página - tendência seção e mostra o Pontuações e recomendações para a página selecionada.
A variável Relatórios brutos fornece pontuações para cada auditoria da página. Toque ou clique no Baixar ícone para recuperar um arquivo JSON dos dados brutos.
Uma nova guia será aberta no navegador, indicando https://googlechrome.github.io/lighthouse/viewer/ com um URL assinado do relatório Lighthouse raw JavaScript Object Notation (JSON) da página selecionada, que é aberto automaticamente para sua inspeção detalhada
Relatórios de auditoria por solicitação on-demand
Além de serem executados durante a execução do pipeline, os relatórios da Auditoria de experiência também podem ser gerados sob demanda. Essa é uma boa solução para digitalizar rapidamente suas páginas, sem precisar executar um pipeline.
Para executar uma varredura por solicitação, navegue até o Relatórios para ver o relatório de auditoria completo e toque ou clique no Executar verificação botão.
As varreduras por solicitação acionam uma Auditoria de experiência para as 25 páginas configuradas e normalmente terminam em alguns minutos.
Após a conclusão, o gráfico de pontuações será atualizado automaticamente e você poderá inspecionar os resultados exatamente como em uma verificação de execução de pipeline.
Você pode filtrar o gráfico de pontuações com base no tipo de acionador usando o Acionador seletor.
A Auditoria de experiência encontra problemas issues
Se páginas que você configurou auditados não estavam disponíveis, a Auditoria de experiência reflete este fato.
O pipeline mostra uma seção de erro expansível para exibir os caminhos de URL relativos que não podia acessar.
Se estiver exibindo o relatório completo, os detalhes serão mostrados na Resultados da verificação de auditoria de experiência seção.
Alguns motivos pelos quais as páginas podem não estar disponíveis são:
- A configuração bloqueia o acesso.
- A página não existe.
- A página redireciona exigindo autenticação diferente da básica.
- Problema interno.
- Etc.
Dicas gerais de desempenho performance-tips
Dois dos problemas de impacto mais comuns que são fáceis de corrigir estão relacionados com as mudanças cumulativas de layout (CLS) e a maior tinta de conteúdo (LCP).
Estes podem ser melhorados através de:
- O carregamento das imagens acima da dobra não é lento (o conteúdo é visível no navegador sem a necessidade de rolagem para baixo).
- Priorizar corretamente como os recursos são carregados (por exemplo, carregando de forma assíncrona as imagens abaixo da dobra após o carregamento do documento).
- Busca prévia de arquivos JavaScript e CSS usados para renderizar conteúdo acima da dobra (se necessário).
- Reserva de espaço vertical ao atribuir uma proporção aos contêineres que carregam lentamente ou são renderizados posteriormente.
- Conversão de imagens para o formato WebP para reduzir seu tamanho.
- Usar
<picture>e imagemsrcsetcom tamanhos de imagem variáveis para tamanhos de visor diferentes (e garantindo que o redimensionamento funcione).
Detalhes de avaliação da auditoria de experiência details
Os detalhes a seguir fornecem informações adicionais sobre como a Auditoria de experiência avalia o site. Eles não são necessários para o uso geral do recurso e são fornecidos aqui para fins de integridade.
-
Embora a caminhos de página configurados da Auditoria de experiência mostrar o
.comdomínio do editor, a auditoria verifica a origem (.net), para garantir que os problemas introduzidos durante o desenvolvimento sejam detectados.- A variável
.comO domínio usa um CDN e pode gerar melhores pontuações ou conter resultados em cache.
- A variável
-
Em pipelines de pilha completa de produção, o ambiente de preparo é verificado.
- Para garantir que a auditoria forneça detalhes relevantes durante a auditoria, o conteúdo do ambiente de preparo deve estar o mais próximo possível do ambiente de produção.
-
As páginas exibidas na variável Selecionar na lista suspensa Pontuações da página - tendência seção são todas as páginas conhecidas que foram digitalizadas no passado pela Auditoria de experiência.
-
Uma recomendação pode ter um ganho potencial e uma diferença em relação à verificação anterior.
- A Auditoria de experiência estima o ganho potencial processando o relatório bruto de cada página e correlacionando os bytes ou milissegundos desperdiçados com um insight que tem um impacto ponderado na pontuação de desempenho.
- A auditoria fornece essas informações (bem como as páginas afetadas) para ajudar a decidir qual recomendação seguir.
- Para obter mais detalhes, consulte seção Dicas Gerais de Desempenho
-
Considerando que um pipeline de front-end pode ser implantado em um ambiente existente (ou que pode haver vários pipelines de front-end direcionados ao mesmo ambiente) e que os resultados da verificação são agregados em um nível de ambiente, as pontuações, as tendências e as recomendações são exibidas no mesmo ambiente selecionado, independentemente da execução do pipeline que acionou a verificação.