Animerte bannerannonser: bevegelse som hjelper budskapet

Gode animerte bannerannonser bruker bevegelse til å fange blikket én gang, og går så av veien for budskapet. Den pålitelige strukturen er tre rammer: en krok, verdien og en sluttramme med merkevaren og en tydelig handlingsoppfordring som blir stående på skjermen. Hold hele sekvensen kort, få den siste rammen til å fungere som en stillestående annonse alene, og hold filen lett, for annonsenettverk begrenser både hvor lenge animasjonen går og hvor tung filen kan være.

Storyboard i tre rammer

Bannerannonser ses i forbifarten, ved siden av noe leseren faktisk kom for. Ingen venter på at et banner skal bli ferdig. Planlegg sekvensen slik at hver ramme gir mening alene og rekkefølgen forteller en bitteliten historie.

1. 1

   Ramme 1: kroken

   Én kort linje eller ett slående bilde. Den eneste jobben er å få noen til å se. «Pulten din, roligere.» To til tre sekunder.

2. 2

   Ramme 2: verdien

   Det du tilbyr, med leserens ord. «Kabelskinner som passer enhver pult.» To til tre sekunder.

3. 3

   Ramme 3: sluttrammen

   Logo, tilbudet i korte trekk og en handlingsoppfordring formet som en knapp. «Se utvalget.» Denne rammen blir stående til annonsen stopper.

Det samme storyboardet fungerer for annonser i sosiale medier, som som regel er korte videoer i stedet for bannere. Design av Facebook-annonser og design av Instagram-annonser dekker de formatene.

Timing og looper i animerte bannerannonser

Mange annonsenettverk og utgivere begrenser hvor lenge animasjonen kan gå og hvor ofte den kan loope, og grensene varierer. Google Ads begrenser for eksempel opplastede animerte annonser til 30 sekunder animasjon. Sjekk den gjeldende spesifikasjonen for hvert nettverk du kjøper fra, og design slik at annonsen slutter på sin sterkeste ramme uansett grense.

Standardstørrelser for bannerannonser

Displaynettverk bruker et sett standardstørrelser. En kampanje dekker som regel flere av dem, så design et system i stedet for én annonse: et oppsett som omorganiseres for brede, høye og små plasser og beholder de samme ordene, fargen og bevegelsen.

GIF eller HTML5 for animerte bannere

De fleste displaynettverk tar imot animerte annonser som enten GIF eller HTML5, en liten pakke med HTML, CSS, JavaScript og bilder. HTML5 gir jevnere bevegelse, skarp tekst i enhver tetthet og full farge, og passer rikere annonser. GIF er enklere å lage og godtas nesten overalt, men grensen på 256 farger gir striper i gradienter. Grensene for filstørrelse er strenge for begge, målt i kilobyte og ikke megabyte, så sjekk spesifikasjonen til hvert nettverk.

Velger du GIF, holder teknikkene i animerte GIF-er vekten nede: færre rammer, en palett bygget fra animasjonen og så lite av rammen i bevegelse som mulig. For selve bevegelsen er konsekvent easing det som skiller et polert banner fra et hakkete.

Designregler som får bannere til å fungere

En særpreget bakgrunn er den billigste måten å bli gjenkjent på gjennom en kampanje. Når det samme fargefeltet beveger seg bak hver ramme og hver størrelse, begynner folk å forbinde bevegelsen med deg før de leser et ord. Test varianter av kroken i stedet for hele annonsen; testing av annonsemateriell forklarer hvordan du gjør det rettferdig.

Gradiently passer den sosiale siden av en kampanje. Design kroken og sluttrammen på en Mark som tilhører deg, endre til 1080×1080, 1080×1350 og 1080×1920 i ett steg med Pro, og eksporter hver som MP4. Marken gjengis for hvert format, så det rolige området fortsatt ligger bak ordene i alle størrelser.