Il meta tag viewport

Per ragioni di comodità e fruibilità ho dovuto rendere funzionale una applicazione che avevo creato (videogame di carte) anche per Tablet.
L’applicazione era pensata al desktop e quindi le proporzione che su di un monitor erano gradevoli su di un tablet no.

Per prima cosa ho provato ad usare le media queries nel foglio di stile dell’applicazione purtroppo non sono riuscito a fare molto poi ragionando ho impostato il viewport
nel suo valore “initial-scale=0.8” e magicamente ho risolto! :).

Il meta tag viewport istruisce il browser su come visualizzare la nostra applicazione o sito il meta tag si inserisce all’interno dell’area di un sito, e la sua forma base è questa:

Qui impartiamo al browser la larghezza width in base alla larghezza dello schermo del dispositivo.
Altre impostazioni possono essere:

L’user-scalable=no impedisce all’utente di ridurre o aumentare la visione del browser e quindi “blocca la visione”, initial-scale=1.0 imposta la visione iniziale della nostra applicazione, che nel mio caso volevo ridurre, minimum-scale=1.0, maximum-scale=1.0 imposta quanto l’utente può “zumare”.

Spero che questo articolo vi sia stato utile! Grazie per averlo letto, alla prossima.