Controlla la spaziatura e l'altezza dell'header del sito per abbinarla alle tue preferenze di design.
​

Il padding dell'header controlla lo spazio sopra e sotto il contenuto dell'header. Regolarlo cambia quanto respiro hanno i nomi, il logo e la data del matrimonio, influenzando l'aspetto complessivo del sito!
​

Il padding è lo spazio tra il contenuto dell'header (nomi o logo, data del matrimonio e pulsante RSVP) e i bordi dell'area dell'header. Il menu di navigazione e l'immagine dell'header si trovano fuori da quest'area e non vengono modificati.
​

Padding superiore: lo spazio sopra il contenuto dell'header
​

Padding inferiore: lo spazio sotto il contenuto dell'header
​

Più padding = header più grande e arioso
Meno padding = header compatto e snello
​

Equilibrio visivo. Alcuni header sembrano stretti, altri troppo ampi.
​

Adattarlo al tuo stile. Un matrimonio elegante potrebbe volere più spazio, uno informale meno.
​

Ottimizzazione per mobile. Il padding si adatta alla larghezza dello schermo, quindi sui telefoni è automaticamente più piccolo.
​

Dimensione del logo. Se hai un logo, più padding gli dà spazio per respirare.
​

Preferenza personale. Magari ti piace semplicemente l'aspetto di una certa quantità di padding!
​

La spaziatura dell'header si aggiorna immediatamente!
​

Il padding è impostato come percentuale della larghezza dello schermo, non in pixel. Ogni cursore si muove in 12 scatti, da nessun padding su Meno fino a circa il 30% della larghezza dello schermo su Più.
​

Vicino a Meno: compatto, minimale
​

A metà: comodo, standard
​

Vicino a Più: header arioso e di grande effetto
​

Il padding superiore e quello inferiore si impostano separatamente, quindi puoi usare valori diversi:
​

Più sopra, meno sotto: sposta il contenuto più in basso rispetto al bordo superiore
​

Più sotto, meno sopra: crea spazio prima dell'inizio del contenuto della pagina
​

Uguali: aspetto centrato ed equilibrato
​

Diversi: asimmetrico, può creare effetti interessanti
​

Sperimenta per vedere cosa rende meglio!
​

Loghi grandi: dagli spazio per risaltare
​

Design minimali: lo spazio bianco in più risulta elegante
​

Visualizzazione desktop: gli schermi più grandi reggono più padding
​

Fare colpo: tanto padding crea un aspetto audace e sicuro
​

Dispositivi mobili: risparmia spazio sugli schermi piccoli
​

Siti ricchi di contenuti: arrivi prima ai contenuti
​

Temi minimalisti: alcuni temi sono pensati con un padding minimo
​

Dopo la regolazione:
​

Non esiste un'impostazione separata per mobile. Poiché il padding è una percentuale della larghezza dello schermo, la stessa impostazione produce automaticamente un header ampio sui computer e uno più piccolo sui telefoni.
​

L'immagine dell'header si trova sopra l'area dell'header con padding, quindi il padding non ne cambia le dimensioni. Se hai aggiunto uno Sfondo dell'header, questo riempie l'area con padding, quindi più padding mostra più sfondo intorno ai nomi.
​

Il menu di navigazione è separato dall'header, quindi il padding dell'header non lo modifica.
​

Il padding dell'header è responsive in tutti i temi: è una percentuale della larghezza dello schermo, quindi si adatta automaticamente alle dimensioni dello schermo.
​

Il padding influisce su quanto "pesante" appare l'header:
​

Più padding = più leggero e arioso
​

Meno padding = più denso e compatto
​

Scegli la sensazione che vuoi trasmettere agli ospiti quando visitano il sito!
​

Il padding lavora insieme all'allineamento per creare l'aspetto dell'header:
​

Contenuto centrato + molto padding: elegante, formale
​

Contenuto allineato a sinistra + padding minimo: moderno, pulito
​

Allineato al centro + padding minimo: compatto, efficiente
​

Troppo: l'header occupa metà schermo prima che gli ospiti vedano qualsiasi contenuto
​

Troppo poco: l'header sembra stretto e difficile da leggere
​

Squilibrato: padding superiore e inferiore molto diversi senza motivo
​

Non provare su mobile: perfetto su desktop, pessimo sui telefoni
​

I cursori non mostrano un'unità di misura. Dietro le quinte, il padding è una percentuale (%) della larghezza dello schermo, ed è per questo che si riduce sugli schermi più piccoli.
​

Padding: lo spazio all'interno dell'header (intorno al contenuto)
​

Margine: lo spazio all'esterno dell'header (tra l'header e gli altri elementi)
​

Questi cursori regolano il padding, cioè lo spazio all'interno dell'header. Non esiste un'impostazione per il margine dell'header.
​

Se non sei sicuro:
​

Parti dall'impostazione attuale
​

Regola gradualmente (uno o due scatti del cursore alla volta)
​

Annota la posizione iniziale dei cursori, perché non c'è un pulsante per ripristinarli
​

Il padding dell'header resta invariato mentre gli ospiti scorrono la pagina.
​

Il padding non cambia le dimensioni di pulsanti o link, quindi non rende nulla più difficile da toccare
​

Troppo padding spinge i contenuti più in basso, quindi sui telefoni gli ospiti devono scorrere di più
​

Bilancia estetica e usabilità!
​

Il padding dell'header è un dettaglio sottile che fa una grande differenza in quanto il sito appaia curato e professionale. Vale la pena dedicare qualche minuto a regolarlo alla perfezione!
​