Jak na tvorbu bannerů?

30. 10. 2020

Bannerová reklama je jedním z online marketingových nástrojů, jak svoji firmu zviditelnit. S bannerovou reklamou můžete vytvořit povědomí o vaší nové značce či produktu, budovat brand a připomínat se zákazníkům.

 

Jedná se o druh reklamy, který se zobrazuje na webových stránkách či v aplikacích. Nejčastěji se jedná o obrázek či animaci, případně interaktivní grafiku. Jejím úkolem je upoutat pozornost návštěvníků.

Bannerová reklama

Proč používat bannerovou reklamu?

Bannerové reklamy pomáhají budovat firemní značky a povědomí o firmě, podporují prodej výrobků či služeb, upozorňují zákazníky na speciální akce a propagují jejich novinky. Díky bannerové reklamě můžete zvýšit povědomí o značce a budovat vizuální podobu, podle které si vás budou lidé pamatovat.

 

Na rozdíl od textové reklamy se grafická reklama zakládá na obrázcích a ilustracích, které jsou spojené s reklamním sdělením. Tato kombinace grafických prvků a textu zaujme každého hned na první pohled, a proto jsou bannery velmi účinnou součástí kampaně.

Proč bannerová reklama?

Kde se bannerová reklama zobrazuje?

Bannerovou reklamu je možné zobrazovat na reklamních prostorech, které jsou k tomu určeny. Tyto reklamní prostory je možné pronajímat u provozovatelů stránek jakou jsou například Google Ads, Sklik, Facebook Ads, Instagram ads či mnoho dalších webových stránek. Za tento prostor, který je poskytovaný reklamními systémy, se nejčastěji platí za proklik nebo za stanovený počet zobrazení.

Jak by měl vypadat dobrý banner?

Správně navržený banner by měl umět upoutat pozornost diváků. Vhodné je tvořit jednoduché bannery, které budou dobře čitelné a nebudou obsahovat příliš textu a informací.

 

Důležité je, aby bylo sdělení na banneru čitelné, proto je důležité používat vhodná písma, která se budou divákům snadno číst. Dobré je se vyhnout ozdobnému nebo ručně psanému písmu. Dále je také potřeba dávat pozor při volbě velikosti písma. Když bude písmo příliš malé, bude sdělení pro lidi špatně čitelné a diváci ho nepřečtou. Když bude příliš velké, nebude banner působit seriózně a přirozeně.

 

Základem je také vhodně zvolený a výstižný text, který dokáže na první pohled zaujmout. Je lepší volit kratší texty či hesla než přehnaně dlouhé texty, které budou působit nezajímavě a přeplácaně.

Jak by měl vypadat banner

Co nesmí v banneru chybět?

Rozhodně CTA tlačítko (z angličtiny Call to action) je další podstatnou součástí banneru. Nabádá zákazníky k provedení vybrané akce. Svým vzhledem podněcuje diváky ke stisknutí tlačítka. Tento prvek dokáže zvýšit efektivitu banneru a počet prokliků. Může obsahovat výzvu k akci jako například: zjistit více, ukázat, koupit, zobrazit, prohlédnout, zaregistrovat atd.

 

Ať už se jedná o zakoupení produktu, registraci či odběru newsletteru, mělo by být tlačítko by mělo být výrazné a kontrastní s ostatním obsahem banneru. Proto je vhodné vybrat dostatečně výraznou a kontrastní barvu tlačítka s textem, který by měl vyzívat k akci. Na banneru by se nemělo vyskytovat více objektů, které jsou podobné CTA tlačítku, aby neodváděli pozornost od tlačítka a pro diváky bylo na první pohled jasné, kam mají klikat. Lze také vytvořit stín tlačítka, který zajistí, že bude tlačítko působit více prostorově a reálněji.

CTA tlačítka na bannerech

Neodmyslitelnou součástí banneru je i logo firmy, které se nejčastěji umísťuje do horní části banneru. Mělo by být dostatečně viditelné a čitelné, aby diváci mohli hned rozpoznat o jakou značku se jedná.

 

V banneru lze použít obrázky, fotky, či ilustrace, které umí rychle vizuálně pozornost diváků, ale nesmí se to s nimi přehánět. U některých bannerů si naprosto postačíte s poutavým a výstižným textem. Nejvíce diváky upoutá fotka s lidmi a tvářemi, kterým lidé přirozeně věnují velkou pozornost.

 

Je vhodné ladit banner do firemních barev. Propojit design banneru s například s vašimi webovými stránkami. Budete pak budovat konzistentní design a jednotnou firemní podobu. Podoba s webovými stránkami zvyšuje u zákazníků důvěryhodnost vaší firmy.

 

Jaké jsou druhy bannerové reklamy?

Bannerem může být statický obrázek, nebo animovaný banner, který dokáže přitáhnout pozornost uživatele a vzbudit u něj zájem o daný produkt nebo službu. Animovaný banner zobrazuje více informací, je viditelnější a dokáže mnohonásobně více zaujmout než statický obrázek.

Statický banner

Statické bannery

Statický banner je pouhým obrázkem, u kterého není možné použít pohyblivé efekty. Spojuje ilustrace a grafické prvky s reklamním sdělením. Vytváří se v potřebných rozměrech, které požadují provozovatelé stránek. Nejčastěji se jedná o svislé, vodorovné, obdélníkové a mobilní formáty.

 

