TNPW 1

TNPW1

TNPW1 - technologie pro publikování na webu 1

Náplní předmětu technologie pro publikování na webu 1 je podat studentům potřebné informace k tvorbě validních XHTML 1.0 Strict stránek. Není kladen důraz na dobré grafické zpracování, ale na čistý přehledný kód a použití kaskádových stylů, které dovolují oddělit formátování od obsahu. Předmět začíná vysvětlením základních principů WWW, protokolu HTTP, překladu symbolických doménových jmen na IP adresy apod. Dále se pokračuje praktickým zvládnutím XHTML a CSS. V kurzu je zmíněna a ukázána technologie HTML 5.

TNPW 1 je vyučováno v obou semestrech. V Zimním semestru je povinný pro AI3 a v letním pro IM3/IM5. V případě, že si student oboru, který nemá TNPW1 daném semestru povinně zapsaný, zapíše tento předmět, musí počítat s tím že jej nebude moci absolvovat z kapacitních důvodů.

TNPW1 je možno absolvovat ve zrychleném režimu. Stačí odevzdat závěrečný projekt dříve. Osobně ponechávám lhůtu 3 týdnů od začátku semestru, kdy je odevzdání "pokusné" a v případě nepřijetí projektu má student možnost odevzdat projekt v termínu řádném (konec semestru)

Závěrečný projekt - podmínka k získání zápočtu

Záverečným projektem student dokazuje osvojení praktických dovedností tvorby statických XHTML stránek. Základem úspěšného projektu je validní web splňující níže uvedená kritéria. Jako téma projektu je možné zvolit si cokoli, o čem je možné zpracovat minimálně 5 stran obsahu. Níže uvedená tabulka popisuje kritéria a jejich bodové hodnocení, kterým doporučuji věnovat pozornost. V tabulce sou uvedeny i sankce (spodní a horní hranice - podle míry "prohřešku"). Projekty se budou odevzdávat mailem (na mou školní adresu) zašlete link na umístění projektu na webu, současně s ním také zabalený projekt.  Tento způsob odevzdání je nutný k přijetí projektu. Chtěl bych upozornit, že zde neplatí kdo nic nedělá, nic nezkazí, proto se nebojte použít v projektu něco navíc, vyhrát si s formátováním. K tomuto bude samozřejmě pozitivně přihlíženo při hodnocení.

Závěrečný projekt - způsob a termín odevzdání (zimní semestr)

Níže uvedená tabulka shrnuje požadovaný způsob odevzdání projektu - důrazně žádám o dodržení! Při opoždění je samozřejmá bodová sankce (počet stržených bodů je úměrný délce zpoždění), při nedodržení předmětu mailu reálně hrozí, že projekt zapadne a nebude ohodnocen. Pak vznikají zbytečné komplikace

 Prezenční formaKombinovaná forma
Mail  Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript. Tato e-mailová adresa je chráněna před spamboty. Pro její zobrazení musíte mít povolen Javascript.
Termín  22.12.2013 prozatím neurčeno
Předmět mailu  TNPW1projekt TNPW1projektKF

Očekávaný přístup k projektu je - jako kdyby byl navrhován pro konkrétního zákazníka, který požádá o zpracování statické webové prezentace na nějaké téma. Téma webu si lze vymyslet (osobní web, fiktivní společnost či fan-stránky nějaké kapely...). Informace poskytnuté na stránkách nemusí nutně reflektovat realitu. Důležitý je přístup k tvorbě. Projekty, na kterých zůstalo kus práce, nad kterými se autoři zamýšleli, vypadají úplně jinak, než projekty, které byly stvořeny narychlo za účelem absolvování TNPW1. Tomu samozřejmě odpovídá i hodnocení.

TNPW 1 – požadavky na projekt

 

Základní vymezení

Semestrálním projektem je webová prezentace obsahující minimálně 5 stran. Webová prezentace je originálním dílem studenta. Veškeré formátování layoutu, obsahu, zajištění responzivního chování je opět originální prací studenta. Je tedy vyloučeno použití frameworků typu bootstrap, skeleton, semantic UI a podobně, které toto zajišťují automaticky, bez nutnosti porozumění problematice. Naopak, pro zajištění čistě doplňkové funkcionality (dynamická fotogalerie, responzivní menu, třídění apod.) je použití volně dostupných knihoven vítáno (jQuery, Lightbox, …). Projekt, ani žádná jeho část neporušuje autorská práva.

