Úvod do HTML

Zdrojový kód je čistý textový soubor, který má pouze jinou příponu. Aby ale vznikla úhledná stránka, musí obsahovat příkazy, které plní prohlížeč návštěvníka vaší stránky. Příkazy musí být od textu stránky nějak odděleny. Proto se HTML příkazy píší mezi "<" a ">". Aby prohlížeč věděl, kde je konec platnosti příkazu, je většina (u kterých je to nutné) příkazů párových (obsahují navíc znak "/"). Příkladem nám může být příkaz <P>Text odstavce</P>. Některé tagy mohou mít i parametry. Příklad <P ALIGN="center">Odstavec zarovnaný na střed</P>. Tagy ani jejich parametry nejsou závislé na velikosti písmen. Pro snazší přehlednost je doporučeno používat velká písmena (proto program tagy vkládá velkými písmeny).

Prohlížeče ignorují více mezer mezi slovy a i to, že kód je na novém řádku.

Prohlížeč přebytečné mezery vypustí a nahradí je jedinou. Počet slov na řádku je automaticky přizpůsoben šířce okna a je tak podle potřeby zalomen.

Pokud si chcete zalomení vynutit a pokračovat na následujícím řádku, použijte tag <BR> (klávesová zkratka SHIFT+ENTER). Nový odstavec vložíte klávesovou zkratkou CTRL+ENTER.

Pokud naopak nechcete, aby mezera mohla být případně použita jako místo pro řádkový zlom, nahraďte jí sekvencí znaků &nbsp;. Je to zápis pro nedělitelnou mezeru. Měla by být použita v následujících případech: mezi jednoslabičnou předložkou nebo spojkou a slovem k ní náležejícím, jako mezera mezi částmi data, mezi číslem a jednotkou a v dalších případech (viz. Pravidla českého pravopisu). Napsat &nbsp; může být a je na české klávesnici problém. Proto, pokud jste změnili nastavení pomocí souboru drhtml.reg, můžete používat klávesovou zkratku CTRL+Q. 

Každá stránka HTML by se měla skládat ze tří částí, na které by se nemělo zapomínat.

  1. Nejprve je nutné určit verzi jazyka HTML. I o to se stará 1st Page za vás. V každém novém dokumentu je proto na prvním řádku napsáno: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">. Tato informace prohlížeči říká, že pro tvorbu stránky použil autor, tedy vy, verzi 4.0 jazyka HTML podle standardu W3C.

  2. Po určení verze by měla následovat hlavička. Hlavička obsahuje informace, které se na stránce nezobrazují, ale prohlížeč a návštěvník může získat podrobnější informace. Nejčastěji se v této oblasti vyskytuje titulek (jméno, které se objeví v titulkovém pruhu prohlížeče), jméno autora, program, ve kterém byla stránka vytvořena, použitou znakovou sadu (viz aktualizace šablony default.htm). V novém dokumentu vypadá hlavička takto:
    <HEAD>
    <meta HTTP-EQUIV="Content-Type" content="text/html; charset=windows-1250">
    <meta HTTP-EQUIV="Content-Language" content="cs">
    <meta name="GENERATOR" content="1st Page 2000">
    <meta name="ProgId" content="1st Page 2000 2.0t">
    <meta name="AUTHOR" content="Vaše jméno">
    <META NAME="description" CONTENT="Popis stránky">
    <META NAME="keywords" CONTENT="Klíčová slova">
    <META NAME="robots" CONTENT="index,follow">
    <TITLE>Untitled</TITLE>
    </HEAD>
    Jak jste si jistě všimli, je hlavička od okolí izolována tagy <HEAD> a </HEAD>. Trochu si nyní popíšeme, co obsahuje. Nejprve je určeno kódování, poté jazyk, v jakém je stránka napsána, GENERATOR a ProgId označuje verzi a program, kterým jste stránku vytvořili, jako AUTHOR by mělo být napsáno vaše jméno, description by mělo obsahovat popis stránky (maximálně 200 znaků), keywords klíčová slova, robots, jestli může být stránka indexována ve vyhledávačích (index nebo noindex pro zákaz) a zda mají být prozkoumány odkazy (follow nebo nofollow). Mezi <TITLE> a </TITLE> napíšete již zmiňovaný titulek okna.

  3. Třetí a poslední, ale zato nejdůležitější, je tělo stránky. Zde jsou všechny příkazy, které se budou na stránce zobrazovat. Tělo je opět ohraničeno, nyní příkazy <BODY> a </BODY>.

Tag <BODY> může mít následující parametry:

background
(obrázek pozadí)

Určuje cestu k souboru s obrázkem, který má být na pozadí

bgcolor

Barva pozadí

text

Barva textu

link

Barva odkazu

vlink

Barva již navštíveného odkazu

alink

Barva aktivního odkazu

topmargin
(okraje Top)

Horní okraj

leftmargin
(okraje Left)

Levý okraj

rightmargin

Pravý okraj

bottommargin

Dolní okraj

Určení barev probíhá netradičním způsobem. Vedle polí pro určení okrajů je rámeček s textem Text Link Alink Vlink. Pokud stisknete tlačítko myši mimo text, můžete editovat barvu pozadí, po stisku tlačítka nad textem editujete příslušnou kategorii textu.

Hlavička i tělo jsou "obaleny" příkazy <HTML> a </HTML>.

Do těla si můžeme psát i poznámky. Tzv. komentáře se zapisují ve tvaru:
<!--Toto je komentář
a může být na několika řádcích->
.