GIF bannery

Jedná se o animované bannery, které umožnují obsah rozpohybovat. Díky animaci dokáže velmi efektivně zaujmout a získat si pozornost návštěvníka stránek. Animace nabízí možnost umístit na malý prostor více sdělovaných informací, protože se mohou objekty na ploše postupně střídat či objevovat.

 

Tyto bannery mají jedno velké omezení, a tím je velikost bannerupočet barev. Proto u GIF banneru není možné použít žádné náročné efekty. Barevná paleta může maximálně obsahovat 256 barev. Proto není vhodné tento typ banneru používat pro přechody fotografií, které by nebyly plynulé.

 

Čím delší, plynulejší a s větším množstvím barev bude animace, tím bude jeho datová velikost větší a může přesáhnout maximální velikost stanovenou provozovatelem stránek. Může se stát, že při plynulém posunu pouze jedné fotografie může dojít překročení maximální povolené velikosti souboru.

 

 

Ukázka GIF banneru s minimálním pohybem

Velikost 68 kB

Animovaný GIF banner

Ukázka GIF banneru s pohybujícim se prvky

Velikost 148 kB

Je vidět nárůst datové velikosti a špatná plynulost animací.

Animovaný GIF banner se složitější animací

Ukázka GIF banneru s plynulejším pohybem

Velikost 1139 kB

Pokus o plynulejší animace znamená značné zvětšení banneru, která již není akceptovatelná většinou reklamních sítí.

Animovaný GIF banner se složitější a plynulejší animací

Ukázka GIF banneru s plynulým pohybem a menším počtem barev

Velikost 412 kB

Při zachování plynulosti animace a zmenšením počtu barev z 256 na 23 se podařilo zmenšit velikost banneru, ale za cenu výrazně horšího vzhledu.

Animovaný GIF banner se složitější a plynulejší animací a omezeným počtem barev.

HTML 5 bannery

Jde také o animovaný banner, který je vytvořený pomocí jazyku HTML5. Tyto bannery nabízejí jedinečné možnosti designu a celou řadu reklamních formátů. Reklamy ve formátu HTML5 podporují schopnost interakce s uživateli. Mohou reagovat na pohyb kurzoru či zjistit polohu nebo místní čas uživatele a využít je v reklamě.

 

Soubory mají daleko nižší velikost než GIF bannery, proto umožnují vložit do banneru krátkou sekvenci videa, střídání fotografií či vektorovou animaci. Jednou z nevýhod je, že některé poskytovatelé reklamních služeb nepodporují tento typ bannerů.

 

Ukázka HTML 5 bannerů

Velikost 73 kB, 45 kB, 70 kB a 115 kB

Plynulé animace, hezčí obrázky s plynulými přechody barev při výrazně menší datové velikosti, to jsou HTML 5 bannery.

 

Ukázka velkého rozdílu mezi GIF a HTML 5 bannerem

Jakmile použijeme plynulou animaci v kombinaci s fotografiemi, naplno se ukáže rozdíl.
Velikost 1841 kB oproti 127 kB
14,5× větší datová velikost GIF banneru, špatná kvalita i trhaná animace = nepoužitelný banner

 

Animovaný GIF banner se špatnou kvalitou

AMPHTML bannery

Jedná se o nový formát bannerových reklam, který překonává dosud používané typy bannerů včetně HTML 5. Tento druh banneru lze použít při inzerci na Google ads či na jiných stránkách, které ho podporují.

 

Jednou z jeho předností je rychlejší načítání. AMPHTML bannery jsou oproti HTML 5 znatelně rychlejší. Načtou se dříve, než se stránka zobrazí uživateli. Proto jsou reklamy více viditelné a mají zvýšené CTR. Na rozdíl od HTML 5 bannerů, které obsahují zbytečné množství javascriptových kódů, AMPHTML bannery využívají pouze specifické javasckriptové knihovny. Proto jsou tyto bannery datově méně náročnější, a tím ulehčují dodržení maximální velikosti nahrávaných souborů. Za další výhodu lze brát to, že AMPHTML bannery je možné do systému vložit bez složitého ověřovánísplnění náročných podmínek Googlu. Jedinou nevýhodou by se mohlo zdát menší omezení v nastavení bannerů, jako je například efekt rozmazání. Oproti všem nesporným výhodám se jedná opravdu o drobné negativum.

 

 

 

Ať už jsi vyberete jakýkoliv typ banneru pro vaši reklamu, je potřeba myslet na to, aby banner dokázal zaujmout vaši cílovou skupinu. Při návrhu je základem vybrat poutavé reklamní sdělení, nezapomenout na CTA tlačítko, které bude diváky vyzívat k akci, a vaše logo, díky kterému si zákazníci spojí reklamu s vaší značkou. Také se zamyslet na nad správným výběrem reklamního prostoru, na kterém se bannery budou zobrazovat. Zvolit takové stránky, které vaše cílová skupina navštěvuje.

 

Když jsi při tvorbě a výběru bannerů nebudete jistí, kontaktujete nás, rádi se vším pomůžeme.