Mobile & Responsive
Nome Card UX: Mobile Friendly
La card Responsive e Mobile valuta l'usabilità della pagina su dispositivi mobili. Dal 2019 Google ha adottato il mobile-first indexing: usa la versione mobile del sito come base principale per l'indicizzazione e il ranking, anche per i risultati mostrati su desktop. Una pagina non ottimizzata per mobile non penalizza solo l'esperienza degli utenti smartphone (che rappresentano oggi oltre il 60% del traffico globale), ma compromette direttamente il ranking perché Google vede e valuta prima quella versione.
Cosa analizza la card
Analizza presenza e configurazione del viewport, dimensione dei target touch (link e pulsanti), dimensione del font per la leggibilità su schermi piccoli, presenza di contenuti che richiedono scroll orizzontale e altri segnali di compatibilità mobile.
A cosa serve
Serve per garantire che la versione mobile soddisfi i requisiti di Google Mobile-Friendly e per intercettare problemi di usabilità che spesso non sono visibili sui test desktop ma impattano direttamente il 60% del traffico.
L'Analogia: Il catalogo in formato tascabile progettato male
Hai un catalogo prodotti bello e funzionale in formato A3. Qualcuno lo riduce meccanicamente in formato tascabile senza riadattare niente: testi minuscoli illeggibili, immagini schiacciate, pulsanti troppo vicini che non riesci a premere senza toccare quello sbagliato. Il risultato finale non è un catalogo tascabile utile, è il catalogo A3 rimpicciolito. Un sito mobile non è un sito desktop rimpicciolito: deve essere progettato per funzionare su schermi piccoli, con touch come metodo di input principale.
Esempio di vita reale
Un sito di servizi professionali ha un menu di navigazione con voci di testo molto vicine tra loro su desktop. Su mobile le voci del menu diventano così ravvicinate che premerne una con il pollice significa quasi sempre premere quella adiacente. La card segnala target touch troppo piccoli. Aumentando il padding verticale delle voci di menu l'usabilità mobile migliora e il tasso di abbandono dalla navigazione mobile si riduce.
Domande frequenti su questa card
I 3 Pilastri del Successo Mobile
Viewport Adapt
Indica al browser come adattarsi istantaneamente alla larghezza dello smartphone dell'utente.
Media Queries
Regole CSS intelligenti che riposizionano gli elementi in base alle dimensioni dello schermo.
Smart Images
Invia immagini leggere agli smartphone per risparmiare traffico dati e velocizzare la resa.
Mobile-First: La Scelta di Google
Dal 2020, Google osserva prima la versione mobile del tuo sito per stabilire la tua posizione in classifica. Se il sito è illeggibile su smartphone, il tuo ranking calerà drasticamente anche per chi ti cerca da computer. Essere Mobile Friendly non è più un optional, è la base fondamentale per esistere nel web moderno.