Co to vlastně budeme dělat a proč

Než začneme, měli bychom mít aspoň základní přehled o tom, co a proč budeme dělat.

Do html souboru uložíme HTML kód; prohlížeč podle tohoto kódu zobrazí stránku.

Co je HTML soubor

Je to obyčejný textový soubor, který má příslušnou příponu, na naší úrovni bude stačit přípona htm nebo html.

Když uděláte úplně nový obyčejný neformátovaný textový soubor (myšleno v poznámkovém bloku neboli notepadu, nikoli ve wordu), napíšete do něj jenom: tohle je html soubor, uložíte ho jako třeba stranka.htm a otevřete ho v prohlížeči, ukáže se nápis "tohle je html soubor". Takže by to stačilo, ale takhle žádné stránky nevypadají.

Pomocí značek neboli tagů , což jsou výrazy značkovacího jazyka HTML, bychom měli jednotlivé části textu označit podle toho, co představují - odstavec, nadpis, seznam... Navíc máme možnost do stránky podobným způsobem zadat informace o dokumentu, typu kódování, vkládat obrázky atd.; a také použít tagy, které nám umožní upravit vzhled stránky.

Podrobněji se na to podíváme později.

K pojmenovávání souborů

V názvech souborů nikdy nepoužívejte diakritiku (háčky a čárky) a mezery. Ty by mohly způsobit nefunkčnost webu. A zároveň doporučuju vůbec v názvech souborů nepoužívat velká písmena.

Při surfování jste si určitě všimli, že hlavně při prvním vstupu na stránky nemusíte vypisovat název stránky včetně přípony; zadáváte prostě www.peknestranky.cz. Když pak kliknete na nějaký odkaz, už se asi adresa změní např. na www.peknestranky.cz/jak-na-to.htm. Ale i ta úvodní stránka je tvořena nějakým souborem - na serveru je zadáno, která stránka se má zobrazit, pokud si návštěvník žádnou přesně nezvolí. Většinou je nastavení takové, že je to stránka s názvem index.htm, proto je rozumné takhle pojmenovat úvodní stránku vašeho webu.

Prohlížeč

- pro většinu je to synonymum pro Internet Explorer, zkráceně IE. Protože je k dispozici v každých windowsech, spousta lidí si ho ztotožní s "internetem" jako takovým. Je ale dobré vědět, že existují i další, pro Windows např. Mozilla Firefox (FF) nebo Opera. Tak ten se musí nějak dozvědět, co má zobrazit. Do detailů nebudu zabíhat; smiřte se prostě s tím, že když v prohlížeči zadáte adresu (něco jako www.peknestranky.cz), a jste připojeni na internet, prohlížeč si sám zjistí, kde se ty stránky nacházejí, tj. kde je má hledat a co má dělat. O to se starat nemusíte, aspoň ne na naší úrovni. Prohlížeč se tímto způsobem dostane tam kam má, a bude tam hledat stránku, kterou po něm chceme zobrazit - tj. bude se shánět po výše zmíněném html souboru, neboli textovém souboru obsahujícím html kód. Ten si prohlížeč přečte a udělá, co se mu řekne, tj. zobrazí stránku.

Co je to vlastně (X)HTML

<p> text </p>
začátek tagu text konec tagu

Jen pár slov k HTML, ostatní bude jednodušší z praxe. Trochu to tady míchám, ale budu tady psát o striktním XHTML 1.0, alespoň pokud mé znalosti dovolí. Jak se určí verze HTML, najdete dále. Obecně si dovolím používat termín kód html . Ostatně rozdílů mezi HTML a XHTML zase není tolik.

Doporučená četba: Bezproblémový přechod na XHTML.

Jde o značkovací jazyk, to znamená, že jeho pomocí označkujeme části textu, hodnoty a pod. tak, aby bylo prohlížeči jasné, co mu sdělujeme. Ty značky se jmenují tagy a uzavírají se do špičatých závorek. Obvykle mají jednu část začáteční a jednu koncovou; mezi nimi je např. text. Mohou se ale také skládat pouze z jedné části, jak uvidíte. Konec tagu je označen lomítkem. Základní struktura tedy je:

<p> text odstavce </p>

Modře označené znaky tvoří kompletní párový tag, skládající se ze dvou částí, zde konkrétně tag pro označení odstavce.

Nejjednodušším příkladem jednodílného tagu je třeba <br /> .

Tagy se nesmějí křížit! Toto je špatně:

<p> <a> text </p> </a>

Firefox: Objevte znovu web
píše -dis- bb(zavináč)choltice.eu