'Intercop 2022" è un progetto annunciato da Google, Microsoft, Apple e Mozzilla Foundation per far sì che tutti i browser offrano la stessa esperienza web.
Il progetto ha 15 aree di interesse e una di queste è l'aggiunta di più unità di dimensione della finestra grafica, per una migliore compatibilità tra browser e dispositivi mobili.
Nuove unità
Prima avevamo solo "vh" e "vw" per impostare le dimensioni della finestra grafica, ora abbiamo altre tre unità che ci aiuteranno molto a facilitare la creazione di disegni per qualsiasi dispositivo, soprattutto per i cellulari, visto che oggi sono i dispositivi con cui navighiamo di più.
Large viewport (lvh y lvw)
La finestra grande è quella che non mostra alcuna interfaccia dinamica del browser.
Su un dispositivo mobile, 100lvh e 100lvw corrisponderebbero all'intera dimensione dello schermo senza alcun elemento del browser.
Small viewport (svh y svw)
La finestra piccola è quella in cui vengono visualizzate tutte le interfacce del browser, quindi 100svh e 100svw avranno le dimensioni giuste per essere inseriti nell'interfaccia.
Questa unità è ideale quando si cerca di mantenere una dimensione relativa alla finestra grafica tenendo conto degli elementi attivi del browser.
Dynamic viewport (dvh y dvw)
Funziona come una combinazione di questi elementi.
La finestra viene ridimensionata quando gli elementi dell'interfaccia del browser appaiono o vengono nascosti. Questo insieme di unità è molto utile per adattare automaticamente gli elementi alla navigazione.
Compatibilità
Oltre l'85% dei browser supporta queste unità di misura, che possono quindi essere applicate senza problemi in quasi tutti i casi.
Lo si può vedere in: caniuse.com
Conclusione
È innegabile che queste nuove misure di dimensionamento sono e saranno sempre più utili perché renderanno più facile creare layout che riempiano la finestra visibile sui dispositivi mobili tenendo conto della barra degli indirizzi.
Spero che l'abbiate trovato utile, grazie mille!