Téma projektu

Téma projektu si volí student sám, bez nutnosti schvalování cvičícím. Konzultace tématu je však nanejvýš vhodná. Je zakázáno vytvářet alternativní verze existujících webů, nebo weby existujících subjektů. Vhodnými tématy mohou být např. Web o konkrétním sportu, seriálu, technologii, zvířatech, zájmech atd. V případě jakékoli pochybnosti je opět nanejvýš vhodné konzultovat svůj záměr s cvičícím. Web bude v hlavičce a patičce označen jako studentský semestrální projekt.

Technické náležitosti

Základní požadavky

•Web je tematicky ucelený

•Validní podle HTML5 a CSS3

•Web je responzivní, využívající Media Queries. Existují minimálně 3 responzivní varianty, nejmenší z nich je optimalizována na šířku 480px

•Web je funkční a takřka identický v prohlížečích Chrome, Firefox, IE (Edge)

•Web je tvořen, jako by byl skutečnou zakázkou pro skutečného zákazníka. 

•Web je intuitivní a přehledný, stejně tak jeho zdrojové kódy.

Obsah

•Web je tvořen minimálně 5 stránkami, celkem by mělo být na webu minimálně 1500 slov.

•Obsah je vhodně rozvržený a čitelný. Neexistují stránky s mizivým nebo naopak předimenzovaným obsahem.

•Nadpisy a meta elementy obsahují smysluplný a unikátní text

Povinně použité elementy

•Strukturní HTML5 elementy (header, nav, footer, article, aside)

•Tabulka

•Číslovaný i nečíslovaný seznam (nav. menu se nepočítá)

•Nadpisy (minimálně první a druhá úroveň), odkazy, obrázky

•Kontejnery (div)

•Formulář

 

 

Formátování

•Pro formátování je využito CSS3, stylopis je definován v externím souboru

•V CSS jsou definovány styly pro všechny použité vizuální elementy

•CSS je vhodně konstruovaný, selektory jsou definovány efektivně a znovupoužitelně. Jsou použity obecné i specifické selektory a dobře využitá dědičnost

•CSS obsahuje definici formátu pro tisk – kde jsou odstraněny nepotřebné elementy a je optimalizován tiskový výstup (kontrast, okraje, velikosti písem, obrázky…)

•K formátování nejsou zneužity HTML elementy (br, tabulkové rozložení, …)

•V CSS jsou použity pseudo-třídy a pseudo-elementy

 

Funkčnost webu

•Navigační menu (včetně responzivních variant)

•Fotogalerie realizovaná pomocí knihovny typu LightBox, nebo Magnific Popup

•Integrace minimálně jednoho prvku z jiného webu (Facebook, Google maps, Youtube, …)

•Integrace nějakého jQuery doplňku (slider, carousel, našeptávač, …)

•Vlastní jednoduchá jQuery funkčnost (animace, schování elementu, AJAX, …)

•Veškerý Javascriptový kód je definován v externím souboru

Přístupnost

•Barevné schéma je vhodně zvolené, barvy textů a pozadí jsou kontrastní

•Obrázky mají správně vyplněný atribut alt

•Web je použitelný, i pokud má prohlížeč zakázán Javascript

Odevzdání

Nejpozdější možný termín odevzdání je sdělen cvičícím. Projekt je publikován na webu (ideálně na lide.uhk.cz). Odevzdání probíhá zasláním e-mailu cvičícímu. Email bude obsahovat:

•URL adresu publikovaného projektu

•Přiložený zabalený projekt (kvůli velikosti lze odstranit obrázky)

•Informaci, jaký jQuery doplněk byl použit a kde se nachází

•Informaci, jaká vlastní jQuery funkcionalita byla implementována a kde se nachází

Hodnocení

Projekty jsou hodnoceny cvičícím. Za drobné nedostatky, či prohřešky jsou strhávány body úměrně k závažnosti. Projekty hrubě porušující požadavky, projekty nefunkční, v praxi nepoužitelné a nepůvodní jsou zamítány automaticky. Zamítnutý projekt nebude znovu hodnocen.

Student je povinen po ohodnocení projektu projekt odstranit. Student s publikovaným projektem nebude připuštěn ke zkoušce.

Maximum bodů z projektu je 50, minimum pro udělení zápočtu je 30.