Vítám vás u závěrečného článku o MS FrontPage. Dnes vám zde ukážu, jak vytvořit velice slušnou stránku pomocí FrontPage, ale přidáme i nějaké scripty. Také se podíváme na zdrojový kód vytvořené stránky a vysvětlíme si alespoň několik základních věcí.
Při tvorbě stránky musíte myslet na uživatele, který bude stránku prohlížet. Někdo může prohlížet stránky v jiném rozlišení, v jiném prohlížeči, v jiném nastavení barev atd. Měli byste proto vytvořit stránky, aby uspokojili uživatele jakýchkoliv nastavení počítače. V dnešní době se nejčastěji používá rozlišení 800x600 a prohlížeč Internet Explorer. Celé vaše stránky by měly být vytvořené při rozlišení 800x600. Je to takový střed, a pokud bude mít uživatel rozlišení 1024x768, tak to nebude zase tak nejhorší. Naopak, když použijete při tvorbě rozlišení 1024x768 a uživatel bude prohlížet stránku s rozlišením 640x480, tak mi můžete věřit, že nebude mít velkou radost ze zobrazení stránky.
Máme tedy zapnutý FrontPage a chceme vytvořit stránku. Základem je stránku rozdělit. V dnešní době se nejvíce používá: vlevo menu, nahoře obrázek (logo), a mění se pouze střed stránky po kliknutí na odkaz v menu. My si vybereme přesně tento příklad. Stránku můžete rozdělit rámy, ale ty mají spoustu nevýhod. Mezi nejzákladnější patří, že je každý prohlížeč nepodporuje a že se nemění adresa stránky po kliknutí na odkaz. Proto už pokročilejší uživatelé používají tabulky. Ty mají však tu nevýhodu, že se pomalu zobrazují. V tomto seriálu použijeme tabulky, nikoliv rámy.
Naším úkolem je teď po celé stránce umístit neviditelnou tabulku rozdělenou na tři části. Připomínám, že tabulka musí být úplně v rohu a po okrajích stránky. Pokud by se vám tabulka nepovedla, otevřete stránku v poznámkovém bloku a vložte do ní tento kód:
<table border="0" width="729" cellspacing="0"
cellpadding="0">
<tr>
<td width="803">
<table
border="0" width="91%" cellspacing="0"
cellpadding="0">
<tr>
<td
width="100%"></td>
</tr>
<tr>
<td
width="100%">
<table border="0" width="762" cellspacing="0"
cellpadding="0">
<tr>
<td width="154"
valign="top"><br>
<p> </p>
</td>
<td
width="604"
valign="top">
<p> </p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
Hlava stránky se říká horní části stránky, tedy v té, kde mi budeme mít nějaký obrázek, logo nebo pouze nápis. My nahoru vložíme pouze obrázek vytvořený v nějakém grafickém programu. Můžete použít např. tyto programy: Corel Photopaint, Adobe Photoshop, Zoner Callisto, Paint Shop Pro .... Jestli nějaký z těchto programů nevlastníte a ani nemáte možnost ho sehnat, buď si stáhněte nějaký horší program z internetu nebo musíte využít obyčejného malování či ozdobného nápisu. Obrázek vytvořte a teď ho musíte převést do formátu, který se na webu používá. Jsou to formáty: GIF, JPG a PNG. V grafických programech obrázek převedete do jiného formátu obvykle příkazem Exportovat.
Mozkem stránky bude naše menu umístěné vlevo stránky. Myslím, že je zbytečné vysvětlovat, proč zrovna mozek stránky. Teď je důležitá část, a to menu. Můžete udělat buď obyčejné textové nebo pěkné grafické. My se podíváme na to, jak sehnat grafické. Pokud nejste graficky nadaní, tak budete muset najít způsob, jak vytvořit pěkné menu jinak. Můžete zajít na internet a hledat stránky zabývající se grafikou: http://www.jaknaweb.com/, http://www.egrafika.net/, http://www.dynamicdrive.com/. Zde najdete většinou hodně scriptů a webové grafiky. Grafika se ale strašně těžko upravuje. Slušná tlačítka naleznete na stránce http://www.flashbuttons.com/.
Můžete však také použít nějaký program na tvorbu tlačítek. Naleznete jich spousta, ale je potřeba nalézt ten pravý. Nejlepší program, který znám a který se zabývá web grafikou, se jmenuje Xara Webstyle. Starší druhou verzi zdarma seženete ve starším vydání časopisu CHIP (únor 2003) a PC world. Je to program plný šablon, které potom pouze upravujete. Pokud ho neseženete, podívejte se po nějakém jednodušším, jako je třeba DHTML MENU WIZARD ze stránky http://www.scriptocean.com/.
A konečně tělo stránky. Je to tedy střed, který se bude měnit v závislosti na tom, jak budete klikat na odkazy v menu.
Po vytvoření menu je třeba zkopírovat stránku a vložit ji tolikrát, kolik máte položek v menu. Musíte si dávat pozor na funkčnost odkazů, protože při kliknutí na položku v menu se dostanete na jinou stránku, kde odkazy nemáte nastavené.
Stránky se samozřejmě nedělají jen v HTML, ale v jiných jazycích. Pro ty, kdo žádný scriptovací jazyk neumí, existují stránky, kde se dá naučit. Ovšem někdo potřebuje jen určitou věc, kvůli které není třeba se jazyk učit. Např. barva rolovací lišty apod. Pak je tu pár adres, na kterých třeba najdete, co hledáte. Na web grafiku a scripty se podívejte na: http://www.egrafika.net/ a http://www.jaknaweb.com/. Pokud byste potřebovali poradit, zavítejte na http://www.grafika.cz/ a na http://www.builder.cz/ [/cldata/3653/dmenu.zip">DHTML MENU WIZARD ze stránky http://www.scriptocean.com/.
A konečně tělo stránky. Je to tedy střed, který se bude měnit v závislosti na tom, jak budete klikat na odkazy v menu.
Po vytvoření menu je třeba zkopírovat stránku a vložit ji tolikrát, kolik máte položek v menu. Musíte si dávat pozor na funkčnost odkazů, protože při kliknutí na položku v menu se dostanete na jinou stránku, kde odkazy nemáte nastavené.
Stránky se samozřejmě nedělají jen v HTML, ale v jiných jazycích. Pro ty, kdo
žádný scriptovací jazyk neumí, existují stránky, kde se dá naučit. Ovšem někdo
potřebuje jen určitou věc, kvůli které není třeba se jazyk učit. Např. barva
rolovací lišty apod. Pak je tu pár adres, na kterých třeba najdete, co hledáte.
Na web grafiku a scripty se podívejte na: http://www.egrafika.net/ a http://www.jaknaweb.com/. Pokud byste potřebovali poradit,
zavítejte na http://www.grafika.cz/ a na Autor: Lukáš Souček, soucek.l@email.cz
Rubrika: Software - MS Office
--- Vytištěno 20.5.2003 22:21:40 ze serveru PC Svět ---