Tvorba WWW stránek zima 2008

Předmět bude probíhat v místnosti 2071 každé podnělí od 18.20.
Zápočet bude udělen za splnění úloh. Úlohy budou doplňovány během semestru (maximálně pět).
Všechny úlohy musí být validní XHTML Strict (projít validátorem), mít validní CSS a vypadat stejně jak v Internet Exploreru tak v Mozille Firefoxu.

Seznam pracovních souborů.

Pro uložení konkrétního souboru klikněte na odkaz pravým tlačítkem a zvolte "Uložit jako".

Datum semináře	Popis souborů	Soubory
2009-01-12	MĂŠnÄ pouĹžĂvanĂŠ znaÄky, hierarchickĂŠ seznamy, definiÄnĂ seznamy, formĂĄtovĂĄnĂ pro obrazovku a tisk.	UkĂĄzkovĂ˝ soubor.
2009-01-05	UkĂĄzky PHP.	Soubor s testem, kterĂ˝ se dĂĄ odeslat ke zpracovĂĄnĂ do PHP. ZdrojovĂ˝ kĂłd vyhodnocenĂ testu v PHP. Jak se obejĂt bez rĂĄmcĹŻ za pouĹžitĂ PHP Jak se obejĂt bez rĂĄmcĹŻ za pouĹžitĂ PHP - zdrojovĂ˝ kĂłd. PrvnĂ vklĂĄdanĂ˝ soubor. DruhĂ˝ vklĂĄdanĂ˝ soubor.
2008-12-15	FormulĂĄĹe, JavaScript a absolutnĂ pozicovĂĄnĂ	FormulĂĄĹ, jehoĹž data jsou pouĹžĂvĂĄna JavaScriptem UkĂĄzka jak vyrobit rozbalovacĂ menu za pouĹžitĂ JavaScriptu a absolutnĂho pozicovĂĄnĂ.
2008-12-08	VklĂĄdĂĄnĂ strĂĄnek na internet. Registrace ve vyhledĂĄvaÄĂch. NĂĄstroje vyhledĂĄvaÄĹŻ.	ImplicitnĂ index.html soubor. ImplicitnĂ index.php soubor - sprĂĄvnÄ se zobrazĂ pouze na serverech podporujĂcĂch PHP. ZdrojovĂ˝ kĂłd index.php pĹed zpracovĂĄnĂm PHP. VnitĹnĂ strĂĄnka prezentace. UkĂĄzka souboru sitemap (soubor byl pouĹžit pro strĂĄnky http://ivopeterka.mysteria.cz).
2008-12-01	ObrĂĄzkovĂŠ mapy, rĂĄmce, plovoucĂ rĂĄmce.	ObrĂĄzkovĂĄ mapa Soubor s plovoucĂm rĂĄmcem (lze pouze v Transitional verzi HTML) Soubor s rozloĹženĂm rĂĄmcĹŻ. Soubor s menu pro rĂĄmce (bez JavaScriptu lze pouze v Transitional verzi HTML). Podklad pro obrĂĄzkovou mapu.
2008-11-24	ZĂĄloĹžky, grafickĂŠ ztvĂĄrnÄnĂ odkazĹŻ, pseudotĹĂda hover, tabulky.	Soubor html. kaskĂĄdovĂ˝ styl
2008-11-10	Nadpisy, odstavce, odrĂĄĹžky a ÄĂslovĂĄnĂ.	ZĂĄkladnĂ text k zformĂĄtovĂĄnĂ. ObrĂĄzky k textu. Dokument vytvĂĄĹenĂ˝ na seminĂĄĹi. KaskĂĄdovĂ˝ styl
2008-11-03	Barvy a obrĂĄzky - praktickĂŠ ukĂĄzky.	HTML s obrĂĄzky PĹŻvodnĂ obrĂĄzek ve formĂĄtu GIMP. ObrĂĄzek ve formĂĄtu PNG. ObrĂĄzek ve formĂĄtu JFIF/JPEG. ObrĂĄzek ve formĂĄtu GIF. PĹedloha animace ve formĂĄtu GIMP. Animace ve formĂĄtu GIF.
2008-10-20	Barvy, barevnĂŠ systĂŠmy, formĂĄty obrĂĄzkĹŻ.	Barvy a barevnĂŠ systĂŠmy (pdf) FormĂĄty obrĂĄzkĹŻ pro WWW (pdf) UkĂĄzky zĂĄpisu barev pomocĂ hexadecimĂĄlnĂho tripletu a rgb notace.
2008-10-13	TĹĂdy prvkĹŻ, plovoucĂ prvky, relativnĂ odkazy.	Soubor s plovoucĂmi prvky a prvky rĹŻznĂ˝ch tĹĂd. Soubor na nÄjĹž vede relativnĂ odkaz.
2008-10-06	ZĂĄkladnĂ struktura dokumentu, typ dokumentu, kĂłdovĂĄnĂ, blokovĂŠ a inline prvky.	ZĂĄkladnĂ struktura dokumentu, typ dokumentu, kĂłdovĂĄnĂ. BlokovĂŠ prvky, odkaz, XHTML Strict. BlokovĂ˝ prvek, HTML4 Transitional.

Zadání úloh.

Splnění těchto úloh je podmínkou udělení zápočtu.

Úloha	Snímky obrazovky
Vytvořte stránku skládající se z prvků <div> tak, jak je zobrazena na přiložených snímcích obrazovky.	Snímek Microsoft Internet Exploreru Snímek Mozilla Firefoxu
Vytvořte stránku skládající se z prvků <div>, <h1>, <h2> <p>. Žádné jiné prvky ve stránce nepoužívejte. Barevná věrnost není podstatná (pouze zachovejte postupné ztmavování pozadí zleva do prava). Důležité je rozložení popisů měst (vedle sebe a celkově vycentrované) a zachování řezů písma.	Snímek Microsoft Internet Exploreru Texty použité v úloze
Vytvořte tabulku turnaje zobrazenou na přiloženém snímku. Je důležité dodržet tvar tabulky, zvýraznění pomocí okrajů a barevné odlišení vítěze turnaje.	Snímek tabulky
Vytvořte obrázkovou mapu nad podkladovým obrázkem, tak aby oblasti odkazů pokrývaly jednotlivé piktogramy lyžařských středisek. Pozadí celého dokumentu vytvořte jako světle šedomodré.	Podklad obrázkové mapy Odkazy na střediska