El contenido no tiene el tamaño correcto para el viewport

El viewport es la parte de la ventana del navegador en la que se puede ver el contenido de la página. Si el ancho del contenido de la página es menor o mayor que el ancho del viewport, es posible que no se procese correctamente en las pantallas de los dispositivos móviles. Por ejemplo, si el ancho del contenido es demasiado grande, es posible que se reduzca su tamaño para que quepa, lo que dificulta la lectura del texto.

Cómo falla la auditoría de ancho del contenido de Lighthouse

Lighthouse marca las páginas cuyo ancho no es igual al ancho del viewport:

Auditoría de Lighthouse que muestra contenido que no tiene el tamaño correcto para el viewport

La auditoría falla si window.innerWidth no es igual a window.outerWidth.

Cómo hacer que tu página se ajuste a las pantallas de los dispositivos móviles

Esta auditoría es una forma indirecta de determinar si tu página está optimizada para dispositivos móviles. Consulta los Conceptos básicos del diseño web responsivo de Google para obtener una descripción general de cómo crear una página optimizada para dispositivos móviles.

Puedes ignorar esta auditoría en los siguientes casos:

  • No es necesario que tu sitio esté optimizado para pantallas de dispositivos móviles.
  • El ancho del contenido de tu página es intencionalmente menor o mayor que el ancho del viewport.

Recursos