|
Vzhled stránky Jestli bude stránka hezká (a často navštěvovaná), o tom rozhoduje především její celková úprava. Není nic platné, že autor dokonale ovládá jazyk HaTMatiLky, pokud má mizerný vkus a na stránku naplácá všechno, co se naučil či někde okoukal. Vkusu nikoho nenaučím, ostatně, ode mne by se daly snadno pochytit všelijaké chyby. Je však důležité naučit se nejdříve přemýšlet, jak má stránka vypadat a teprve poté se pustit do její výroby. Tabulky (viz minulá lekce) jsou poměrně mocným nástrojem v rukou toho, kdo s nimi umí zacházet, kdo má bohatou fantazii a kus papíru při ruce. Uvádím tu několik příkladů použití tabulek k formátování stránky.
Pomocí tabulky je možné do dokumentu vkládat články, ukázky či poznámky. Tento postup je ostatně dobře známý z časopisů (papírových Princip je poměrně jednoduchý: na zvolené místo v textu se vloží tabulka, skládající se z jediného řádku a jediného sloupce; do ní se pak zapíše celý text vloženého článku. Příklad
Při vkládání článků je zapotřebí si uvědomit dvě věci:
Za prvé — obtékání tabulek není zaručeno. Funguje jen tehdy, když uvedete parametr
Za druhé — vložený článek musí být dostatečně krátký. Též je dobré parametrem Především musím zdůraznit, že Internet nejsou noviny. Sloupce v novinách vznikly předenším proto, že příliš dlouhé řádky se špatně četly: když jste došli na konec, těžko jste hledali pokračování. Navíc se stávalo, že krátké odstavce ani celou šíři stránky nezaplnily. Podotýkám, že tenktát měly noviny plochu mnohem větší — zvlášť ve srovnání s monitorem. Používání sloupců se tedy může zdát zbytečným. Přesto má své oprávnění. Například tehdy, když potřebujete uvést seznam odkazů na příbuzné stránky. Nejlepší je, aby byly pohromadě, například u pravého okraje. (Kdo nevíte o čem mluvím, podívejte se nahoru, na začátek této stránky.) Tvorba sloupce je velmi podobná vkládání článku. Tentokrát jsou však v tabulce oba texty: hlavní i ten ve sloupečku. Je vhodné zadat šířku sloupce parametrem width="nn". Příklad
Při používání sloupců je potřeba dát si pozor na délky textu. Typický sloupec, který „přetéká” ze spodní části jednoho slupce do horní části dalšího, aniž by se o to autor staral, neexistuje. Jak jsem řekl — Internet nejsou noviny. Již dříve jsem se zmiňoval o problému obrázků okolo titulku (jeden zprava, jeden zleva). Někdy prostě kousek spadnou a nejsou stejně vysoko. Tento problém je snadno řešitelný pomocí tabulek. Prostě se vytvoří tabulka o jednom řádku a třech sloupcích — v prvním a třetím budou obrázky, prostřední zůstane vyhrazený titulku: Příklad
Všimněte si, že všude je uvedeno V některých případech je vhodné podbarvit text. Například zvýraznit nadpis další části dokumentu. I to se dá udělat pomocí tabulky. Vlastně jde o stejný postup, jako u vloženého článku. Jen šířka tabulky bude 100%. A samozřejmě jest dobré změnit barvu pozadí a barvu písma — ať to stojí za to. Příklad
Samozřejmě, že podbarvení lze použít nejen v titulku. HaTMatiLka normálně neumožňuje obtékat obrázek z obou stran. Trochu to chybí. Ale existuje cesta, jak to (alespoň částečně) nahradit. Samozřejmě — tabulka. Text, do nějž chceme obrázek vložit, je potřeba rozdělit na několik částí. Předně je nutné odhadnout, jak velá část textu bude vedle obrázku. Vše, co je před touto částí nebo za touto částí, zůstane tak, jak je. Blok, ve kterém má být obrázek vložen, rozdělíme na dvě poloviny. Vytvoříme tabulku o jednom řádku a třech sloupcích. Levý (první) sloupec bude obsahovat první část textu, v prostředním bude obrázek a v pravém zbytek. Příklad
Bohužel, toto „obtékání” je poněkud jiné, než na jaké jsme zvyklí. Pokud by někdo toužil po „klasickém” způsobu, kdy text přechází v každém řádku z jedné strany obrázku na druhou, musel by vše sám ručně formátovat a doufat, že nějaký drzý browser jeho výtvor „nesestřelí”.
Přiznám se, že využití tohoto efektu je dost samoúčelné. Jenže se mi strašně líbí titulky na konci filmů a tak jsem hleděl, jak něco takového vyrobit v HaTMatiLce. Pokud se nad tím člověk zamyslí, zjistí, že jde o tabulku o dvou sloupcích a tolika řádcích, kolik je různých nadpisů (funkcí…). Levý sloupec je zarovnán doprava, pravý doleva. (Jasný?) Příklad
Přestože je tabulka 100% široká, doporučuji celou ji vycentrovat. Jinak se může docela snadno stát, že bude kousek posunutá. Též doporučuji v <Body> uvést parametr Neříkal jsem, že základem dobré stránky je dobře formátovaná tabulka? |
Obsah Lekce 1 Lekce 2 Lekce 3 Lekce 4 Lekce 5 Lekce 6 vzhled stránky vložený text sloupec nadpisy obtékání filmové titulky Lekce 8 Lekce 9 Lekce 10 Lekce 11 Lekce 12 |
|