HTML bannery jsou jedním z nejoblíbenějších způsobů, jak upoutat pozornost uživatelů na síti. Jsou světlé, nápadné a dokážou předat důležitou zprávu v co nejkratším čase. Vytváření takových bannerů dříve vyžadovalo programovací dovednosti, ale nyní si pomocí nástrojů, jako je Figma, může každý bez větších obtíží vytvořit svůj vlastní HTML banner.
V této podrobné příručce vám řekneme, jak vytvořit HTML banner ve Figma krok za krokem. Od začátku do konce vám ukážeme, jak vybrat správnou velikost, upravit barvy a písma, přidat potřebné prvky a exportovat hotový banner do kódu HTML. Podle těchto pokynů budou moci i začátečníci vytvořit profesionálně vypadající banner, který upoutá pozornost uživatelů a pomůže dosáhnout stanovených cílů.
Začneme výběrem velikosti banneru. Velikost banneru závisí na kontextu, ve kterém bude použit. Některé standardní velikosti zahrnují 728x90, 300x250 a 320x50 Pixelů. Pro váš banner si však můžete vybrat i jinou velikost, která vyhovuje vašim potřebám a omezením.
Nyní přejdeme k výběru barev a písem. Barvy a písma hrají důležitou roli při vytváření efektního HTML banneru. Můžete použít barvy, které odpovídají vaší značce, nebo nastavit barevnou paletu barev, aby byl banner jasnější a atraktivnější. Výběr správného písma navíc pomůže přidat vašemu banneru profesionální vzhled.
Krok 1: Stažení Figma
Budete vyzváni k registraci nebo přihlášení pomocí přihlašovacích údajů Google nebo Apple. Poté budete mít přístup k základním funkcím Figma.
Stáhněte si Figma do svého zařízení a spusťte aplikaci. Po úspěšné instalaci budete moci začít pracovat na vytvoření banneru HTML ve Figmě.
Registrace a instalace aplikace
Chcete-li začít s aplikací, musíte se zaregistrovat a nainstalovat ji na svůj gadget. Plugin pro aplikaci lze stáhnout z oficiálních webových stránek vývojáře nebo z příslušného obchodu s aplikacemi.
Zde je návod krok za krokem:
- Přejděte na oficiální web aplikace nebo otevřete obchod s aplikacemi na vašem zařízení.
- Najděte stránku s informacemi o aplikaci.
- Klikněte na tlačítko "Stáhnout"nebo " nainstalovat".
- Počkejte, až se aplikace stáhne a nainstaluje do vašeho zařízení. To může trvat několik minut, v závislosti na rychlosti vašeho internetového připojení.
- Po instalaci otevřete aplikaci.
- Zaregistrujte se podle pokynů na obrazovce. Obvykle budete muset zadat své jméno, e-mailovou adresu a přijít s heslem.
- Po úspěšné registraci můžete aplikaci začít používat!
Nezapomeňte uložit přihlašovací údaje do aplikace (přihlašovací jméno a heslo) na bezpečné místo. Tyto údaje nepředávejte třetím stranám.
Krok 2: Vytvoření nového projektu ve Figma
Chcete-li vytvořit banner ve Figmě, prvním krokem je vytvořit nový projekt. Začněte podle pokynů níže:
- Otevřete Figma a přihlaste se ke svému účtu.
- Po přihlášení klikněte na tlačítko" Vytvořit nový Projekt " na domovské stránce.
- Poté dejte projektu název, který nejvíce odpovídá jeho obsahu (například "banner pro web").
- Vyberte prázdnou šablonu projektu a začněte s čistým štítem.
Po dokončení těchto kroků budete mít ve Figmě nový projekt připravený k vytvoření vašeho HTML banneru. V dalším kroku se podíváme na značení a design banneru.
Výběr typu projektu a zadání názvu
Než začnete ve Figmě vytvářet HTML banner, musíte vybrat typ projektu a zadat mu název.
Typ projektu určuje velikost a orientaci banneru. Můžete si například vybrat typ projektu " web banner "a nastavit velikost v pixelech, nebo vybrat typ projektu" interaktivní banner " a nastavit velikost v pixelech nebo jako procento velikosti stránky.
Název projektu musí být srozumitelný a popisující jeho podstatu. Dobře zvolený název vám pomůže rychle najít projekty na seznamu a orientovat se ve svých dílech.
Příklad:
Typ projektu: web banner
Velikost: 300x250 pixelelů
Název projektu: prodej letní obuvi
Když jste vybrali typ projektu a zadali mu název, jste již připraveni začít vytvářet banner HTML ve Figmě.