Sito responsive: cosa serve nel 2026, oltre all’adattamento allo schermo

Un sito responsive adatta la disposizione dei contenuti allo schermo di chi lo visita.

Per un’azienda, questo significa permettere alle persone di leggere una scheda prodotto, consultare i servizi o inviare una richiesta anche dal telefono.

La qualità del progetto si vede proprio durante queste operazioni: nei tempi di caricamento, nella facilità con cui si trovano le informazioni e nel funzionamento dei moduli. A questi aspetti si aggiungono l’accessibilità e una struttura dei contenuti che i motori di ricerca possano interpretare correttamente: nelle prossime righe un approfondimento di tutti questi aspetti.

Progettare per il mobile significa scegliere cosa mettere in evidenza

A settembre 2026, nel confronto tra mobile e desktop, StatCounter attribuisce ai dispositivi mobili il 60,04% delle pagine viste a livello mondiale. In Italia, i dati Audicom di aprile 2026 indicano 40,7 milioni di persone tra i 18 e i 74 anni collegate da smartphone o tablet. Nella media giornaliera, il mobile rappresenta l’88% del tempo trascorso online nella fascia considerata.

Per chi progetta un sito aziendale, questi numeri hanno una conseguenza concreta: la versione per telefono merita attenzione fin dalle prime scelte di impaginazione.

Su uno schermo piccolo bisogna stabilire quali informazioni mostrare per prime, quanto spazio dedicare alle immagini e dove collocare i diversi pulsanti presenti all’interno della pagina. Anche un modulo richiede qualche valutazione: quali campi servono davvero? Le istruzioni restano visibili quando si apre la tastiera? Gli eventuali errori sono facili da correggere?

Il criterio è permettere alla persona di completare ciò che sta facendo, anche con una connessione poco stabile o pochi minuti a disposizione.

Google usa la versione mobile per indicizzare i contenuti

Esatto: Google utilizza la versione mobile delle pagine per l’indicizzazione e il posizionamento. Nella documentazione di Search Central consiglia il responsive design perché è la configurazione più semplice da implementare e mantenere: lo stesso indirizzo e lo stesso codice HTML servono i diversi dispositivi, mentre il CSS regola la presentazione.

Questo rende più semplice conservare gli stessi contenuti su desktop e telefono. Durante lo sviluppo occorre comunque controllare che le informazioni utili rimangano disponibili anche sugli schermi piccoli.

Togliere dalla versione mobile una descrizione tecnica o una parte della pagina può ridurre le informazioni che Google riesce a utilizzare. Per risparmiare spazio si possono raccogliere i testi in sezioni espandibili, come gli accordion: Google ammette questa soluzione, purché i contenuti siano accessibili al crawler. Il problema nasce quando il testo viene caricato soltanto dopo un clic dell’utente, un’interazione che il motore di ricerca non esegue.

La stessa attenzione riguarda le immagini e i relativi testi alternativi, oltre ai dati strutturati eventualmente presenti nelle pagine.

I Core Web Vitals descrivono l’esperienza degli utenti reali

Aprire il sito dal computer dell’ufficio permette di individuare alcuni problemi, ma lascia fuori molte delle condizioni in cui viene consultato: le prestazioni cambiano infatti in base al dispositivo, alla rete e alle interazioni effettuate durante la visita.

I Core Web Vitals misurano il caricamento, la reattività e la stabilità della pagina. Le soglie considerate buone sono un Largest Contentful Paint (LCP) entro 2,5 secondi, un Interaction to Next Paint (INP) entro 200 millisecondi e un Cumulative Layout Shift (CLS) pari o inferiore a 0,1. La valutazione considera il 75° percentile delle visite, distinguendo mobile e desktop: i valori devono quindi rispettare le soglie in almeno il 75% delle visite misurate.

Per capire cosa descrivono, basta pensare a situazioni comuni. L’immagine principale che tarda a comparire, il menu che risponde in ritardo oppure un pulsante che si sposta proprio mentre si sta per toccarlo sono problemi che incidono sull’uso quotidiano del sito e che queste metriche aiutano a individuare. L’INP, in particolare, osserva la rapidità della risposta visiva alle interazioni, come clic, tocchi e pressioni dei tasti.

