Didn't make the #ChromeDevSummit this year? Catch all the content (and more!) in the Chrome Dev Summit 2019 playlist on our Chrome Developers YouTube Channel.

HTML tem uma meta tag de janela de visualização

Por que a auditoria é importante

Sem uma meta tag de janela de visualização, os dispositivos móveis renderizam páginas nas larguras de tela típicas de desktop e depois ajustam a escala das páginas para as telas dos dispositivos móveis. A definição da janela de visualização permite controlar sua largura e escala. Consulte os links a seguir para saber mais:

Como ser aprovado na auditoria

Adicione uma tag <meta> à janela de visualização no <head> do HTML.

<head>
  ...
  <meta name="viewport" content="width=device-width, initial-scale=1">
  ...
</head>

O par chave-valor width=device-width define a largura da janela de visualização como a largura do dispositivo. O par chave-valor initial-scale=1 define o nível inicial de zoom ao acessar a página.

Como a auditoria é implementada

Esta seção explica como esta auditoria é implementada para que você possa compreender como a pontuação da auditoria é calculada.

O Lighthouse verifica se existe uma tag <meta name="viewport"> no <head> do documento. Além disso, verifica se o nó contém um atributo content e se o valor desse atributo contém o texto width=. No entanto, ele não verifica se width é igual a device-width. O Lighthouse também não verifica a existência de um par chave-valor initial-scale.