Columns e Grid

Obiettivo: disporre più pezzi di contenuto uno accanto all'altro.
Tempo: 4 minuti
Serve: una pagina e tre cose che valga la pena mostrare insieme

1. Selezionate Add Block, poi Columns.
2. Compilate Columns Title, Columns Subtitle e Intro Text: Columns porta con sé un titolo, ed è questo che lo distingue da Grid.
3. Scegliete una Columns Variant: cards incornicia ogni colonna, plain le lascia spoglie, stats si adatta a numeri brevi.
4. Sulla riga di Columns selezionate Add child block e scegliete Column Item. Compilate Column Title e Column Text e ripetete per ogni colonna.
5. Per una disposizione spoglia selezionate Add Block e scegliete invece Grid. Impostate Columns (2, 3 o 4) e Gap.
6. Aggiungete quello che volete come figli del Grid: di solito si usano le Card.

Columns è un blocco di contenuto. Ha titolo, sottotitolo, introduzione e un'idea fissa di che cosa ci va dentro: i Column Item.

Grid è un blocco di impaginazione. Nessun testo proprio, nessuna opinione sui figli: solo un numero di colonne e uno spazio.

Usate Columns quando l'insieme ha bisogno di un'introduzione. Usate Grid quando state disponendo blocchi che parlano già da soli.

• Entrambi collassano su una sola colonna al telefono. È il punto, ed è il motivo per cui una tabella è lo strumento sbagliato per affiancare cose.
• Quattro colonne di solito sono due colonne con qualche passaggio in più. Su un portatile ognuna è stretta; al telefono sono solo un lungo elenco.
• Alternate media/text sections su Grid inverte i lati di immagine e testo lungo la pagina, per il classico impaginato alternato.
• A Grid non importa che cosa c'è dentro: un Grid di Header creato per sbaglio viene reso esattamente male come sembra.