Menu mobile non a schermo intero

Perché conta

Un menu corto con la pagina visibile sotto è confusionario su un telefono. Uno swipe sposta la pagina invece del menu, un tap atterra sulla pagina e i link in fondo restano irraggiungibili. I sottomenu lunghi che si aprono di default spingono via le voci principali.

Come lo controlla Snaglist

Con il menu aperto Snaglist misura il pannello: va dal sotto l'intestazione fino in fondo allo schermo, cosa c'è in fondo allo schermo, la pagina si muove quando si fa swipe sul menu, ogni link è raggiungibile (visibile o scorrendo dentro il menu) e la pagina è più larga dello schermo. Il dettaglio dice cosa ha misurato e lo screenshot mostra il menu aperto.

Cause frequenti

• Un dropdown lungo quanto i suoi link, con la pagina visibile sotto
• Un pannello con altezza massima e proprio scroll interno in una pagina che scorre anch'essa
• Lo scroll del body non bloccato mentre il menu è aperto
• Sottomenu che si aprono di default
• Un pannello con overflow hidden che taglia gli ultimi link

Come risolverlo

1. Rendi il menu aperto un pannello fisso dal sotto l'intestazione fino in fondo allo schermo.
2. Dagli un proprio scroll quando è più lungo dello schermo.
3. Blocca la pagina sotto mentre il menu è aperto.
4. Comprimi i sottomenu lunghi, così le voci principali restano in alto.
5. Controlla la pagina dopo la prossima scansione.