Da ottobre 2026 ogni sito web hPage è automaticamente ottimizzato per i dispositivi mobili: tutti i design dispongono di un layout mobile e non c’è nulla da configurare. La vecchia impostazione Design mobile non esiste più.
Come funziona il layout mobile
- Su smartphone e tablet il tuo sito web viene mostrato in una sola colonna: intestazione, menu e contenuto uno sotto l’altro. Il menu si ripiega dietro l’intestazione del menu del tuo design e si apre con un tocco.
- I contenuti, i colori e i caratteri sono gli stessi del desktop. Modifichi le tue pagine una sola volta; non c’è un contenuto mobile separato da mantenere.
- Immagini, video e tabelle vengono ridimensionati alla larghezza dello schermo. Le tabelle larghe con una larghezza fissa scorrono lateralmente.
- Il layout mobile si applica ai touch screen più stretti del tuo design e a ogni schermo più stretto di 1024 pixel. Un laptop con un mouse e una finestra del browser più stretta mantiene il design desktop.
Verificare il tuo sito web su uno smartphone
- Fai clic su Visita il sito web nella barra laterale per vedere l’indirizzo del tuo sito web e apri questo indirizzo nel browser del tuo smartphone.
- Senza smartphone: apri il tuo sito web sul desktop e restringi la finestra del browser a meno di 1024 pixel. Il layout passa al layout mobile.
- Se il tuo smartphone mostra ancora una vecchia versione, ricarica la pagina. I browser mobili conservano le pagine nella cache per un po’ di tempo.
Suggerimenti per le immagini
- Non devi ridimensionare le immagini per i dispositivi mobili: vengono rimpicciolite automaticamente e mantengono le loro proporzioni.
- Mantieni piccole le dimensioni dei file, così le pagine si caricano velocemente con una connessione mobile. La compressione delle immagini durante il caricamento dei file aiuta in questo.
- Evita di inserire testo importante all’interno delle immagini: su uno schermo piccolo diventa difficile da leggere. Scrivi invece il testo come testo.
- Le immagini allineate a sinistra o a destra del testo vengono mostrate più strette sui dispositivi mobili, in modo che il testo ci stia ancora accanto.
Suggerimenti per testi e tabelle
- Scrivi paragrafi brevi e usa i titoli; i blocchi di testo lunghi sono difficili da leggere su uno smartphone.
- Evita le larghezze fisse nel tuo HTML personalizzato (per esempio
width="800"); usa le percentuali o nessuna larghezza. - Preferisci le tabelle con una larghezza del 100 % o senza larghezza. Una tabella con una larghezza fissa scorre lateralmente sui dispositivi mobili.
- Le parole e gli indirizzi web molto lunghi vengono spezzati al bordo dello schermo; uno spazio o un trattino offre al browser un punto migliore per andare a capo.