A cosa serve la viewport?

La viewport determina l'area visibile di una pagina web nella finestra del browser. È necessaria per:

• Design reattivo: Permette di creare layout che si adattano a diverse dimensioni dello schermo dei dispositivi (smartphone, tablet, desktop).
• Ridimensionamento del contenuto: Controlla come il contenuto viene visualizzato e scalato in base alle dimensioni del dispositivo.

<!-- Meta tag per configurare la viewport -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">

Parametri content:

• width=device-width: La larghezza della viewport corrisponde alla larghezza del dispositivo in pixel CSS.
• initial-scale=1.0: Imposta il livello di zoom iniziale della pagina.

Una corretta configurazione della viewport garantisce una visualizzazione confortevole del sito su qualsiasi dispositivo, migliorando l'esperienza utente e il SEO.