Nota: Sebbene le nostre guide più popolari siano state tradotte in italiano, alcune guide sono disponibili solo in inglese.

Come si impilano i blocchi sui dispositivi mobili

Per una maggiore leggibilità su dispositivi mobili ed evitare che i visitatori debbano ingrandire o scorrere per visualizzare il contenuto, il responsive design di Squarespace allinea automaticamente i blocchi in verticale.

Se i blocchi non si impilano nel modo desiderato, puoi spostarli seguendo gli scenari illustrati in questa guida e nel video. Sperimentare e visualizzare in anteprima il tuo sito è il modo migliore per perfezionare il layout finché non ottieni un design che ti piace e che si visualizza in modo ottimale su tutti i dispositivi. 

Guarda un video

Il video mostra un sito della versione 7.0, ma blocchi e colonne si comportano allo stesso modo sui siti della versione 7.1

Layout a colonna nella vista dispositivo mobile

Quando i blocchi sono impilati verticalmente e occupano l'intera larghezza di una pagina (senza blocchi su entrambi i lati), si impileranno verticalmente anche sui dispositivi mobili, mantenendo il layout della pagina su computer. 

L'aggiunta di blocchi a sinistra o a destra di altri blocchi crea delle colonne. Quando una pagina contiene colonne, Squarespace sposterà la seconda, la terza e le colonne aggiuntive sotto la prima sui dispositivi mobili. In altre parole, le colonne si spostano da orizzontali a verticali su dispositivo mobile.

Ad esempio:

  • Se sono presenti tre blocchi immagine su una riga orizzontale, questi si impilano uno sopra l'altro da sinistra a destra sul dispositivo mobile.
  • Se sono presenti tre blocchi immagine su una riga con blocchi di testo sotto ciascuno di essi che descrivono ciascuna immagine, ciascun blocco immagine avrà il proprio blocco di testo associato impilato sotto di esso nella vista per dispositivi mobili seguito dall'immagine successiva. Per vedere come funziona, guarda il video qui sopra.

Tieni a mente queste eccezioni:

  • I Blocchi spazio sono automaticamente nascosti su dispositivo mobile in tutti i siti versione 7.1 e nella maggior parte dei siti versione 7.0.
  • I Blocchi flottanti in un Blocco di testo (ad esempio, le immagini racchiuse nel testo) vengono visualizzati sopra il Blocco di testo nella vista dispositivo mobile. Se i blocchi non appaiono correttamente sopra il testo nella vista dispositivo mobile, sposta il blocco per assicurarti che non fluttui nel testo.

Layout più complessi nella visualizzazione per dispositivi mobili

Nei layout in cui alcune aree hanno dimensioni di colonna diverse rispetto ad altre, puoi comunque controllare il modo in cui i blocchi vengono ordinati su dispositivo mobile.

Quando aggiungi blocchi, visualizzerai delle linee guida che mostrano come i blocchi verranno ordinati. Se una linea guida corre a fianco di un blocco per tutta la sua lunghezza, Squarespace saprà che i due blocchi devono essere raggruppati su tutti gli schermi.

Per mantenere un blocco impilato con un altro, trascinarlo e rilasciarlo quando la linea guida (la linea orizzontale) corre per tutta la lunghezza dell'altro blocco.

Per vedere come funziona, guarda il video qui sopra.

move_text_block_under_image_block.png

Ulteriore assistenza

  • Per visualizzare in anteprima l'aspetto del tuo sito su dispositivi mobili, utilizza Vista dispositivo. Poiché i siti possono apparire in modo leggermente diverso a seconda del dispositivo, ti consigliamo anche di testarne l'aspetto sul tuo dispositivo mobile.
  • Per capire meglio come il tuo sito viene visualizzato sui dispositivi mobili, modificalo dall'app Squarespace.

Questo articolo ti è stato utile?
Utenti che ritengono sia utile: 58 su 376