TAGLIO 01 / Screenshot
9 cose da fotografare sul tuo sito prima di girare un annuncio
Un set di screenshot utile copre nove parti specifiche di un sito: l'hero completamente caricato, un dettaglio prodotto a dimensione ispezionabile, la tabella prezzi completa, una sezione prova specifica, lo step di checkout, le viste mobile e desktop a confronto, uno stato di interazione, uno stato vuoto e qualsiasi elemento di confronto presente sul sito.
Prima di girare un annuncio a partire dal tuo sito, fotografa nove elementi specifici: l'hero una volta che ogni asset ha finito di caricarsi, un dettaglio prodotto abbastanza grande da poter essere ispezionato, la tabella prezzi completa, una sezione prova specifica, lo step esatto di prenotazione o checkout, le viste mobile e desktop a confronto della tua sezione più forte, uno stato di hover o interazione, un eventuale stato vuoto che un nuovo visitatore potrebbe vedere, e un elemento di confronto o prima/dopo se il sito ne ha uno. Ogni screenshot deve mostrare qualcosa che uno spettatore possa riconoscere e in cui possa fidarsi, non solo riempire uno spazio nel montaggio.
1. L'hero, una volta che ogni asset ha finito di caricarsi
Fotografa l'hero dopo che la pagina si è completamente assestata, non al primo rendering. Molti siti mostrano un'immagine placeholder, caricano un webfont con un attimo di ritardo, o fanno comparire un titolo in dissolvenza, quindi uno screenshot preso troppo presto può catturare un layout che nessun visitatore reale vede per più di un secondo. Carica la pagina da zero, aspetta che immagini, font ed eventuali animazioni dell'hero finiscano, poi cattura lo screenshot. Se l'hero include un video di sfondo, ferma il fotogramma che rappresenta meglio il prodotto invece di uno sfocato a metà transizione. Questo screenshot apre spesso l'annuncio, quindi deve corrispondere a ciò che un visitatore vive davvero, non a uno stato di caricamento che esiste solo per un istante.
2. Un dettaglio prodotto a una dimensione realmente ispezionabile
Non fotografare l'intera pagina aspettandoti che il prodotto resti leggibile una volta ritagliato in un formato verticale. Zoomma sul dettaglio specifico che prova l'offerta: un primo piano del materiale, un valore su una dashboard, una voce di menu o un pannello funzionalità, catturato abbastanza grande da mantenere testo e bordi leggibili una volta inserito in una tela 1080x1920. Uno screenshot dell'intera pagina riduce ogni elemento a una piccola frazione dell'inquadratura, e proprio il dettaglio che conta finisce troppo piccolo per essere letto. Cattura il dettaglio da solo, alla risoluzione di cui ha bisogno, e lascia che la pagina più ampia dia contesto altrove nel montaggio invece che in questo scatto.
3. La tabella prezzi, catturata a piena larghezza
Fotografa l'intera sezione prezzi in un'unica immagine, con ogni piano e il relativo prezzo visibili, invece di uno scatto parziale che taglia via una colonna. Gli spettatori usano il prezzo per decidere se un'offerta merita ulteriore attenzione, quindi un prezzo ritagliato o parzialmente visibile crea confusione invece di chiarezza. Se la tabella è più larga di un singolo schermo, catturala in sezioni ricomponibili, oppure catturala a una larghezza del browser in cui tutti i piani entrano. Verifica che la valuta, il periodo di fatturazione ed eventuali etichette di sconto siano tutti visibili nello stesso scatto; un prezzo mostrato senza il suo periodo può travisare l'offerta reale una volta a schermo.
4. Una sezione prova, scelta per ciò che dice davvero
Scegli la recensione, il caso studio o la testimonianza che nomina un risultato specifico, non quella che dice semplicemente che qualcosa è buono. Uno screenshot di "ottimo servizio, lo consiglio" prova meno di uno che cita un numero, un risultato o un dettaglio concreto, perché un claim specifico dà allo spettatore qualcosa da valutare. Fotografa la sezione prova esattamente come appare sul sito live: nome reale, data reale, contesto reale, perché inventare o rimettere in scena una recensione è proprio il tipo di scorciatoia che fa sembrare un annuncio fabbricato nel momento in cui qualcuno verifica. Se il sito ha più sezioni prova, scegli quella più rilevante rispetto all'hook con cui pensi di aprire, non semplicemente la più recente o la più lunga.
5. La schermata esatta in cui il visitatore si impegna
Fotografa il momento esatto dell'azione: il calendario con uno slot libero visibile, il riepilogo carrello appena prima del pagamento, o il modulo con il pulsante finale visibile. Questo si differenzia dal fotografare la pagina di prenotazione in generale, perché l'obiettivo è mostrare lo step specifico che il visitatore completa, non la pagina che lo precede. Se questo step è nascosto dietro diversi clic, o funziona solo dopo aver compilato campi non correlati, lo screenshot esporrà il problema prima ancora dell'annuncio, il che è di per sé un'informazione utile. Una checklist correlata su i segnali che un sito non è pronto a diventare un video ad copre cosa sistemare prima se questo step non regge.
6. La stessa sezione su mobile e desktop
Cattura la tua sezione più forte sia in un viewport mobile sia in uno desktop, perché molti siti riorganizzano i contenuti tra i due invece di limitarsi a ridimensionarli. Un layout a tre colonne su desktop potrebbe impilarsi in un'unica colonna su mobile, cambiando cosa è visibile senza scorrere. Conoscere entrambe le versioni conta perché un annuncio verticale di solito richiede un ritaglio in stile mobile, e partire da un layout già impilato verticalmente è più facile che forzare un layout desktop largo in un'inquadratura stretta. Cattura entrambi gli screenshot alla larghezza mobile reale del browser, non uno screenshot desktop rimpicciolito, perché un vero layout mobile spesso rivela o nasconde elementi diversi rispetto a uno semplicemente ridimensionato.
7. Uno stato di hover o interazione, non solo la pagina a riposo
Alcune delle prove più utili compaiono solo in interazione: un menu a tendina, un tooltip che spiega una funzionalità, un pannello filtri o lo stato attivo di un pulsante. Fotografa la pagina solo a riposo e perderai proprio la funzionalità che potrebbe essere il vero motivo d'acquisto. Attiva manualmente l'interazione, mantienila, e catturala in quello stato. Questo conta soprattutto per prodotti in cui il valore sta in un preciso comportamento dell'interfaccia più che in un layout statico, come un risultato di ricerca live che compare o un prezzo che si aggiorna dopo una selezione. Annota quale interazione hai catturato e perché, così chi monta può abbinarla a una riga che spiega cosa sta succedendo a schermo.
8. Qualsiasi stato vuoto che un nuovo visitatore potrebbe realmente vedere
Uno stato vuoto è ciò che un utente alla prima visita vede prima di aver aggiunto qualsiasi cosa: un carrello vuoto, una dashboard senza dati, un risultato di ricerca vuoto. Se il tuo flusso di onboarding mostra questa schermata a ogni nuovo visitatore, vale la pena sapere che aspetto ha prima di decidere se includerla nell'annuncio. Uno stato vuoto può indebolire una promessa, come "vedi i tuoi risultati all'istante", se è la prima cosa mostrata, oppure può davvero aiutare a impostare le aspettative se l'annuncio è onesto su uno step di configurazione. Fotografalo comunque, così la scelta di includerlo o evitarlo è deliberata e non casuale.
9. Un elemento di confronto o prima/dopo, catturato a entrambi gli estremi
Se il sito ha uno slider, un confronto affiancato o un toggle tra due stati, fotografa entrambi gli estremi separatamente invece di provare a catturare l'elemento interattivo a metà trascinamento. Uno slider bloccato a metà di solito sembra rotto più che informativo. Cattura la posizione "prima", poi la posizione "dopo", ciascuna come uno scatto pulito, così chi monta può ricreare il reveal in modo deliberato con un timing corretto invece di affidarsi a un unico screenshot raffazzonato. Se il confronto dipende da un hover o un clic per cambiare stato, annota il trigger esatto così la stessa vista può essere riprodotta in modo coerente in seguito, invece di indovinarla dopo il fatto.
Niente di tutto questo va catturato a mano ogni volta. Incolla un URL e sizzledraft fa catturare da un browser headless il sito reale così come lo vedrebbe un visitatore, poi costruisce il video a partire da quegli screenshot reali invece che da un'ipotesi ridisegnata. Se preferisci vederlo piuttosto che pianificarlo, parti dal tuo sito.
Altre note pratiche, zero fuffa.
VEDI TUTTE LE NOTE →