Tvorba internetových stránek Ing. Michal Seibert E111 Konzultační hodiny: Pátek 9:00-‐10:00h
Co nás dnes čeká? • Podmínky absolvování. • Zdroje teorie a praxe. Teorie: • Domény. • HosPngy. • Návrh webu.
Účast a zápočet Účast není „povinná“, nicméně se povede prezence. Přestupy do jiných cvičení se nepovolují. Individuální studijní plán nutno oznámit ihned. Na konci semestru na podobné výmluvy nebude brán zřetel. Zápočet: individuální ústní obhajoba projektu + doplňující otázky.
Stručné podmínky zápočtu • Vytvoříte ucelenou a jednotně působící prezentaci o min. 6 stránkách. TémaPcké zaměření a obsah stránek je věcí vaší volby. Počítejte s reklamními bannery. • Navigační systém vytvoříte v podobě panelu. • Použijete interní i externí definice kaskádových stylů, vytvoříte styl pro odkazy mimo navigaci a min. 2 vlastní styly, které použijete. • Požijete JavaScriptový kód, který sami vytvoříte, nebo použijete hotové řešení, které sami upravíte. • Součása bude také formulář pro sběr informací. • Stránky budou umístěny na Internetu, doménu a hosPng si zvolíte sami. • Stránky musí být na Internetu funkční a validní na HTML i CSS (odkaz na validátory součása stránek). • Součása projektu je kompletní produkční plán.
Teorie: zdroje pro studium Existuje Hštěná literatura a hlavně nespočet webových stránek k této témaPce, pro základní zorientování například: • www.jakpsatweb.cz • www.interval.cz • www.w3.org
Praxe: prohlížeče • Zde zůstáváme na plaformě Windows, při vývoji ale musíte počítat i s dalšími. • Základní opPmalizace bude proP Chrome a Internet Exploreru. • Existují další, jaké znáte?
Praxe: webeditory • Notepad. • Další hardcore editory – UltraEdit, PSPad, Eclipse… • WYSIWYG , vizuální editory – Frontpage, Dreamweaver, SharePoint, …
SharePoint 2007 • Nepotřebuje sharepoint server. • Zdarma na webu Microsoou. • Dostupný přes SGD aplikace z homepage fakulty (ne Java 7).
• Stáhněte a nainstalujte si na vlastní počítače.
Doména • • •
• • •
Doména – idenPfikace vašeho webu. Služba Whois – www.nic.cz Jak zvolit název?
(TLD, srozumitelnost, zapamatovatelnost, relevantnost zaměření webu, …)
Vyhledejte informaci kdo je administraPvním kontaktem naší domény (vsb.cz). Kdy vyprší registrace facebook.com? Najděte si sami volnou .cz doménu. Kolik by vás vaše volba stála?
HosPng • •
HosPng – tam kde je fyzicky uložen váš web. Mnoho poskytovatelů (FORPSI, IGNUM, Czechia, Pipni, Český hosPng, Savana,…)
• •
•
Free hosPng. Jak vybrat hosPng?
(Dostupnost, skripty, databáze, prostor, návštěvnost, zálohování, support.)
Vyhledejte si několik poskytovatelů, srovnejte nabídky freehosPngů, zvolte některý. Co rozhodlo ve vaší volbě?
Návrh webu • •
Navigace, ikony, umístění a • barva. • Případ F, dělící čára.
Cesta uživatele. Schéma stránky.
Jak na vás působí web fakulty? Má dostatečnou navigaci? Jsou pro vás důležité informace na správných místech? Změnili by jste stávající stav? Jak?
Navigace Navigace je klíč, ne vyladěné barvičky. Tuny zajímavých informací jsou k ničemu, když se k nim uživatel snadno a rychle nedostane. Nebojte se použít více způsobů navigace najednou, pokud to obsah umožňuje.
Kolik (jaké druhy) navigací jste nalezli na tomto starším návrhu webu fakulty?
Obrázky, dokumenty • • •
Grafické formáty vhodné pro web JPG a PNG (GIF) x TIFF, BMP. Velikost, náhledy, galerie… Dokumenty ke stažení – buďte vstřícní k uživateli.
Rada: Naučte se alespoň základní práci s obrázky v nějakém grafickém editoru, i kdyby to mělo být Malování! hwp://www.jakpsatweb.cz/obrazky-‐priprava.html
Souhrn úkolů • • • • • • •
Stáhněte a nainstalujte na vlastní počítač Sharepoint 2007. Vyhledejte informaci kdo je administraPvním kontaktem naší domény (vsb.cz). Kdy vyprší registrace facebook.com? Najděte si sami volnou doménu. Kolik by vás vaše volba stála? Vyhledejte si několik poskytovatelů, srovnejte nabídky freehosPngů, zvolte některý. Co rozhodlo ve vaší volbě? Jaké druhy navigací jste nalezli na webu fakulty? Umíte zmenšit fotku a vytvořit její náhled? Zvládnete výřez z fotky?
Rada
•
Naučte se alespoň základní práci (ořez, změna velikosP, konverze) s obrázky v nějakém grafickém editoru, i kdyby to mělo být Malování!