Webdesignérův průvodce po HTML5 - díl nultý
HTML5 je bezpochyby tématem číslo jedna většiny dnešních webdesignérských hovorů, sporů a diskusí. Proto jsme se rozhodli věnovat se mu zde na Zdrojáku, a to podrobněji a spíš z praktického hlediska, tedy „co můžeme začít používat a k čemu je to dobré“. V dnešním díle si ujasníme, o čem vlastně bude řeč.
Seriál Webdesignérův průvodce po HTML5
- Webdesignérův průvodce po HTML5 - díl nultý
- Webdesignérův průvodce po HTML5 - nová sémantika
- Webdesignérův průvodce po HTML5 - nová sémantika II
- Webdesignérův průvodce po HTML5 - pohyblivé obrázky
- Webdesignérův průvodce po HTML5 - používáme pohyblivé obrázky
HTML5 je nástupce HTML 4.01 a po ukončení vývoje XHTML 2 hlavní cesta pro web kupředu. Specifikace je to obrovská a lidé často mluví o HTML5, ale myslí pouze jeho malý kousek. Ta totiž nepokrývá jen sémantiku a markup, ale zabývá se JavaScriptovými API, offline fungováním aplikací, kreslením v prohlížeči, a vůbec řeší mnoho věcí, které potřebujeme pro vytváření webových aplikací (taky ne náhodou se jmenovala Web Applications 1.0, když se v roce 2004 začala vyvíjet).
Motto: V poslední době všichni mluví o HTML5. Nejvyšší čas, abychom se v Čechách přidali.
Základní principy
Než se pustíme do jednotlivých specifických částí specifikace, měli bychom si uvědomit, co má HTML5 za cíl řešit a jaké principy se v něm dodržují. Budeme se na ně odkazovat v průběhu celého seriálu, protože je důležité pochopit, o co se autoři snaží. Specifikace je v mnoha bodech ještě nestabilní a mění se, ale vždy s ohledem na následující principy:
1. Kompatibilita
- Současné stránky se nesmí stát v HTML5 nevalidními, naopak. Spoustu technik, které webdesigneři dnes používají (a nyní jsou nestandardní) HTML5 nově posvěcuje. Vyskytly se obavy, že to může vést k hodně špatnému kódu (podle mě jsou opodstatněné – pozn.aut.) HTML5 je skutečně hodně volné v tom, co vám dovolí dělat. Ale jak říká Jeremy Keith, mimochodem autor nové knížky od A Book Apart – HTML5, specifikace by se neměla starat o to, jaké standardy pro psaní kódu si stanovíte. O to by se měl starat váš textový editor.
- Pokud se přidává do specifikace něco nového, musí to ve stávajících prohlížečích fungovat a nebo to nesmí stránky udělat nepoužitelnými (princip tzv. “graceful degradation”).
- Nedělejme revoluci, když evoluce funguje.
2. Užitečnost
- Řešme reálné problémy. Pojďme skvěle vyřešit 80 % nejčastějších problémů. Na zbývajících 20 % stejně skoro nikdo nenarazí a vyřešit je je pořádně složité.
- Priority jsou jasné: uživatelé > autoři > implementátoři > autoři specifikace > teoretická čistota řešení.
- Bezpečnost řešení musí být zahrnuta již ve specifikaci.
3. Interoperabilita
- Definujme jasné chování věcí tak, aby tvůrci prohlížečů nemohli používat vlastní názor na to, jak věc má fungovat, a poté bychom měli 5 různých implementací.
- Řešme co se stane, když nastane chyba.
- Pokud to jde, preferujme jednoduchá řešení.
4. Přístupnost
- Všechna řešení musí být přístupna komukoli, z jakéhokoli zařízení, v jakémkoli jazyce.
Současný stav implementace v prohlížečích
Jak sami vidíte, směr, kterým se HTML5 vydalo, je užitečnost a důraz na současné problémy. Nejedná se tedy o žádnou akademickou obludnost o devíti stech stranách. (Tedy, specifikace vlastně má přes 900 stran.) No a co na to tvůrci prohlížečů?
Pochopitelně jsou docela šťastní. Mají velké slovo v tom, co do specifikace půjde a co ne (proč specifikovat něco, co všichni odmítají implementovat). Všichni tvůrci prohlížečů na HTML5 spolupracují a snaží se, aby jejich prohlížeče podporovaly co největší část. I Microsoft oznámil podporu částí HTML5 v IE9. A ostatní také poctivě implementují. Nejdále je zatím asi Webkit, tedy Safari a Chrome, a Gecko, tedy Firefox. Ostatně porovnejte si to sami v přehledu toho, co kdo podporuje a co ne.
Trocha historie a vývoj specifikace
Vývoj specifikace začal v roce 2004 pod hlavičkou WHATWG (Web Hypertext Application Technology Working Group), zcela mimo W3C. Skupina byla založena lidmi z Apple, Mozilla Foundation a Opera Software, kteří chtěli rozvíjet HTML a ne dělat na webu revoluci, kterou přinášelo XHTML 2.
V roce 2007 specifikaci přijalo pod svá křídla W3C. Očekává se, že specifikace by měla dojít do stádia “Candidate Recommendation” někdy v roce 2012, stavu “Recommendation” by pak měla dosáhnout v roce 2022. Takže je to běh na pořádně dlouhou trať.
Editor specifikace je Ian Hickson (v současnosti zaměstnanec Google), přezdívaný Hixie a jeho moc nad specifikací je značná. Říká se, že to tam funguje trošku jako diktatura. Osobně se mi zdá, že ať to funguje jakkoli, funguje to docela dobře.
Specifikace je rozdělená na mnoho částí a některé z těchto částí jsou poměrně stabilní a lze je používat již dnes. Tyto části také implementují tvůrci prohlížečů a my se na ně v našem seriálu zaměříme.
O čem tedy bude tento seriál
Rádi bychom v tomto seriálu pokryli všechny části HTML5. Není však v silách jednoho člověka to všechno pojmout, proto na seriálu budou spolupracovat i další autoři. (Pokud jste již vy nějakou část HTML5 použili a chtělo by se vám o tom napsat článek, prosím, ozvěte se.) Zatím jsou v plánu následující díly:
- Sémantika a markup – nové tagy jako
<article>,<header>a podobné věci <video>a<audio>– použití, problémy- Formuláře – nové atributy formulářů, jejich chování, výhody
- Microdata – další možnost jak sémanticky popisovat vaše data
- Canvas – plátno, na které můžete kreslit pomocí JavaScriptu
- Offline – vaše webové aplikace mohou běhat, i když je uživatel offline
- Geolokace – zjistěte pozici návštěvníka vašeho webu
- WAI-ARIA – accesisible rich internet application (ač není přímo součástí HTML5)
Proč HTML5 už dnes?
Mnoho webdesignérů si může položit dotaz: Proč bych se měl zajímat o HTML5, když jej mnoho prohlížečů ještě nepodporuje a specifikace má být hotová v roce 2022?
Samozřejmě můžete psát v HTML 4.01, XHTML 1.0, v čemkoli, co vám funguje. Je ale třeba si uvědomit, že dnes na webu nejsou různé verze HTML. Je jen jedna – tu kterou znají prohlížeče. Hrátky s tím, jakou verzi používáme, jsou dobré leda pro validátory. I proto zavádí HTML5 Doctype <!DOCTYPE html>. Tedy – prostě HTML. Ale o tom více v dalším díle. Takže tím, že nebudete používat HTML5, se vlastně okrádáte o funkce, které stejně již některé prohlížeče umí.
A není jich málo. Již dnes můžete používat hromadu věcí z HTML5, mohou vám ušetřit spoustu práce a nadchnout uživatele nových prohlížečů. Uživatelé starších prohlížečů je prostě nebudou moci využít. Například tak můžete nabídnout uživatelům Chrome, Firefoxu (a dalších) používat vaši webovou aplikaci offline, zatímco uživatel IE7 ji prostě bude moci používat pouze online. To přeci ničemu nevadí a uživatelů nových prohlížečů vás budou mít rádi. A protože jsou to vaši zákazníci (nebo vašich klientů), tak to je sakra dobrá věc, ne?
Další dobrý důvod je, že většina moderních mobilních zařízení dneska nepodporuje Flash nebo je jeho podpora skutečně špatná. A například společnost Apple dala jasně najevo, že jeho podporu ani neplánuje a sází na HTML5. Jak chcete tedy bez HTML5 přehrávat video pro všechny uživatele těchto zařízení? Tato zařízení mají skvělé webové prohlížeče a používání HTML5 vám může přinést náskok na rychle nastupujícím mobilním trhu. Což je zase dobré pro business.
A nakonec – je přeci dobré být v obraze a vědět, na čem se pracuje. Pracujeme v oboru, který se mění ze dne na den a zkoumat nové věci a experimentovat s nimi k našemu řemeslu prostě patří. Pokud vás to nebaví, zauvažujte nad tím, zda je pro vás tahle práce vhodná. Není rozhodně nutné všechno nasazovat na klientské weby, ale třeba na osobní blog, kam stejně chodí hlavně webdesigneři vybaveni nejnovějšími prohlížeči? To je přeci “cool”, ne?
Dost řečí. Co bude příště?
Příště už se skutečně podíváme HTML5 pořádně na zoubek. Na úvod jsem si dal své oblíbené téma sémantiky a snad se vejdu do jednoho článku. Takže zase za týden.
Do té doby si třeba poslechněte 2. díl The Big Web Show s Jeffrey Zeldmanem, Danem Benjaminem a hostem Jeremy Keithem o HTML5 (anglicky) a potom si objednejte Jeremyho knížku z A Book Apart (zase anglicky).
A pokud by vám to náhodou nestačilo, tak si můžeme o HTML5 povídat v diskusním fóru tady na Zdrojáku.
Školení Google Analytics pro pokročilé

- Jak využít nové funkce Google Analytics
- Vyhodnocování kampaní díky používání Multichannel funnels
- Kde návštěvníci vašeho webu utíkají z objednávacího procesu.
- Nebudete opakovat časté chyby při vyhodnocování dat o návštěvnosti.
Detailní informace o školení Google Analytics pro pokročilé »
Seriál Webdesignérův průvodce po HTML5
- Webdesignérův průvodce po HTML5 - díl nultý
- Webdesignérův průvodce po HTML5 - nová sémantika
- Webdesignérův průvodce po HTML5 - nová sémantika II
- Webdesignérův průvodce po HTML5 - pohyblivé obrázky
- Webdesignérův průvodce po HTML5 - používáme pohyblivé obrázky
Přehled názorů
Tento text je již více než dva měsíce starý. Chcete-li na něj reagovat v diskusi, pravděpodobně vám již nikdo neodpoví. Pro řešení aktuálních problémů doporučujeme využít naše diskusní fórum.