¿Para qué sirve la vista previa?

El viewport determina el área visible de una página web en la ventana del navegador. Es necesario para:

• Diseño adaptable: Permite crear diseños que se ajustan a diferentes tamaños de pantalla de dispositivos (smartphones, tablets, escritorios).
• Escalado de contenido: Controla cómo se muestra y escala el contenido según el tamaño del dispositivo.

<!-- Metaetiqueta para configurar el viewport -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">

Parámetros content:

• width=device-width: El ancho del viewport corresponde al ancho del dispositivo en píxeles CSS.
• initial-scale=1.0: Establece el nivel inicial de zoom de la página.

Una configuración correcta del viewport asegura una visualización cómoda del sitio en cualquier dispositivo, mejorando la experiencia del usuario y el SEO.