Jak si udělat vlastní banner?

Chcete si vytvořit hezkou, animovanou, ... ikonku webu nebo blogu a nevíte si rady!! S tímto návodem to bude hračka. Jsou 2 možnosti >

  1. Pomocí tohoto odkazu si můžete vytvořit banner nebo ikonku. Je to on-line nástroj pro tvorbu bannerů ale, moc možností jak ho udělat nemáte. Prostě on-line! Mě se líbil do té doby, než jsem objevil možnost č.2.
  2. Je o dost složitější ale stojí zato. Příklad >

 

Zde postupujte podle pokynů ...

1.část

 Nejprve si vybereme obrázek, nebo obrázky, ze kterých chceme ikonku nebo banner tvořit.

Můžeme si použít již šablonky, které mají už určenou velikost ( ikonka: 88x31, banner: 468x60) nebo si obrázky na požadovanou velikost upravíme zmenšením nebo ořezem. ( Upravujeme třeba v PhotoFiltre)

Jak tvořím já?

Potřebuji k tomu tyto prográmky. Ulead GIF Animator 5.0 a Zoner GIF Animator 5

Nejprve si otevřu Zoner GIF Animator 5.

Oba tyto programy jsou ke stáhnutí zde.

 

Naskládám si obrázky, tak jak chci, aby šli za sebou ( vložit vektor) obrázek 1

 

Pak si to uložím do PC. Obrázek 2

 

Otevřu si Ulead GIF Animator 5.0

 

Dám vložit a vložím to co jsem vytvořil v prvním programu..obrázek 3

 

Pak kliknu na první obrázek dole, a když je zamodřený, kliknu na „ T“ přidat text.obrázek 4

 

Otevře se tabulka na úpravu textu. Je zde možnost měnit styl, velikost a barvy textu, efekty pohybu textu a také přidat neonové ohraničení textu podle barev. Obrázek 5

 

Zde je potřeba si vyzkoušet možnosti, je jich zde moc. Vždy se mohu podívat na výsledek „ Start Preview“

 

Když jsem spokojený s výsledkem dám OK a tu první možnost uložení.

 

Pak kliknu na druhý obrázek a pokud chci do něj také text celé to opakuji.

 

Teď buď mohu nechat výsledek jak je a nebo ještě zvolit přechody obrázků: obrázek 6

 

Vyberu styl přechodu ( chce si to vyzkoušet) otevře se tabulka na úpravu i s výsledným náhledem. Zde si zvolím styl přechodu a dám OK. Obrázek 7

 

Přechody se vkládají vždy na poslední obrázek za písmo.

Když mám hotovo prohlédnu si svůj výtvor. Obrázek 8

 

Když jsem spokojený, dám uložit v tomto pořadí.

File, Save As, Gif File

 

Uložím do PC a HOTOVO obrázek 9

 

Takto podobným způsobem tvořím i loga do hlaviček stránek a tak.

 

Výsledek: 

 https://vse-pro-vas-web.webnode.cz/

 

A teď 2. část ( vytvoření HTML kódu na banner / ikonku )

( je to nejlepší kód co jsem našel ) díky webu

https://kampanzaspravnychod.blog.cz/0802/jak-vytvorit-klikaci-ikonku#comment79756386

 Pokud budete tvořit HTML kód, ikonku nebo banner uložte na web ! ( krok 3 )

Použijeme tento kód:

Všechny tučné části nahraďte podle tohoto zadání:

1. Adresa vašeho blogu / webu   -na tu bude ikonka odkazovat
2. Příkaz,aby se váš blog se otevře v novém okně. Na blog.cz to nefunguje,ale weby mimo blog.cz to ocení,protože jim neodvedete návštěvníka.
3. Adresa obrázku,který bude vaší ikonou. Zjistíte ji tak,že na obrázek kliknete pravým tlačítkem myši a zvolíte kopírovat adresu obrázku.
4. Text,který se zobrazí,kdaž se obrázek načítá nebo když má uživatel vypnutou podporu obrázků. Volte výstižný text,protože pro vyhledávače to tvoří text odkazu.
5. Text,který se zobrazí,když chvíli podržíte myš na ikonce. Měl by obsahovat krátký (ale delší než v alt) popisný text.
6. Obrázek bude bez rámečku. Na blog.cz je to k ničemu,ale mimo blogto bude fungovat tak,že obrázek nebude podtržený.
7. Šířka obrázku. Měla by být spíš menší,protože člověk si na web dá rači menší než větší ikonku a z pohledu SEO to vyjde nastejno. Ideální je třeba 88.
8. Výška obrázku. Platí to samé co pro šířku. K šířce 88 je ideální 31.
9. V tomto parametru můžete obrázek nastylovat v CSS.