Cos'è
Questo controllo copre lo stesso meta tag viewport spiegato in modo più tecnico nella nostra altra guida sul viewport, ma dall'angolazione di ciò che un visitatore mobile sperimenta effettivamente: senza di esso, il browser di un telefono presume che la pagina sia costruita per uno schermo desktop molto più largo e rimpicciolisce tutto per adattarlo, risultando in testo minuscolo e difficile da leggere e un layout che richiede pizzicamenti e scorrimenti costanti solo per leggere normalmente.
Per la maggior parte dei siti oggi, specialmente quelli con un design già genuinamente responsive, questo è puramente un problema di configurazione mancante piuttosto che un problema di design — il layout responsive esiste, semplicemente non gli è mai stata data l'occasione di attivarsi.
Perché è importante
Sulla maggior parte dei siti web oggi, i visitatori mobile costituiscono più della metà del traffico totale, quindi un problema di rendering mobile così fondamentale non è un caso limite minore — molto spesso influisce sulla maggioranza di tutti coloro che visitano il sito. Un visitatore che atterra su una pagina che appare rotta, compressa e difficile da navigare sul proprio telefono è considerevolmente più propenso ad andarsene subito piuttosto che lottare pizzicando e zoomando per leggere testo di dimensione normale.
Poiché questo specifico problema è così visivamente ovvio nel momento in cui viene controllato (basta aprire il sito su un telefono), è anche una delle cose più veloci da confermare risolte una volta corretta l'impostazione sottostante.
Come risolverlo
- Apri il tuo sito su un telefono reale, o usa l'anteprima mobile/toolbar dispositivo integrata nel tuo browser (di solito disponibile negli strumenti per sviluppatori).
- Se la pagina appare come un layout desktop rimpicciolito invece di un layout mobile correttamente dimensionato, questa impostazione ne è molto probabilmente la causa.
- Consulta la nostra guida tecnica sul viewport per la correzione esatta del codice — un singolo tag
<meta name="viewport">risolve questo praticamente in ogni caso. - Se sei su un website builder, questo viene impostato automaticamente dalla piattaforma in quasi tutti i casi — una visualizzazione mobile rotta lì di solito indica invece un embed di codice personalizzato che interferisce.
- Ricontrolla la pagina su un telefono dopo la correzione per confermare che testo e layout siano ora dimensionati correttamente senza bisogno di zoomare.