Zoom disabilitato

Silktide esegue un controllo su ogni pagina per individuare il codice che impedisce ai visitatori di ingrandire la pagina sui dispositivi mobili. Lo zoom con un gesto di pizzicamento dovrebbe essere sempre disponibile, perché molte persone fanno affidamento su questa funzione per leggere i contenuti.

Il codice responsabile è il tag della pagina:

<!-- Problema: sia user-scalable=no sia maximum-scale=1 bloccano lo zoom -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

<!-- Soluzione: consenti agli utenti di ingrandire la pagina -->
<meta name="viewport" content="width=device-width, initial-scale=1">

Perché è importante

Lo zoom con un gesto di pizzicamento è il modo in cui le persone ipovedenti leggono il web sul telefono. È anche il modo in cui chiunque altro gestisce caratteri piccoli, mappe dense di informazioni e immagini dettagliate. Una pagina che lo disabilita rende tutto ciò impossibile: non esiste alcuna soluzione alternativa che un visitatore possa applicare.

Lo zoom viene solitamente disabilitato per motivi estetici, per evitare che il layout cambi. Il costo ricade interamente sulle persone che hanno più bisogno di questa funzione, mentre le linee guida sull'accessibilità richiedono che il testo possa essere ridimensionato. Alcuni dispositivi ora ignorano questa restrizione proprio perché causa tanti problemi, ma molti browser continuano a rispettarla.

Come risolvere il problema

Rimuovi user-scalable=no da ogni tag viewport.
Rimuovi i valori maximum-scale che limitano lo zoom alla dimensione normale della pagina o a una dimensione vicina a essa (come maximum-scale=1).
Se il layout si rompe quando viene ingrandito, correggilo con il invece di impedire ai visitatori di usare lo zoom.

Come Silktide esegue il controllo

Carica la pagina su un dispositivo mobile simulato.
Individua ogni tag meta viewport.
Segnala ogni tag che blocca lo zoom: tramite user-scalable=no oppure tramite un valore maximum-scale non superiore alla scala con cui la pagina viene già caricata.

Risoluzione dei problemi

Riesco ancora a usare lo zoom sul mio iPhone

iOS ignora queste restrizioni del viewport e consente comunque lo zoom con un gesto di pizzicamento. Altri browser e piattaforme continuano a rispettarle, quindi il codice rimane una barriera concreta e dovrebbe essere corretto. Per riprodurre il problema, esegui il test su un dispositivo Android.

Il tag viene aggiunto dal mio framework o dal mio tema

Alcuni temi e framework per app meno recenti inseriscono user-scalable=no per impostazione predefinita. Cerca un'impostazione relativa al viewport o allo zoom nel tema oppure sovrascrivi il tag nel modello della pagina.