Contenuto della pagina
- Documentazione Shopify su sezioni e blocchi
- Documentazione Company XYZ sulle impostazioni del padding della sezione
- Documentazione Company XYZ sulle impostazioni degli sfondi della sezione
- Documentazione Company XYZ sulle impostazioni dei separatori
- Documentazione Company XYZ sulle impostazioni delle larghezze del layout
Usate questa sezione per visualizzare il contenuto principale del corpo di una pagina e controllare come appare all’interno del layout. Funziona al meglio per pagine con molto testo, in cui leggibilità, spaziatura e gerarchia visiva sono importanti.
Impostazioni principali
Sezione intitolata “Impostazioni principali”La scelta principale è se mostrare il titolo della pagina all’interno di questa sezione. Per una panoramica più ampia di come il contenuto della pagina si inserisce in un layout del tema, consultate documentazione Shopify sulle sezioni e i blocchi. Lasciarlo attivo mantiene l’intestazione della pagina semplice e coerente, mentre disattivarlo vi offre maggiore libertà di introdurre la pagina con un’altra sezione o un layout di titolo personalizzato.
Se disattivate Show title, aggiungete altrove nella pagina un heading H1, in modo che il contenuto abbia comunque un heading di livello superiore chiaro.
Questa sezione è ideale per presentare contenuti di pagina ben strutturati, non per sostituire la formattazione del contenuto. Titoli, paragrafi ed elenchi puliti nel corpo della pagina renderanno la sezione più facile da leggere, indipendentemente dalle impostazioni di layout che scegliete.
Impostazioni di colore
Sezione intitolata “Impostazioni di colore”Usate queste impostazioni per sostituire solo il colore del testo predefinito per questa sezione. Questo è particolarmente utile quando il contenuto della pagina si trova su uno sfondo personalizzato o quando vi serve un contrasto più forte di quello fornito dai colori globali del tema.
Prima di pubblicare, controllate insieme paragrafi lunghi, link e heading. Un colore del testo che su contenuti brevi sembra corretto può risultare a basso contrasto o stancante da leggere su pagine più lunghe.
Impostazioni standard della sezione
Sezione intitolata “Impostazioni standard della sezione”Impostazioni di padding
Sezione intitolata “Impostazioni di padding”Usate le Impostazioni di padding condivise per controllare lo spazio sopra e sotto il contenuto. Valori separati per desktop e mobile rendono più facile mantenere la sezione spaziosa sugli schermi più grandi senza far sembrare quelli più piccoli troppo ariosi.
Per i contenuti lunghi, in genere funziona meglio una spaziatura moderata. Aumentate il padding quando questa sezione deve distinguersi dalle sezioni circostanti e riducetelo quando la pagina deve essere letta come un flusso più continuo.
Impostazioni dello sfondo sezione
Sezione intitolata “Impostazioni dello sfondo sezione”Usate le Impostazioni dello sfondo sezione condivise per aggiungere un colore, un gradiente, un’immagine o un video dietro al contenuto. Queste impostazioni possono dare a una pagina semplice un aspetto più brandizzato o editoriale, ma hanno anche l’effetto più forte sulla leggibilità.
Le impostazioni del gradiente sovrascrivono quelle del colore pieno, e i gradienti di overlay sovrascrivono i colori di overlay. Potete anche fornire media di sfondo specifici per mobile quando la versione desktop non viene ritagliata bene sugli schermi più piccoli.
Impostazioni dei separatori
Sezione intitolata “Impostazioni dei separatori”Usate le Impostazioni dei separatori condivise per aggiungere una linea sopra o sotto la sezione. È un modo semplice per separare il contenuto della pagina dalle sezioni vicine senza affidarsi a grandi cambiamenti di spaziatura o a un trattamento di sfondo completo.
Se lasciate trasparente il colore del separatore, la sezione utilizza il colore del bordo del tema. Di solito è la scelta più semplice quando desiderate un divisore discreto che rimanga visivamente coerente in tutta la pagina.
Impostazioni di larghezza
Sezione intitolata “Impostazioni di larghezza”Usate le Impostazioni di larghezza condivise per controllare la larghezza del contenuto e la larghezza esterna della sezione. Per questa sezione, la larghezza del contenuto di solito è la più importante, perché influisce direttamente sulla lunghezza delle righe e sul comfort di lettura.
Larghezze del contenuto più strette spesso funzionano meglio per pagine di policy, pagine narrative e altri layout con molto testo. La larghezza della sezione diventa più evidente quando aggiungete uno sfondo, perché cambia quanto lo sfondo si estende oltre la colonna di testo.
Note sull’uso
Sezione intitolata “Note sull’uso”- Mantenete chiaro l’heading della pagina. Usate il titolo integrato, a meno che un’altra sezione non stia già fornendo un H1 chiaro.
- Ottimizzate per la lettura. Scegliete una larghezza del contenuto e un colore del testo che rendano comodi da scansionare i paragrafi lunghi.
- Usate gli sfondi in modo selettivo. Aggiungete media di sfondo solo quando supportano la pagina senza competere con il contenuto.
- Adattate la spaziatura allo scopo della pagina. Date più respiro alle pagine editoriali e mantenete più compatte quelle di utilità per una scansione più rapida.
- Controllate la visualizzazione su mobile. Prima di pubblicare, verificate spaziatura, larghezza e comportamento dello sfondo sugli schermi più piccoli.
- Confrontate entrambe le viewport. Le impostazioni desktop e mobile possono produrre comportamenti diversi di allineamento, visibilità e media, quindi rivedete la sezione in entrambe le dimensioni prima di finalizzarla.
- Gestite gli override in modo intenzionale. I valori vuoti o trasparenti di solito mantengono lo stile di fallback del tema, mentre colori, gradienti o scelte di media espliciti rendono questa sezione più autonoma.
- Esaminate con attenzione i media configurati. Quando i media desktop e mobile sono impostati separatamente, confermate che ritaglio, caricamento, comportamento di fallback e leggibilità del testo funzionino bene in entrambe le versioni.