Eventuali lentezze del sito possono, di sponda, causare problemi anche ai risultati commerciali. Nello studio Milliseconds Make Millions, condotto da Deloitte e fifty-five per Google, una riduzione di 0,1 secondi nelle metriche di velocità analizzate era associata a un aumento delle conversioni mobile dell’8,4% nel retail e del 10,1% nel settore viaggi. Sono risultati osservati nel campione dello studio, da leggere nel loro contesto; danno però una misura del peso che i tempi di attesa possono avere durante un acquisto.

Accessibilità: gli obblighi dipendono dal servizio offerto

Dal 28 giugno 2025 si applicano gli obblighi previsti dall’European Accessibility Act, recepito in Italia con il D.Lgs. 82/2022. Il decreto riguarda l’accessibilità di determinati prodotti e servizi, tra cui l’e-commerce: per capire se un sito rientra negli obblighi occorre valutare il servizio offerto e il soggetto che lo fornisce. Le microimprese che erogano servizi sono esentate: si tratta delle imprese con meno di dieci dipendenti e un fatturato annuo oppure un totale di bilancio annuo non superiore a due milioni di euro.

Sul piano progettuale, molti controlli di accessibilità riguardano direttamente il comportamento delle pagine al variare dello spazio disponibile. Le WCAG 2.1 prevedono, tra gli altri requisiti, la possibilità di ingrandire il testo fino al 200% senza perdere contenuti o funzionalità e, salvo le eccezioni previste, di consultare i contenuti a una larghezza equivalente a 320 pixel CSS senza dover scorrere in due direzioni.

Questi controlli vanno affiancati alle verifiche sull’uso da tastiera e sulla lettura con tecnologie assistive; la conformità richiede quindi una valutazione che comprende anche aspetti diversi dall’impaginazione.

Come si costruisce un sito responsive facile da usare

Griglie fluide e media query permettono di modificare l’impaginazione in base alla larghezza della finestra del browser. Le container query consentono un controllo ulteriore: un componente può cambiare disposizione in base allo spazio del contenitore in cui si trova. Una scheda prodotto, per esempio, può avere una presentazione compatta in una colonna laterale e una più distesa nel corpo della pagina; questo facilita il riutilizzo dello stesso componente in punti diversi del sito.

Le prestazioni dipendono poi da scelte meno visibili, gestite direttamente da backend:

• le immagini devono avere dimensioni adatte allo schermo e uno spazio riservato nell’impaginazione, così da evitare spostamenti durante il caricamento;
• gli script vanno valutati per il lavoro che richiedono al browser;
• il caricamento differito delle immagini può alleggerire la pagina, purché venga applicato ai contenuti fuori dalla prima schermata e lasci caricare subito l’immagine principale.

La verifica finale dovrebbe comprendere alcune prove su telefoni reali, che permettono di osservare problemi che possono sfuggire guardando soltanto l’anteprima del layout.

Contenuti chiari anche per la ricerca con l’AI

Le risposte generate dall’intelligenza artificiale rendono ancora più utile una struttura editoriale comprensibile. Titoli descrittivi e paragrafi che spiegano subito il proprio argomento aiutano il lettore a trovare una risposta e danno ordine alle informazioni della pagina.

Per comparire nelle funzionalità AI di Google restano valide le indicazioni SEO generali: contenuti utili, accessibilità alla scansione e informazioni importanti disponibili in forma testuale. Google chiarisce che non servono dati strutturati speciali per AI Overviews o AI Mode e che il rispetto delle indicazioni non garantisce la presenza nelle risposte.

Un nuovo sito web accessibile e ottimizzato per SEO e GEO a Treviso

Se il tuo sito è stato pubblicato prima del 2020, o se oggi non supera i Core Web Vitals su mobile e un controllo di accessibilità secondo WCAG 2.1 livello AA, conviene ripartire da un nuovo sito web invece di inseguire una serie di correzioni.

Perazza, tra le migliori agenzie di comunicazione a Treviso, realizza siti web responsive e accessibili progettati fin dall’inizio per posizionarsi sui motori di ricerca e per essere citati nelle risposte generate dall’intelligenza artificiale: contattaci per maggiori informazioni!