Bezejména.html

Jiří Kosek ml.

Náš poněkud podivný nadpis naznačuje, že dnešní pokračování seriálu nebude zaměřeno na nějakou konkrétní oblast HTML. Místo toho doplníme naše znalosti HTML o několik málo dosud neznámých poznatků. Tím zároveň uzavřeme celou velkou část seriálu věnovanou základům jazyka HTML. V následujících dílech si ukážeme, jak naše znalosti zužitkovat při návrhu profesionálních webovských stránek. U tohoto tématu samozřejmě nezůstaneme provždy, ale budeme pokračovat dál ve výkladu témat, která s HTML a Webem velice úzce souvisí.

Komentáře

Do zdrojového kódu našich stránek můžeme umisťovat poznámky, které se nijak neprojeví ve výsledném zobrazení stránky. Těmto poznámkám se říká komentáře a jejich obecný tvar je:

<!-- komentář -->

Do komentáře můžeme uložit vysvětlení, které nám při pozdější editaci stránky připomene význam některých použitých konstrukcí. Komentáře se využívají rovněž pro předávání příkazů programům, které automaticky zpracovávají HTML dokumenty (o této vlastnosti si povíme více při výkladu dynamicky vytvářených dokumentů). Do komentáře můžeme rovněž uzavřít část stránky, kterou chceme dočasně zneviditelnit pro běžného čtenáře. Nesmíme však zapomenout, že komentář je součástí zdrojového zápisu stránky a že si jej může prohlédnout kdokoliv. Stačí pouze zvolit příslušný příkaz v menu prohlížeče.

Pozadí stránky

Kromě toho, že lze změnit barvu pozadí stránky, lze určit i obrázek, který se objeví místo pozadí. Stránka může být hodně velká a obrázek pozadí se proto podle potřeby pod sebou a vedle sebe opakuje, aby pokryl celou plochu pod stránkou. Z tohoto důvodu je dobré, jako obrázek pozadí volit nějaký vzor, který na sebe navazuje. Obrázek pozadí by stejně tak jako ostatní obrázky, neměl být příliš velký. Rovněž musíme dát pozor na to, aby byl text stránky na pozadí tvořeném obrázkem dostatečně čitelný. Určení obrázku pozadí se provádí atributem BACKGROUND elementu BODY. Hodnotou je URL obrázku:

<BODY BACKGROUND="skvrny.gif">

Základní URL

V části věnované odkazům jsme si vykládali o relativním URL. Výsledné URL jsme získali vždy složením URL stránky s relativním URL. Občas se může hodit změnit základní URL stránky přímo v dokumentu. Slouží k tomu tag <BASE> a jeho atribut HREF. Tag <BASE> musí být uveden v záhlaví stránky (mezi <HEAD> a </HEAD>). Pro objasnění malý příklad. Dejme tomu, že následující stránka má URL http://www.ia.cz/info.html:

<HTML>
<HEAD>
<TITLE>Pokus</TITLE>
<BASE HREF="http://herkules.comp.cz/">
</HEAD>
<BODY>
<A HREF="servis.html">Servisní středisko</A>
</BODY>
</HTML>

Odkaz díky změně základního URL nepovede na stránku http://www.ia.cz/servis.html, ale na stránku http://herkules.comp.cz/servis.html.

Metainformace

V záhlaví každé stránky mohou být uvedeny různé metainformace. Slouží k tomu nepárový element META. Pomocí jeho atribut NAME určíme jméno metainformace a pomocí atributu CONTENT určíme hodnotu této metainformace. Metainformace můžeme uvádět jaké chceme, ale existují i některé standardizované. Mezi ně patří klíčová slova popisující obsah dokumentu (keywords) a stručný obsah dokumentu (description). Praktická ukázka použití:

 ....
<HEAD>
<TITLE>Bungee Jumping</TITLE>
<META NAME="keywords"
 CONTENT="bungee jumping, extrémní sporty, volný pád">
<META NAME="description"
 CONTENT="Oficiální stránka Českého svazu Bungee-Jumpingu">
<META NAME="Author" CONTENT="Jan Novák">
</HEAD>
 ....

Uvádění klíčových slov a popisu stránky je užitečné pro různé vyhledávací stroje (podrobněji viz WWW-dílna v CW 11/97).

Obrázky

U obrázků zařazených pomocí tagu <IMG> lze použít přehršle atributů. My jsme se doposud o některých z nich nezmínili.

Pokud použijeme obrázek jako odkaz

<A HREF="URL1"><IMG SRC="URL2"></A>

nakreslí se okolo něj modrý rámeček. Šířku tohoto rámečku můžeme ovlivňovat pomocí atributu BORDER. Pokud chceme, aby rámeček kolem obrázku nebyl, stačí použít BORDER="0":

<A HREF="URL1"><IMG SRC="URL2" BORDER="0"></A>

Pomocí atributů HSPACE a VSPACE můžeme řídit mezeru, která se vynechá mezi obrázkem a okolním textem. Mezera se udává v pixelech, HSPACE určuje mezeru nalevo a napravo od obrázku -- VSPACE nad a pod obrázkem.

Výslednou velikost obrázku můžeme změnit pomocí atributů WIDTH a HEIGHT. Pokud však obrázek zvětšíme, nebude vypadat moc pěkně. Pokud atributy použijeme ke zmenšení obrázku, zase zbytečně zatěžujeme síť přenosem dlouhého obrázku. Jediné smysluplné využití atributů spočívá v zadání skutečných rozměrů obrázku. Celá stránka pak může být vykreslena rychleji (podrobněji viz WWW-dílna v CW 11/97).

Znakové entity

Znakových entit existuje mnohem více než jsme si zatím řekli. Mezi ty další užitečné patří:

  -- nedělitelná mezera (můžeme ji vkládat ze neslabičné předložky -- př. v lese)

® -- registrovaná známka ®

Na obrázku si můžete prohlédnout, jak vypadá použití pozadí stránky. Stránce odpovídá následující HTML-kód:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<HTML>
<HEAD>
<TITLE>Ukázka pozadí a znakových entit</TITLE>
<META NAME="Author" CONTENT="Jiří Kosek">
</HEAD>
<BODY BACKGROUND="firefall.gif">
<H1 ALIGN=CENTER>Ukázka pozadí a znakových entit</H1>
<H1 ALIGN=CENTER>&copy; &reg;</H1>
</BODY>
</HTML>