15. diel - Tvorba podstránok a kontaktný formulár

V minulej lekcii, Fixné menu a pozicovanie v CSS , sme dokončili layout, teda rozloženie stránky. V dnešnom HTML / CSS tutoriálu začneme dokončovať jednotlivé podsekcie nášho webu tak, aby bol pripravený na nahranie na webhosting.

Dnes sa nebudeme učiť nič nové, len dokončíme kontaktnú stránku. Podstránky domov, zručnosti a kontakt máme už rozpracované.

Odkazy v layoutu

Otvoríme si naposledy súbor rozlozeni.html a do navigačného menu pridáme odkazy na jednotlivé podstránky:

<ul>
    <li class="aktivni"><a href="index.html">Domů</a></li>
    <li><a href="omne.html">O mně</a></li>
    <li><a href="dovednosti.html">Dovednosti</a></li>
    <li><a href="reference.html">Reference</a></li>
    <li><a href="kontakt.html">Kontakt</a></li>
</ul>

Vytvorenie podstránok

Asi si kladiete otázku, akým spôsobom docielime to, aby sa všetky podstránky na našom webe zobrazovali v nami vytvorenom layoutu.

Rámca

V minulosti sa na tento účel využívali rámca (tag <frameset>), ktoré umožňovali layout definovať iba raz a podstránky sa zobrazovali v rámcoch. Tento spôsob však predstavoval veľa problémov najmä pre internetové vyhľadávače, preto boli rámca vo verzii HTML 5 odstránené a označené za nevalidný. V dnešnej dobe je veľkou chybou rámca používať.

Tabuľkový layout

Druhým spôsobom, bohužiaľ o nič šťastnejším, je použitie tabuľky k vytvoreniu layoutu. Tabuľka má totiž vo vykresľovaní buniek miernej odlišnosti a umožňuje vloženie riadkového rámu (