Thumbnail o background: come scegliere – ZenBlocks buttonBasic
Conclusione
La **thumbnail** e un’immagine indipendente dentro il pulsante. Il **background** e lo strato di base dell’intero pulsante.
—
Confronto
| Criterio | Thumbnail | Background |
|—|—|—|
| Posizione | Dentro il pulsante | Sfondo globale del pulsante |
| Relazione con testo | Affiancata o sopra/sotto | Testo sopra l’immagine |
| Controllo dimensione | `Larghezza` / `Altezza` dedicati | `Background Dimensione` |
| Hover | Variazione dimensione/posizione | Variazione via overlay/colore |
| Video | No | Si |
| Sovrapposizione | No | Si |
| Bordo radius | Gestione propria | In genere segue il pulsante |
| Responsive | Per dispositivo | Per dispositivo |—
Quando usare cosa
### Usa thumbnail quando
1. Vuoi mostrare prodotto/logo specifico.
2. Vuoi composizione testo + immagine nel pulsante.
3. Vuoi stile separato per l’immagine.
4. Vuoi zoom immagine al hover.### Usa background quando
1. Vuoi creare atmosfera visiva generale.
2. Vuoi testo sopra foto con overlay.
3. Ti serve video di sfondo.
4. Vuoi differenze `Predefinito/Hover`.### Usare entrambi insieme
Possibile combinare:
– background per atmosfera,
– thumbnail per visual principale,
– testo CTA per azione.—
Note
– Thumbnail usa `object-fit`; con certi rapporti puo tagliare l’immagine.
– Sovrapposizione troppo opaco puo nascondere lo sfondo.
– Media pesanti riducono le prestazioni.—
Impostazioni correlate
– [Impostazioni miniatura](../thumbnail/)
– [Impostazioni sfondo](../background/)
– [Impostazioni layout](../layout/)